cc4-embedded-system 3.1.8 → 3.1.10

package/README.md

@@ -2,19 +2,30 @@
 - This version based on [html-minifier-next](https://github.com/j9t/html-minifier-next) and rewrite [lwIP makefsdata](https://github.com/m-labs/lwip/tree/master/src/apps/httpd/makefsdata), run on localhost, default port: ```3000```.
 - This tool is deployed on [npm package](https://www.npmjs.com/package/cc4-embedded-system).
 
-![](./Screenshot/v3.1.6.png)
+## Demo
+- Select input directory
+
+![](./Screenshot/inputs.png)
+- Select output file path
+
+![](./Screenshot/output.png)
+- Result
+
+![](./Screenshot/v3.1.10.png)
 
 ## Structure
 ```text
 CC4EmbeddedSystem/
 ├── src/
 │   ├── gui.ts        // Express server & CLI entry point
-│   │   ├── utils.ts  // To get latest tool version
+│   │   └── utils.ts  // To get latest tool version
 │   └── makefsdata.ts // Core C code generation & minification logic
 ├── public/
 │   └── index.html    // Web GUI dashboard
 ├── Sereenshot/
-│   └── v3.1.6.png    // Demo image
+│   ├── inputs.png    // Demo image
+│   ├── output.png    // Demo image
+│   └── v3.1.10.png   // Demo image
 ├── node_modules/     // Required submodules during development
 ├── dist/             // Compiled JavaScript output (Auto-generated)
 ├── package.json      // Project configuration & dependencies
@@ -37,6 +48,10 @@ CC4EmbeddedSystem/
     ```bash
     cc4es --port 3002
     ```
+- Update
+  ```bash
+  npm install -g cc4-embedded-system@latest
+  ```
 ### Development
 ```bash
 # build
@@ -47,8 +62,10 @@ npm link
 cc4es
 
 # publish
+npm whoami # verify
 npm login
-# npm version patch # if increase version
-npm run build
+npm version patch --no-git-tag-version # if increase version
+npm run dev # dev mode for testing
+npm run build # build the newest
 npm publish --access public
 ```

package/dist/makefsdata.js

@@ -322,10 +322,12 @@ export async function runMakeFsData(opts) {
     if (rootNode) {
         cOutput += `#define FS_ROOT file_${rootNode.varName}\n#define FS_NUMFILES ${orderedFileEntries.length + (hasRealRedirhome ? 0 : 1)}\n`;
         fs.writeFileSync(opts.outputFile, cOutput);
+        const convertedSize = fs.statSync(opts.outputFile).size;
         console.log(`\n✨ Success! Output written to: ${opts.outputFile}`);
         return {
             originalSize: totalOriginalSize,
             compressedSize: totalCompressedSize,
+            convertedSize: convertedSize,
             filesCount: orderedFileEntries.length
         };
     }

package/dist/public/index.html

@@ -57,7 +57,7 @@
         <label>Input Directory</label>
         <div class="input-row">
             <input type="text" id="inputPath" placeholder="e.g., C:\Project\web">
-            <button type="button" class="btn-browse" onclick="handleBrowse('inputPath', 'dir')">Brows ...</button>
+            <button type="button" class="btn-browse" onclick="handleBrowse('inputPath', 'dir')">Browse ...</button>
         </div>
     </div>
 
@@ -65,7 +65,7 @@
         <label>Output File (fsdata.c)</label>
         <div class="input-row">
             <input type="text" id="outputPath" placeholder="e.g., ./fsdata.c">
-            <button type="button" class="btn-browse" onclick="handleBrowse('outputPath', 'file')">Brows ...</button>
+            <button type="button" class="btn-browse" onclick="handleBrowse('outputPath', 'file')">Browse ...</button>
         </div>
     </div>
 
@@ -98,6 +98,7 @@
         <div class="stats-title">📊 Compression Analysis</div>
         <div class="stats-info">
             <span>Compressed: <span id="compSize" style="color: #9cdcfe;">0</span> KB</span>
+            <span>Converted: <span id="convSize" style="color: #dcdcaa;">0</span> KB</span>
             <span>Original: <span id="origSize" style="color: #ce9178;">0</span> KB</span>
         </div>
         <div class="bar-container">
@@ -261,9 +262,10 @@
                 const panel = document.getElementById('statsPanel');
                 panel.style.display = 'block';
 
-                const { originalSize, compressedSize } = result.stats;
+                const { originalSize, compressedSize, convertedSize } = result.stats;
                 const origKB = (originalSize / 1024).toFixed(2);
                 const compKB = (compressedSize / 1024).toFixed(2);
+                const convKB = (convertedSize / 1024).toFixed(2);
                 
                 // ratio: the saved percentage
                 const ratio = originalSize > 0 ? (((originalSize - compressedSize) / originalSize) * 100).toFixed(1) : 0;
@@ -272,6 +274,7 @@
 
                 document.getElementById('origSize').innerText = origKB;
                 document.getElementById('compSize').innerText = compKB;
+                document.getElementById('convSize').innerText = convKB;
                 document.getElementById('barText').innerText = `${ratio}% Size Reduced`;
                 
                 // actual used percentage
@@ -314,4 +317,4 @@
 </div>
 
 </body>
-</html>
+</html>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cc4-embedded-system",
-  "version": "3.1.8",
+  "version": "3.1.10",
   "description": "A modern typescript version of makefsdata based on html-minifier-next and lwIP v1.3.1",
   "bin": {
     "cc4es": "dist/gui.js"