Add files via upload

main.js

@@ -1,3 +1,5 @@
+// main.js
+
 const { app, BrowserWindow, ipcMain , Menu , session } = require('electron');
 const path = require('path');
 const fs = require('fs');
@@ -8,7 +10,7 @@ const options = {
     width: 800,
     height: 600,
     resizable : true ,
-    title: true,
+    title: true, // Changed default to true
     title_text: 'EMWebKit',
     title_style: 'hiddenInset',
     title_symbol_color: '',
@@ -26,7 +28,7 @@ function loadConfig(configPath) {
     try {
         const configContents = fs.readFileSync(configPath, 'utf8');
         const configOptions = JSON.parse(configContents);
-
+        // Merge default options with the ones from the config file
         Object.assign(options, configOptions);
     } catch (error) {
         console.error('Error loading config file:', error);
@@ -50,17 +52,17 @@ function createWindow() {
         title: options.title_text,
         titleBarStyle: options.title_style,
         titleBarOverlay: {
-            color: options.title_bar_color, 
+            color: options.title_bar_color, // Set your desired color
             symbolColor: options.title_symbol_color,
-        }, 
-        frame: options.title, 
+        }, // Color for window control symbols (minimize, maximize, close)
+        frame: options.title, // Show or hide the title bar based on the title option
         webPreferences: {
             preload: path.join(__dirname, 'preload.js')
         }
     };
 
 
-
+    // Set position or center based on options.center
     if (options.center) {
         mainWindowOptions.center = true;
     } else {
@@ -73,7 +75,6 @@ function createWindow() {
         return newURL.startsWith(options.url_style);
     };
 
-    // if smth like native menu bar is needed create it with html , css and js
     const customMenuTemplate = [];
     const customMenu = Menu.buildFromTemplate(customMenuTemplate);
     Menu.setApplicationMenu(customMenu);
@@ -93,14 +94,14 @@ function createWindow() {
         mainWindow.webContents.on('will-navigate', (event, newURL) => {
             if (!isUrlAllowed(newURL)) {
                 event.preventDefault();
-                mainWindow.loadURL(options.url_style); 
+                mainWindow.loadURL(options.url_style); // Redirect back to the original URL
             }
         });
 
         mainWindow.webContents.on('new-window', (event, newURL) => {
             if (!isUrlAllowed(newURL)) {
                 event.preventDefault();
-                mainWindow.loadURL(options.url_style); 
+                mainWindow.loadURL(options.url_style); // Redirect back to the original URL
             }
         });
     }
@@ -123,9 +124,11 @@ function createWindow() {
         const webContents = event.sender
         const win = BrowserWindow.fromWebContents(webContents)
         console.log(value)
-        if (value == 'true') { 
+        if (value == 'true') {
+            // Set the window to full screen
             win.setFullScreen(true);
         } else {
+            // Exit full screen
             win.setFullScreen(false);
         }
     })
@@ -143,8 +146,8 @@ function createWindow() {
         const webContents = event.sender
         const win = BrowserWindow.fromWebContents(webContents);
         titleBarOverlay = {
-            color: back_color, 
-            symbolColor: symbol_color, 
+            color: back_color, // Set your desired title bar color
+            symbolColor: symbol_color, // Set the color for window control symbols
         }
         win.setTitleBarOverlay(titleBarOverlay);
     })
@@ -166,6 +169,22 @@ function createWindow() {
             win.setResizable(false);
         }
     })
+
+    ipcMain.on('win-center' , (event) =>{
+        const webContents = event.sender
+        const win = BrowserWindow.fromWebContents(webContents)
+        win.center();
+    })
+
+    ipcMain.on('win-size' , (event , height , width , animate) =>{
+        const webContents = event.sender
+        const win = BrowserWindow.fromWebContents(webContents)
+        if (animate == 'true'){
+            win.setSize(width, height, true);
+        }else{
+            win.setSize(width, height, false);
+        }
+    })
 }
 
 app.whenReady().then(() => {
@@ -187,4 +206,4 @@ app.on('window-all-closed', () => {
     }else{
         session.defaultSession.clearStorageData()
     }
-});
+});

preload.js

@@ -6,5 +6,7 @@ contextBridge.exposeInMainWorld('Backend', {
   close_window: (value) => ipcRenderer.send('close-window', value),
   title_bar_overlay: (symbol_color , back_color) => ipcRenderer.send('title-bar-overlay', symbol_color , back_color),
   win_minimize: (value) => ipcRenderer.send('win-minimize', value),
-  win_resizable: (value) => ipcRenderer.send('win-resizable' , value)
+  win_resizable: (value) => ipcRenderer.send('win-resizable' , value),
+  win_center: () => ipcRenderer.send('win-center'),
+  win_size: (height , width , animate) => ipcRenderer.send('win-size' , height , width , animate),
 })

welcome.html

@@ -72,15 +72,16 @@ <h4 style="text-align: center;">MUTEXIS_KIT.js:</h4>
             <br><br>
             To restrict navigation to other websites and keep users within your designated web environment, set 'strict_url' to true. Then, use 'url_style' to define the URL pattern that should be consistently checked upon navigation.
             <br><br>
-            for changing title dynamically: window.Backend.setTitle(title) , for full screen : window.Backend.full_screen("true") , for closing the app : window.Backend.close_window("true") , for changing color of title bar overlay dynamically in your MUTEXIS_KIT.json file set the title_style to hidden and use this window.Backend.title_bar_overlay("#051be1" , "#051be1") func in the frontend , you can use title_style hiddenInset for normal one , for minimizing the window window.Backend.win_minimize('true') , for making window resizable window.Backend.win_resizable('true') and vice versa
+            for changing title dynamically: window.Backend.setTitle(title) , for full screen : window.Backend.full_screen("true") , for closing the app : window.Backend.close_window("true") , for changing color of title bar overlay dynamically in your MUTEXIS_KIT.json file set the title_style to hidden and use this window.Backend.title_bar_overlay("#051be1" , "#051be1") func in the frontend , you can use title_style hiddenInset for normal one , for minimizing the window window.Backend.win_minimize('true') , for making window resizable window.Backend.win_resizable('true') and vice versa , for making window come to the center window.Backend.win_center() , for setting width and height window.Backend.win_size(1000 , 1000 , "false") if true is set window will change height smoothly
         </p>
     </div>
     <!--
     <button id="btn1" type="button">full_screen</button>
     <script>
         const fss = document.getElementById('btn1')
         fss.addEventListener('click', () => {
-            window.Backend.win_resizable('false')
+            
+            window.Backend.win_size(1000 , 1000 , "false")
         })
     </script>
     -->