added readme.md

README.md

@@ -1,70 +1,35 @@
-# Getting Started with Create React App
+# ROG AURA CORE GUI (Ubuntu)
 
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
+This project was built with [Electron](https://www.electronjs.org/). Original rogauracore tool can be found at [Will Roberts Repository](https://github.com/wroberts/rogauracore).
 
-## Available Scripts
-
-In the project directory, you can run:
-
-### `npm start`
-
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
-
-The page will reload if you make edits.\
-You will also see any lint errors in the console.
-
-### `npm test`
-
-Launches the test runner in the interactive watch mode.\
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
-
-### `npm run build`
-
-Builds the app for production to the `build` folder.\
-It correctly bundles React in production mode and optimizes the build for the best performance.
-
-The build is minified and the filenames include the hashes.\
-Your app is ready to be deployed!
-
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
-
-### `npm run eject`
+## Feature
+- Single Section Color
+  - Static
+  - Breathing
+  - Color cycle
+- Multi Section Color (4 Zone)
+  - Static
+  - Breathing
 
-**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
 
-If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
+## Downloads
+This package only available in deb file. If you need other distributions you can directly clone this repo and build your own.
 
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
+## Installation
+1. Download the file in [here]().
+2. `cd ` into file directory.
+3. run `sudo dpkg -i "replace with filename"` or you can open the file directly if you have `.deb` installer.
 
-You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
-
-## Learn More
-
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
-
-To learn React, check out the [React documentation](https://reactjs.org/).
-
-### Code Splitting
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
-
-### Analyzing the Bundle Size
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
-
-### Making a Progressive Web App
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
-
-### Advanced Configuration
+## Available Scripts
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
+In the project directory, you can run:
 
-### Deployment
+` npm run dev `
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
+Runs the app in the development mode with developer tools. The app will reload if you make edits. 
+You will also see any lint errors in the console. 
 
-### `npm run build` fails to minify
+`npm run build`
 
-This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
+Builds the app for production to the `build` folder and `dist` folder.\
+It correctly bundles React in production mode and optimizes the build for the best performance. It also pack the application into `.deb` package.

package.json

@@ -73,7 +73,8 @@
     },
     "files": [
       "build/**/*",
-      "package.json"
+      "package.json",
+      "assets/**"
     ],
     "publish": {
       "provider": "github",
@@ -82,6 +83,9 @@
     },
     "extraResources": [
       "./bin/**"
-    ]
+    ],
+    "directories": {
+      "buildResources": "assets"
+    }
   }
 }

public/electron.js

@@ -34,6 +34,7 @@ function createWindow() {
   if (isDev) {
     win.webContents.openDevTools({ mode: "detach" });
   }
+
   if (!isDev) {
     win.removeMenu();
   }

src/App.js

@@ -14,6 +14,7 @@ import {
   Radio,
   Slider,
   Button,
+  Checkbox,
 } from "@mui/material";
 import MuiAlert from "@mui/material/Alert";
 import React from "react";
@@ -46,6 +47,7 @@ function App() {
   const [color2D] = useDebounce(color2, 200);
   const [color3D] = useDebounce(color3, 200);
   const [color4D] = useDebounce(color4, 200);
+  const [forceReload, setForceReload] = React.useState(false);
   let rogAuraExecPath = "";
   const [selectedColor, setSelectedColor] = React.useState(0);
   const handleChangeEffect = (event, newValue) => {
@@ -77,6 +79,10 @@ function App() {
     });
   };
 
+  const handleChangeForceReload = (event) => {
+    setForceReload(event.target.checked);
+  };
+
   const handleChangePicker = (newColor) => {
     switch (selectedColor) {
       case 0:
@@ -113,21 +119,23 @@ function App() {
       }
       rogAuraExecPath = join(appPath + "/bin/rogauracore");
     }
-    let execCmd = ``;
+    let auraCoreCmd = ``;
     // single section
     if (colorCount === 0) {
       switch (effect) {
         case "static":
-          execCmd = `${rogAuraExecPath} single_static ${color1D.substring(1)}`;
+          auraCoreCmd = `${rogAuraExecPath} single_static ${color1D.substring(
+            1
+          )}`;
           break;
         case "breathing":
-          execCmd = `${rogAuraExecPath} single_breathing ${color1D.substring(
+          auraCoreCmd = `${rogAuraExecPath} single_breathing ${color1D.substring(
             1
           )} ${color2D.substring(1)} ${speed}`;
 
           break;
         case "cycle":
-          execCmd = `${rogAuraExecPath} single_colorcycle ${speed}`;
+          auraCoreCmd = `${rogAuraExecPath} single_colorcycle ${speed}`;
           break;
         default:
           break;
@@ -136,14 +144,14 @@ function App() {
       // multiple section
       switch (effect) {
         case "static":
-          execCmd = `${rogAuraExecPath} multi_static ${color1D.substring(
+          auraCoreCmd = `${rogAuraExecPath} multi_static ${color1D.substring(
             1
           )} ${color2D.substring(1)} ${color3D.substring(
             1
           )} ${color4D.substring(1)}`;
           break;
         case "breathing":
-          execCmd = `${rogAuraExecPath} multi_breathing ${color1D.substring(
+          auraCoreCmd = `${rogAuraExecPath} multi_breathing ${color1D.substring(
             1
           )} ${color2D.substring(1)} ${color3D.substring(
             1
@@ -154,21 +162,13 @@ function App() {
           break;
       }
     }
-    console.log(
-      `pkexec sh -c "${rogAuraExecPath}  initialize_keyboard; echo '${brightness}' > /sys/class/leds/asus::kbd_backlight/brightness; ${execCmd}; systemctl restart upower.service"`
-    );
-    exec(
-      `pkexec sh -c "${rogAuraExecPath}  initialize_keyboard; echo '${brightness}' > /sys/class/leds/asus::kbd_backlight/brightness; ${execCmd}; systemctl restart upower.service"`,
-      (err, stdout, stderr) => {
-        handleClose();
-        if (err) {
-          handleOpenSnackbar(
-            "Oops snap!.. we couldn't apply ur settings",
-            "error"
-          );
-        }
-      }
-    );
+    let execCmd = `pkexec sh -c "${rogAuraExecPath}  initialize_keyboard; echo '${brightness}' > /sys/class/leds/asus::kbd_backlight/brightness; ${auraCoreCmd}"`;
+    if (forceReload) {
+      execCmd = `pkexec sh -c "${rogAuraExecPath}  initialize_keyboard; echo '${brightness}' > /sys/class/leds/asus::kbd_backlight/brightness; ${auraCoreCmd}; systemctl restart upower.service"`;
+    }
+    exec(execCmd, (err, stdout, stderr) => {
+      handleClose();
+    });
   };
 
   const renderColorSelection = () => {
@@ -327,7 +327,7 @@ function App() {
       sx={{
         bgcolor: "#ebeef3",
         display: "flex",
-        height: "575px",
+        height: "600px",
         padding: 5,
       }}
     >
@@ -436,10 +436,17 @@ function App() {
                   min={1}
                   max={3}
                   marks
-                  sx={{ marginBottom: 2 }}
+                  sx={{ marginBottom: 2, padding: 3 }}
                 />
               </React.Fragment>
             )}
+            <FormControlLabel
+              value={forceReload}
+              onChange={handleChangeForceReload}
+              control={<Checkbox name="forceReload" />}
+              label="Force Reload System Power"
+              sx={{ marginBottom: 2 }}
+            />
             <Button variant="contained" onClick={handleApplySettings}>
               Apply
             </Button>