svelteesp32 1.0.1 → 1.0.3

package/README.md

@@ -12,7 +12,7 @@ This npm package provides a solution for **inserting any JS client application i
 
 Install package as devDependency (it is practical if the package is part of the project so that you always receive updates)
 
-```
+```bash
 npm install -D svelteesp32
 ```
 
@@ -46,3 +46,33 @@ void setup()
     initSvelteStaticFiles(&server);
 }
 ```
+
+The content of generated file (do not edit, just use)
+
+```c
+void initSvelteStaticFiles(PsychicHttpServer * server) {
+    server->on("assets/index-KwubEIf-.js", HTTP_GET, [](PsychicRequest * request)
+    {
+        const uint8_t data[] = {0x1f, 0x8b, 0x8, 0x0, 0x0, ...}
+
+        PsychicStreamResponse response(request, "application/javascript");
+        response.addHeader("Content-Encoding", "gzip");
+        response.beginSend();
+        for (int i = 0; i < sizeof(data); i++) response.write(data[i]);
+        return response.endSend();
+    });
+
+    server->on("assets/index-Soe6cpLA.css", HTTP_GET, [](PsychicRequest * request)
+    {
+        const uint8_t data[] = {0x1f, 0x8b, 0x8, 0x0, 0x0, ...}
+
+        PsychicStreamResponse response(request, "text/css");
+        response.addHeader("Content-Encoding", "gzip");
+        response.beginSend();
+        for (int i = 0; i < sizeof(data); i++) response.write(data[i]);
+        return response.endSend();
+    });
+
+    ...
+}
+```

package/bin/index.js

@@ -0,0 +1,2 @@
+#! /usr/bin/env node
+const start = require('../dist/index.js');

package/dist/cppCode.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="node" />
 export type cppCodeSource = {
+    index: number;
     filename: string;
     mime: string;
     content: Buffer;
     isGzip: boolean;
 };
-export declare const getCppCode: (source: cppCodeSource) => string;
-export declare const adoptMethodName: (content: string) => string;
+export declare const getCppCode: (sources: cppCodeSource[]) => string;

package/dist/cppCode.js

@@ -1,28 +1,50 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.adoptMethodName = exports.getCppCode = void 0;
+exports.getCppCode = void 0;
 const commandLine_1 = require("./commandLine");
-const containerTemplate = `
-void $method(PsychicHttpServer * server) {
-$code
-}`;
-const codeTemplate = `
-	server->on("$filename", HTTP_GET, [](PsychicRequest * request)
-	{
-		const uint8_t data[] = {$numbers};
-
-		PsychicStreamResponse response(request, "$mime");
-		$encoding
-		response.beginSend();
-		for (int i = 0; i < sizeof(data); i++) response.write(data[i]);
-		return response.endSend();
-	});
+const replaceAll = (s, from, to) => {
+    while (s.includes(from))
+        s = s.replace(from, to);
+    return s;
+};
+const blockTemplate = `
+  $default$server->on("/$filename$", HTTP_GET, [](PsychicRequest * request)
+  {
+    PsychicResponse response(request);
+    response.setContentType("$mime$");
+    response.addHeader("Content-Encoding", "$encoding$");
+    response.setContent(data$index$, sizeof(data$index$));
+    return response.send();
+  });
 `;
-const getCppCode = (source) => codeTemplate
-    .replace('$filename', source.filename)
-    .replace('$mime', source.mime)
-    .replace('$encoding', source.isGzip ? 'response.addHeader("Content-Encoding", "gzip");' : '')
-    .replace('$numbers', [...source.content].map((v) => `0x${v.toString(16)}`).join(', '));
+const getCppBlock = (source) => {
+    let result = blockTemplate;
+    result = replaceAll(result, '$default$', source.filename.startsWith('index.htm') ? 'server->defaultEndpoint = ' : '');
+    result = replaceAll(result, '$index$', source.index.toString());
+    result = replaceAll(result, '$filename$', source.filename);
+    result = replaceAll(result, '$size$', source.content.length.toString());
+    result = replaceAll(result, '$mime$', source.mime);
+    result = replaceAll(result, '$encoding$', source.isGzip ? 'gzip' : 'identity');
+    return result;
+};
+const fileTemplate = `
+$arrays$
+
+void $method$(PsychicHttpServer * server) {
+$code$
+}`;
+const getCppCode = (sources) => {
+    const arrays = [];
+    const blocks = [];
+    for (const source of sources) {
+        const bytesString = [...source.content].map((v) => `0x${v.toString(16)}`).join(', ');
+        arrays.push(`const uint8_t data${source.index}[${source.content.length}] = {${bytesString}};`);
+        blocks.push(getCppBlock(source));
+    }
+    let result = fileTemplate;
+    result = replaceAll(result, '$arrays$', arrays.join('\n'));
+    result = replaceAll(result, '$method$', commandLine_1.cmdLine.espMethodName);
+    result = replaceAll(result, '$code$', blocks.join(''));
+    return result;
+};
 exports.getCppCode = getCppCode;
-const adoptMethodName = (content) => containerTemplate.replace('$method', commandLine_1.cmdLine.espMethodName).replace('$code', content);
-exports.adoptMethodName = adoptMethodName;

package/dist/index.js

@@ -13,6 +13,7 @@ const summary = {
     gzipsize: 0
 };
 const sources = [];
+let sourceIndex = 0;
 for (const file of (0, file_1.getFiles)()) {
     const mime = (0, mime_types_1.lookup)(file) || 'text/plain';
     summary.filecount++;
@@ -23,24 +24,39 @@ for (const file of (0, file_1.getFiles)()) {
         const zipContent = (0, node_zlib_1.gzipSync)(rawContent, { level: 9 });
         summary.gzipsize += zipContent.length;
         if (rawContent.length > 100 && zipContent.length < rawContent.length * 0.85) {
-            sources.push({ filename: file, content: zipContent, isGzip: true, mime });
+            sources.push({
+                index: sourceIndex++,
+                filename: file,
+                content: zipContent,
+                isGzip: true,
+                mime
+            });
             console.log(`✓ gzip used (${rawContent.length} -> ${zipContent.length})`);
         }
         else {
-            sources.push({ filename: file, content: rawContent, isGzip: false, mime });
+            sources.push({
+                index: sourceIndex++,
+                filename: file,
+                content: rawContent,
+                isGzip: false,
+                mime
+            });
             console.log(`x gzip unused (${rawContent.length} -> ${zipContent.length})`);
         }
     }
     else {
-        sources.push({ filename: file, content: rawContent, isGzip: false, mime });
+        sources.push({
+            index: sourceIndex++,
+            filename: file,
+            content: rawContent,
+            isGzip: false,
+            mime
+        });
         console.log(`- gzip skipped (${rawContent.length})`);
     }
     console.log('');
 }
-let cppFile = '';
-for (const source of sources)
-    cppFile += (0, cppCode_1.getCppCode)(source);
-cppFile = (0, cppCode_1.adoptMethodName)(cppFile);
+const cppFile = (0, cppCode_1.getCppCode)(sources);
 (0, node_fs_1.writeFileSync)(commandLine_1.cmdLine.outputFile, cppFile);
 if (commandLine_1.cmdLine.gzip)
     console.log(`${summary.filecount} files, ${Math.round(summary.size / 1024)}kB original size, ${Math.round(summary.gzipsize / 1024)}kB gzip size`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelteesp32",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Convert Svelte (or any frontend) JS application to serve it from ESP32 webserver (PsychicHttp)",
   "author": "BCsabaEngine",
   "license": "ISC",
@@ -12,9 +12,13 @@
     "npm": ">=9"
   },
   "files": [
+    "bin/*.js",
     "dist/**/*.js",
     "dist/**/*.d.ts"
   ],
+  "bin": {
+    "svelteesp32": "bin/index.js"
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/BCsabaEngine/svelteesp32.git"
@@ -24,7 +28,7 @@
   },
   "homepage": "https://github.com/BCsabaEngine/svelteesp32",
   "scripts": {
-    "dev": "nodemon src/index.ts -- -s ./svelte/dist -o ./esp32.h -g",
+    "dev": "nodemon src/index.ts -- -s ./svelte/dist -o ../../../Arduino/EspSvelte/svelteesp32.h -g",
     "clean": "tsc --build --clean",
     "build": "tsc --build --clean && tsc --build --force",
     "format:check": "prettier --check .",