Merge branch 'main' into Audio

ewowi · Aug 15, 2023 · d0e848a · d0e848a
2 parents 26438f8 + c171f25
commit d0e848a
Show file tree

Hide file tree

Showing 40 changed files with 2,185 additions and 1,267 deletions.
diff --git a/data/app.js b/data/app.js
@@ -1,8 +1,8 @@
 // @title     StarMod
 // @file      app.js
-// @date      20230730
-// @repo      https://github.com/ewoudwijma/StarMod
-// @Authors   https://github.com/ewoudwijma/StarMod/commits/main
+// @date      20230810
+// @repo      https://github.com/ewowi/StarMod
+// @Authors   https://github.com/ewowi/StarMod/commits/main
 // @Copyright (c) 2023 Github StarMod Commit Authors
 // @license   GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007
 
@@ -19,7 +19,7 @@ function userFun(userFunId, data) {
     //replace the canvas: in case we switch from 2D to 3D as they cannot be reused between them
     if (jsonValues.pview.new)
     {
-      console.log("replace the canvas!")
+      console.log("replace the canvas!", jsonValues.pview);
       let canvasNode = cE("canvas");
       canvasNode.width = pviewNode.width;
       canvasNode.height = pviewNode.height;
@@ -51,7 +51,7 @@ function userFun(userFunId, data) {
 function preview2D(node, leds) {
   let ctx = node.getContext('2d');
   let i = 4;
-  let factor = jsonValues.pview.factor;
+  let factor = 10;//fixed value: from mm to cm
   ctx.clearRect(0, 0, node.width, node.height);
   if (jsonValues.pview) {
     let pPL = Math.min(node.width / jsonValues.pview.width, node.height / jsonValues.pview.height); // pixels per LED (width of circle)
@@ -90,7 +90,7 @@ function preview3D(node, leds) {
   // let mH = leds[1];
   // let mD = leds[2];
 
-  let factor = jsonValues.pview.factor;
+  let factor = 10;//fixed value: from mm to cm
   let d = 5 / factor; //distanceLED;
 
   if (!renderer || (jsonValues.pview && jsonValues.pview.new)) { //init 3D

diff --git a/data/index.css b/data/index.css
@@ -1,9 +1,9 @@
 /*
    @title     StarMod
    @file      index.css
-   @date      20230730
-   @repo      https://github.com/ewoudwijma/StarMod
-   @Authors   https://github.com/ewoudwijma/StarMod/commits/main
+   @date      20230810
+   @repo      https://github.com/ewowi/StarMod
+   @Authors   https://github.com/ewowi/StarMod/commits/main
    @Copyright (c) 2023 Github StarMod Commit Authors
    @license   GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007
 */
@@ -63,7 +63,7 @@ h1,h2 {
 	right: 0px;
 	top: 0px;
 	/* calc(var(--th) - 1px); */
-	background-color: var(--c-o);
+	background: linear-gradient(to bottom, #ffbe3390 0%, #b60f6290 100%); /*var(--c-o);*/
 	transform: translateY(100%);
 	transition: transform 0.4s;
 	padding: 8px;

diff --git a/data/index.htm b/data/index.htm
@@ -1,8 +1,8 @@
 <!-- @title     StarMod
 @file      index.htm
-@date      20230730
-@repo      https://github.com/ewoudwijma/StarMod
-@Authors   https://github.com/ewoudwijma/StarMod/commits/main
+@date      20230810
+@repo      https://github.com/ewowi/StarMod
+@Authors   https://github.com/ewowi/StarMod/commits/main
 @Copyright (c) 2023 Github StarMod Commit Authors
 @license   GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007 -->
 

diff --git a/data/index.js b/data/index.js
@@ -1,8 +1,8 @@
 // @title     StarMod
 // @file      index.css
-// @date      20230730
-// @repo      https://github.com/ewoudwijma/StarMod
-// @Authors   https://github.com/ewoudwijma/StarMod/commits/main
+// @date      20230810
+// @repo      https://github.com/ewowi/StarMod
+// @Authors   https://github.com/ewowi/StarMod/commits/main
 // @Copyright (c) 2023 Github StarMod Commit Authors
 // @license   GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007
 
@@ -71,8 +71,9 @@ function makeWS() {
             console.log("Error: no valid model", json);
         }
         else { //update
-          // console.log("WS receive update", json);
-          processUpdate(json);
+          if (!Array.isArray(json)) //only the model is an array
+            // console.log("WS receive update", json);
+            processUpdate(json);
         }
       }
     }
@@ -89,7 +90,7 @@ function makeWS() {
   }
 }
 
-function generateHTML(parentNode, json, tableRow = -1) {
+function generateHTML(parentNode, json, rowNr = -1) {
   // console.log("generateHTML", parentNode, json);
   if (Array.isArray(json)) {
     json.sort(function(a,b) {
@@ -210,7 +211,7 @@ function generateHTML(parentNode, json, tableRow = -1) {
         }
         else if (json.type == "url") {
           //tbd: th and table row outside this if
-          if (tableRow == -1) {
+          if (rowNr == -1) {
             newNode = cE("p");
             newNode.appendChild(labelNode);
             //add label
@@ -222,15 +223,15 @@ function generateHTML(parentNode, json, tableRow = -1) {
           valueNode.setAttribute('target', "_blank");
           valueNode.innerText = json.value;
 
-          if (tableRow == -1) {
+          if (rowNr == -1) {
             valueNode.id = json.id;
             newNode.appendChild(valueNode);
           } else {
-            valueNode.id = json.id + tableRow;
+            valueNode.id = json.id + "#" + rowNr;
             newNode = valueNode;
           }
         } else { //input
-          if (tableRow == -1) {
+          if (rowNr == -1) {
             newNode = cE("p");
             newNode.appendChild(labelNode);
             //add label
@@ -247,18 +248,21 @@ function generateHTML(parentNode, json, tableRow = -1) {
           if (json.type == "checkbox") {
             valueNode = cE("input");
             valueNode.type = json.type;
+            valueNode.disabled = json.ro;
             if (json.value) valueNode.checked = json.value;
             valueNode.addEventListener('change', (event) => {console.log(json.type + " change", event);setCheckbox(event.target);});
           } else if (json.type == "button") {
             valueNode = cE("input");
             valueNode.type = json.type;
+            valueNode.disabled = json.ro;
             valueNode.value = initCap(json.id);
             valueNode.addEventListener('click', (event) => {console.log(json.type + " click", event);setButton(event.target);});
           } else if (json.type == "range") {
             valueNode = cE("input");
             valueNode.type = json.type;
             valueNode.max = 255;
             // valueNode.addEventListener('input', (event) => {console.log(json.type + " input", event);gId(json.id + "_rv").innerText = this.value;});
+            valueNode.disabled = json.ro;
             valueNode.addEventListener('change', (event) => {
               console.log(json.type + " change", event.target, json.id);
               gId(json.id + "_rv").innerText = event.target.value;
@@ -294,11 +298,11 @@ function generateHTML(parentNode, json, tableRow = -1) {
             }
           } //not checkbox or button or range
 
-          if (tableRow == -1) {
+          if (rowNr == -1) {
             valueNode.id = json.id;
             newNode.appendChild(valueNode);
           } else {
-            valueNode.id = json.id + tableRow;
+            valueNode.id = json.id + "#" + rowNr;
             newNode = valueNode;
           }
 
@@ -311,8 +315,8 @@ function generateHTML(parentNode, json, tableRow = -1) {
 
     if (newNode) parentNode.appendChild(newNode); //add new node to parent
 
-    //don't call uiFun on tablerows (for the moment)
-    if (tableRow == -1) {
+    //don't call uiFun on rowNrs (for the moment)
+    if (rowNr == -1) {
       //call ui Functionality, if defined (to set label, comment, select etc)
       if (json.uiFun >= 0) { //>=0 as element in var
         uiFunCommands.push(json.id);
@@ -328,10 +332,10 @@ function generateHTML(parentNode, json, tableRow = -1) {
           divNode.id = json.id + "_n";
           divNode.classList.add("ndiv");
           newNode.appendChild(divNode);
-          generateHTML(divNode, json.n, tableRow);
+          generateHTML(divNode, json.n, rowNr);
         }
         else
-          generateHTML(newNode, json.n, tableRow); //details (e.g. module)
+          generateHTML(newNode, json.n, rowNr); //details (e.g. module)
       }
     }
     return newNode;
@@ -342,7 +346,7 @@ function flushUIFunCommands() {
   if (uiFunCommands.length > 0) { //if something to flush
     var command = {};
     command["uiFun"] = uiFunCommands; //ask to run uiFun for vars (to add the options)
-    console.log("uiFunCommands", command);
+    // console.log("flushUIFunCommands", command);
     requestJson(command);
     uiFunCommands = [];
   }
@@ -379,7 +383,7 @@ function processUpdate(json) {
 function processVarNode(node, key, json) {
   let overruleValue = false;
 
-  if (json.label) {
+  if (json.hasOwnProperty("label")) {
     console.log("processUpdate label", key, json.label);
     if (node.nodeName.toLocaleLowerCase() == "input" && node.type == "button") {
       node.value = initCap(json.label);
@@ -395,7 +399,7 @@ function processVarNode(node, key, json) {
       labelNode.innerText = initCap(json.label);
     }
   }
-  if (json.comment) {
+  if (json.hasOwnProperty("comment")) {
     console.log("processUpdate comment", key, json.comment);
     // normal: <p><label><input id><comment></p>
     // table or canvas <p><label><comment></p><canvas id>
@@ -418,7 +422,7 @@ function processVarNode(node, key, json) {
     }
     commentNode.innerText = json.comment;        
   }
-  if (json.select) {
+  if (json.hasOwnProperty("select")) {
     console.log("processUpdate select", key, json.select);
     if (node.nodeName.toLocaleLowerCase() == "span") { //readonly. tbd: only the displayed value needs to be in the select
       var index = 0;
@@ -447,15 +451,13 @@ function processVarNode(node, key, json) {
       }
     }
   }
-  if (json.table) {
-    console.log("processUpdate table", key, json.table);
+  if (json.hasOwnProperty("table")) {
     //remove table rows
     let tbodyNode = cE('tbody');
-
 
     //find model info
     let variable = findVar(key);
-    console.log("processUpdate table model", variable);
+    console.log("processUpdate table", key, variable, json.table);
 
     //add each row
     let rowNr = 0;
@@ -467,6 +469,7 @@ function processVarNode(node, key, json) {
         let tdNode = cE("td");
 
         //call generateHTML to create the variable in the UI
+        // console.log("table cell generateHTML", tdNode, variable, variable.n, colNr, rowNr);
         let newNode = generateHTML(tdNode, variable.n[colNr], rowNr); //no <p><label>
         if (newNode) {
           //very strange: gId(newNode.id) is not working here. Delay before it is in the dom??? (workaround create processVarNode function)
@@ -489,26 +492,36 @@ function processVarNode(node, key, json) {
     //replace the table body
     node.replaceChild(tbodyNode, node.lastChild); //replace <table><tbody>
   }
-  if (json.value && !overruleValue) { //after select, in case used
-    // if (key=="ledFix" || key =="ledFixGen"|| key =="reset0")
-    //   console.log("processUpdate value", key, json.value, node);
+  if (json.hasOwnProperty("value") && !overruleValue) { //after select, in case used
+    //hasOwnProperty needed to catch also boolean json.value when it is false
+    // if (key=="mdlEnabled" || key=="clIsFull" || key=="pin2")
+    //   console.log("processUpdate value", key, json, json.value, node);
     if (node.nodeName.toLocaleLowerCase() == "span") //read only vars
       node.textContent = json.value;
-    else if (node.nodeName.toLocaleLowerCase() == "a") {
+    else if (node.nodeName.toLocaleLowerCase() == "a") { //url links
       node.innerText = "🔍";
       node.setAttribute('href', json.value);
     } else if (node.nodeName.toLocaleLowerCase() == "canvas")
       userFunId = key; //prepare for websocket data
     else if (node.type == "checkbox")
       node.checked = json.value;
-    else //inputs
+    else if (Array.isArray(json.value)) { //table column
+      let rowNr = 0;
+      for (let x of json.value) {
+        console.log(key, gId(key + "#" + rowNr), x);
+        if (gId(key + "#" + rowNr) && gId(key + "#" + rowNr).checked)
+          gId(key + "#" + rowNr).checked = x; //tbd support all types!!
+        rowNr++;
+      }
+      // node.checked = json.value;
+    } else //inputs
       node.value = json.value;
   }
-  if (json.json) { //json send html nodes cannot process, store in jsonValues array
+  if (json.hasOwnProperty("json")) { //json send html nodes cannot process, store in jsonValues array
     console.log("processUpdate json", key, json.json, node);
     jsonValues[key] = json.json;
   }
-  if (json.file) { //json send html nodes cannot process, store in jsonValues array
+  if (json.hasOwnProperty("file")) { //json send html nodes cannot process, store in jsonValues array
     console.log("processUpdate file", key, json.file, node);
 
     //we need to send a request which the server can handle using request variable
@@ -643,8 +656,6 @@ function toggleModal(element) {
   }
 
 	gId('modalView').style.transform = (isModal) ? "translateY(0px)":"translateY(100%)";
-
-
 }
 // https://stackoverflow.com/questions/324303/cut-and-paste-moving-nodes-in-the-dom-with-javascript
 

diff --git a/package.json b/package.json
@@ -13,14 +13,14 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ewoudwijma/playground.git"
+    "url": "git+https://github.com/ewowi/StarMod.git"
   },
   "author": "",
   "license": "ISC",
   "bugs": {
-    "url": "https://github.com/ewoudwijma/playground/issues"
+    "url": "https://github.com/ewowi/StarMod/issues"
   },
-  "homepage": "https://github.com/ewoudwijma/playground#readme",
+  "homepage": "https://github.com/ewowi/StarMod#readme",
   "dependencies": {
     "clean-css": "^4.2.3",
     "html-minifier-terser": "^5.1.1",

diff --git a/platformio.ini b/platformio.ini
@@ -1,20 +1,23 @@
 ;    @title     StarMod
 ;    @file      platformio.ini
-;    @date      20230730
-;    @repo      https://github.com/ewoudwijma/StarMod
-;    @Authors   https://github.com/ewoudwijma/StarMod/commits/main
+;    @date      20230810
+;    @repo      https://github.com/ewowi/StarMod
+;    @Authors   https://github.com/ewowi/StarMod/commits/main
 ;    @Copyright (c) 2023 Github StarMod Commit Authors
 ;    @license   GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007
 
 [starmod]
 lib_deps =
-    https://github.com/me-no-dev/ESPAsyncWebServer.git
+    ; https://github.com/me-no-dev/ESPAsyncWebServer.git
     ; https://github.com/lost-hope/ESPAsyncWebServer.git#master
+    https://github.com/ewowi/ESPAsyncWebServer.git
     https://github.com/bblanchon/ArduinoJson.git
 
 [appmod_leds]
 build_flags = 
-  -D APPMOD_LEDS -D USERMOD_ARTNET -D USERMOD_DDP
+  -D APPMOD_LEDS 
+  -D USERMOD_ARTNET 
+  -D USERMOD_DDP
 lib_deps =
     https://github.com/FastLED/FastLED.git