update ui and webpack

index.js

@@ -6,15 +6,15 @@ const path = require('path');
 const pino = require('pino')
 const pretty = require('pino-pretty');
 const https = require('node:https');
-const LocalStorage = require('node-localstorage').LocalStorage
 
 const ipc = ipcMain
 
 const logger = pino(pretty())
-const localStorage = new LocalStorage('./data');
 
 process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = 'true';
 
+var ena_splash = process.env['CCIDE_ENABLE_MAIN_SPLASH'] == 'true';
+
 var currentprojectpath = null;
 var currentprojectname = null;
 var currentprojectopen = false;
@@ -174,7 +174,7 @@ app.whenReady().then(async () => {
             enableRemoteModule: true,
             contextIsolation: false,
         },
-        //show: false,
+        show: ena_splash,
         center: true,
     })
     
@@ -224,10 +224,13 @@ app.whenReady().then(async () => {
     });
 
     ipc.on('update-log-status', (event, status) => {
-        logger.info(status)
+        logger.info(status);
         if (!appstarted) {
-            splash.webContents.send("change-status", status)
-        } 
+            splash.webContents.send("change-status", status);
+        }
+        if (status == "Downloading blocks...") {
+            win.show();
+        }
     });
     
     //app.on('activate', () => {

package.json

@@ -1,17 +1,27 @@
 {
   "name": "ccide",
-  "version": "1.6",
+  "version": "1.6.0",
   "description": "ComputerCraft mod virtual lua IDE",
-  "main": "index.js",
+  "main": "dist/main.js",
   "scripts": {
     "dev": "title ccIDE && electron .",
     "build": "title building ccIDE && electron-packager . ccIDE --platform=win32 --arch=x64 --icon=assets/ccIDEIcon.ico --out=dist --overwrite && for /d %i in (dist\\ccIDE-*) do copy package.json %i\\",
-    "build_debug": "title building ccIDE (Debug) && electron-packager . ccIDE --platform=win32 --arch=x64 --icon=assets/ccIDEIcon.ico --out=dist_debug --overwrite --debug && for /d %i in (dist_debug\\ccIDE-*) do copy package.json %i\\"
+    "build_debug": "title building ccIDE (Debug) && electron-packager . ccIDE --platform=win32 --arch=x64 --icon=assets/ccIDEIcon.ico --out=dist_debug --overwrite --debug && for /d %i in (dist_debug\\ccIDE-*) do copy package.json %i\\",
+    "new_build": "webpack --config webpack.main.config.js && webpack --config webpack.renderer.config.js",
+    "dist": "electron-builder"
   },
   "author": "DPSoftware Foundation",
   "license": "GPL-3.0-or-later",
   "devDependencies": {
-    "electron": "^31.1.0"
+    "copy-webpack-plugin": "^12.0.2",
+    "electron": "^31.7.7",
+    "electron-builder": "^25.1.8",
+    "html-webpack-plugin": "^5.6.3",
+    "terser-webpack-plugin": "^5.3.11",
+    "webpack": "^5.97.1",
+    "webpack-cli": "^6.0.1",
+    "webpack-merge": "^6.0.1",
+    "webpack-node-externals": "^3.0.0"
   },
   "dependencies": {
     "@blockly/plugin-workspace-search": "^9.0.5",
@@ -27,5 +37,16 @@
     "toastify-js": "^1.12.0",
     "unzipper": "^0.12.3",
     "xmldom": "^0.6.0"
+  },
+  "build": {
+    "appId": "dev.dpsoftware.ccide",
+    "productName": "ccIDE",
+    "files": [
+      "dist/**/*",
+      "node_modules/**/*"
+    ],
+    "directories": {
+      "output": "release"
+    }
   }
 }

src/blocksmanager.js

@@ -4,10 +4,17 @@ const https = require('https');
 const unzipper = require('unzipper');
 const { DOMParser, XMLSerializer } = require('xmldom');
 
+
 const peripheralsfolder = path.join(__dirname, "../blocks"); 
 
 const fallbackImagePath = path.join(__dirname, '..', 'assets', 'noimagefallback.png'); // Path to fallback image
 
+if (!fs.existsSync(peripheralsfolder)) {
+    // If it doesn't exist, create it
+    fs.mkdirSync(peripheralsfolder, { recursive: true });
+    console.log('Block Folder created');
+}
+
 let progressBar = document.getElementById('progressBarloading');
 let blocks_url = "https://cdn.damp11113.xyz/file/zip/ccide/blockslastest.zip?dl=1"
 
@@ -264,9 +271,15 @@ function scanindex() {
                         
                         // Create the title element
                         const title = document.createElement('h3');
-                        title.textContent = jsonData.name + ` [v${jsonData.version} by ${jsonData.author}]`;
+                        title.textContent = jsonData.name;
                         libraryDetails.appendChild(title);
 
+                        // Create the credit and version element
+                        const cv = document.createElement('p');
+                        cv.classList.add('library-details-cv');
+                        cv.textContent = `v${jsonData.version} by ${jsonData.author}`;
+                        libraryDetails.appendChild(cv);
+
                         // Create the description element
                         const description = document.createElement('p');
                         description.innerHTML = jsonData.description;

src/index.html

@@ -118,7 +118,9 @@
                         <div class="library-item overflow-auto library-container" data-libraryfolder="name">
                             <img src="image.jpg" class="libimage" onerror="this.onerror=null;this.src='../assets/noimagefallback.png'; this.alt='No Image Available';">
                             <div class="library-details">
-                                <h3>Title [v1.0 by Author]</h3>
+                                <h3>Title</h3>
+                                <!--Add Author credit-->
+                                <h6>v1.0 by Author</h6>
                                 <p>Library description goes here.</p>
                                 <img src="../assets/basic_computer.png" class="libimageicon" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="Basic Computer">
                                 <img src="../assets/adv_computer.png" class="libimageicon" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-title="Advanced Computer">

src/styles.css

@@ -271,8 +271,13 @@ body {
 }
 .library-details {
     flex: 1;
-    line-height: 10px;
+    line-height: 5px;
 }
+.library-details-cv {
+    color: #7a7a7a;
+    font-size: 15px;
+}
+
 .library-item {
     cursor: pointer;
     padding: 10px;

webpack.main.config.js

@@ -0,0 +1,23 @@
+const path = require("path");
+const CopyWebpackPlugin = require("copy-webpack-plugin");
+const nodeExternals = require("webpack-node-externals");
+
+module.exports = {
+    mode: "production",
+    target: "electron-main", // For Electron main process
+    entry: "./src/index.js", // Adjust based on your main entry file
+    output: {
+        filename: "main.js",
+        path: path.resolve(__dirname, "dist"),
+    },
+    externals: [nodeExternals()], // Exclude node_modules
+    plugins: [
+        new CopyWebpackPlugin({
+            patterns: [
+                { from: "assets", to: "assets" },
+                { from: "blocks", to: "blocks" },
+                { from: "src/styles.css", to: "styles.css" },
+            ],
+        }),
+    ],
+};

webpack.renderer.config.js

@@ -0,0 +1,18 @@
+const path = require("path");
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+
+module.exports = {
+    mode: "production",
+    target: "web",  // This should target the web environment for the renderer process
+    entry: "./src/frontend.js", // Ensure this points to the correct renderer entry
+    output: {
+        filename: "renderer.js",
+        path: path.resolve(__dirname, "dist"),
+    },
+    plugins: [
+        new HtmlWebpackPlugin({
+            template: "src/index.html", // Ensure this injects the renderer script
+        }),
+    ],
+};
+