Step by step cracking the nut of dealing with complex tables +chrome bug

General
- initSelect: change "select" by "data"
- initTable change "table" by "data"

index.js
- savedData instead of html tricks (also solves chrome bug)
- rename selectOptions by savedData
- genHTML: table select: use savedData for options
- genHTML: uiFun commands details first (e.g. details of table store savedData)
- changeHTML remove if select -> move to data
- if data: for table, select / span and savedData

SysModUI
- processjson: remove request keys from response

src/App/AppEffects.h

@@ -80,7 +80,7 @@ class Effect {
   void addPalette(JsonObject parentVar) {
     JsonObject currentVar = ui->initSelect(parentVar, "pal", 4, false, [](JsonObject var) { //uiFun.
       web->addResponse(var["id"], "label", "Palette");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       select.add("CloudColors");
       select.add("LavaColors");
       select.add("OceanColors");

src/App/AppModFixtureGen.h

@@ -511,7 +511,7 @@ class AppModFixtureGen:public SysModule {
     ui->initSelect(parentVar, "fixtureGen", 0, false, [](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Fixture");
       web->addResponse(var["id"], "comment", "Type of fixture");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       select.add("1DSpiral"); //0
       select.add("2DMatrix"); //1
       select.add("2DRing"); //2
@@ -591,13 +591,13 @@ class AppModFixtureGen:public SysModule {
 
       ui->initSelect(parentVar, "firstLedX", 0, false, [](JsonObject var) { //uiFun
         // web->addResponse(var["id"], "label", "fixture generator");
-        JsonArray select = web->addResponseA(var["id"], "select");
+        JsonArray select = web->addResponseA(var["id"], "data");
         select.add("Left"); //0
         select.add("Right"); //1
       });
       ui->initSelect(parentVar, "firstLedY", 0, false, [](JsonObject var) { //uiFun
         // web->addResponse(var["id"], "label", "fixture generator");
-        JsonArray select = web->addResponseA(var["id"], "select");
+        JsonArray select = web->addResponseA(var["id"], "data");
         select.add("Top"); //0
         select.add("Bottom"); //1
       });

src/App/AppModLeds.h

@@ -91,22 +91,27 @@ class AppModLeds:public SysModule {
     JsonObject tableVar = ui->initTable(parentVar, "fxTbl", nullptr, false, [this](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Effects");
       web->addResponse(var["id"], "comment", "List of effects (WIP)");
-      JsonArray rows = web->addResponseA(var["id"], "table");
+      JsonArray rows = web->addResponseA(var["id"], "data");
       // for (SysModule *module:modules) {
 
       //add value for each child
       JsonArray row = rows.createNestedArray();
       for (JsonObject childVar : var["n"].as<JsonArray>()) {
         print->printJson("fxTbl childs", childVar);
         row.add(childVar["value"]);
+        //recursive
+        // for (JsonObject childVar : childVar["n"].as<JsonArray>()) {
+        //   print->printJson("fxTbl child childs", childVar);
+        //   row.add(childVar["value"]);
+        // }
       }
 
     });
 
     currentVar = ui->initSelect(parentVar, "fx", 0, false, [this](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Effect");
       web->addResponse(var["id"], "comment", "Effect to show");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       for (Effect *effect:effects.effects) {
         select.add(effect->name());
       }
@@ -119,7 +124,7 @@ class AppModLeds:public SysModule {
     currentVar = ui->initSelect(tableVar, "pro", 2, false, [](JsonObject var) { //uiFun.
       web->addResponse(var["id"], "label", "Projection");
       web->addResponse(var["id"], "comment", "How to project fx to fixture");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       select.add("None"); // 0
       select.add("Random"); // 1
       select.add("Distance from point"); //2
@@ -148,7 +153,7 @@ class AppModLeds:public SysModule {
 
     ui->initSelect(parentVar, "fixture", 0, false, [](JsonObject var) { //uiFun
       web->addResponse(var["id"], "comment", "Fixture to display effect on");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       files->dirToJson(select, true, "D"); //only files containing D (1D,2D,3D), alphabetically, only looking for D not very destinctive though
 
       // ui needs to load the file also initially

src/Sys/SysModFiles.cpp

@@ -38,7 +38,7 @@ void SysModFiles::setup() {
   JsonObject tableVar = ui->initTable(parentVar, "fileTbl", nullptr, false, [this](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Files");
     web->addResponse(var["id"], "comment", "List of files");
-    JsonArray rows = web->addResponseA(var["id"], "table");
+    JsonArray rows = web->addResponseA(var["id"], "data");
     dirToJson(rows);
   });
   ui->initText(tableVar, "flName", nullptr, 32, true, [](JsonObject var) { //uiFun
@@ -57,8 +57,9 @@ void SysModFiles::setup() {
     if (rowNr != uint8Max) {
       // call uiFun of tbl to fill responseVariant with files
       ui->uFunctions[tableVar["uiFun"]](tableVar);
+      //get the table values
       JsonVariant responseVariant = web->getResponseDoc()->as<JsonVariant>();
-      JsonArray row = responseVariant["fileTbl"]["table"][rowNr];
+      JsonArray row = responseVariant["fileTbl"]["data"][rowNr];
       const char * fileName = row[0]; //first column
       print->printJson("\n", row);
       removeFiles(fileName, false);

src/Sys/SysModPins.cpp

@@ -42,7 +42,7 @@ void SysModPins::setup() {
   JsonObject tableVar = ui->initTable(parentVar, "pinTbl", nullptr, false, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Pins");
     web->addResponse(var["id"], "comment", "List of pins");
-    JsonArray rows = web->addResponseA(var["id"], "table");
+    JsonArray rows = web->addResponseA(var["id"], "data");
     uint8_t pinNr = 0;
     for (PinObject pinObject:pinObjects) {
       if (strcmp(pinObject.owner, "") != 0) {

src/Sys/SysModPrint.cpp

@@ -34,7 +34,7 @@ void SysModPrint::setup() {
     web->addResponse(var["id"], "label", "Output");
     web->addResponse(var["id"], "comment", "System log to Serial or Net print (WIP)");
 
-    JsonArray rows = web->addResponseA(var["id"], "select");
+    JsonArray rows = web->addResponseA(var["id"], "data");
     rows.add("No");
     rows.add("Serial");
     rows.add("UI");

src/Sys/SysModSystem.cpp

@@ -53,18 +53,18 @@ void SysModSystem::setup() {
   ui->initSelect(parentVar, "reset0", (int)rtc_get_reset_reason(0), true, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Reset 0");
     web->addResponse(var["id"], "comment", "Reason Core 0");
-    sys->addResetReasonsSelect(web->addResponseA(var["id"], "select"));
+    sys->addResetReasonsSelect(web->addResponseA(var["id"], "data"));
   });
   if (ESP.getChipCores() > 1)
     ui->initSelect(parentVar, "reset1", (int)rtc_get_reset_reason(1), true, [](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Reset 1");
       web->addResponse(var["id"], "comment", "Reason Core 1");
-      sys->addResetReasonsSelect(web->addResponseA(var["id"], "select"));
+      sys->addResetReasonsSelect(web->addResponseA(var["id"], "data"));
     });
   ui->initSelect(parentVar, "restartReason", (int)esp_reset_reason(), true, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Restart");
     web->addResponse(var["id"], "comment", "Reason restart");
-    sys->addRestartReasonsSelect(web->addResponseA(var["id"], "select"));
+    sys->addRestartReasonsSelect(web->addResponseA(var["id"], "data"));
   });
 
   //calculate version in format YYMMDDHH

src/Sys/SysModUI.cpp

@@ -48,7 +48,7 @@ void SysModUI::setup() {
   JsonObject tableVar = initTable(parentVar, "vlTbl", nullptr, false, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Variable loops");
     web->addResponse(var["id"], "comment", "Loops initiated by a variable");
-    JsonArray rows = web->addResponseA(var["id"], "table");
+    JsonArray rows = web->addResponseA(var["id"], "data");
 
     for (auto varLoop = begin (loopFunctions); varLoop != end (loopFunctions); ++varLoop) {
       JsonArray row = rows.createNestedArray();
@@ -286,11 +286,13 @@ const char * SysModUI::processJson(JsonVariant &json) {
         JsonObject var = mdl->findVar("System");
         USER_PRINTF("processJson view v:%s n: %d s:%s\n", pair.value().as<String>(), var.isNull(), var["id"].as<const char *>());
         var["view"] = (char *)value.as<const char *>(); //create a copy!
+        json.remove(key); //key processed we don't need the key in the response
       }
       else if (pair.key() == "canvasData") {
         JsonObject var = mdl->findVar("System");
         USER_PRINTF("processJson canvasData %s\n", value.as<const char *>());
         var["canvasData"] = (char *)value.as<const char *>(); //create a copy!
+        json.remove(key); //key processed we don't need the key in the response
       }
       else if (pair.key() == "uiFun") { //JsonString can do ==
         //find the select var and collect it's options...
@@ -322,6 +324,7 @@ const char * SysModUI::processJson(JsonVariant &json) {
           }
         } else
           USER_PRINTF("processJson value not array? %s %s\n", key, value.as<String>().c_str());
+        json.remove(key); //key processed we don't need the key in the response
       } 
       else { //normal change
         if (!value.is<JsonObject>()) { //no vars (inserted by uiFun responses)

src/Sys/SysModWeb.cpp

@@ -60,7 +60,7 @@ void SysModWeb::setup() {
   JsonObject tableVar = ui->initTable(parentVar, "clTbl", nullptr, false, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Clients");
     web->addResponse(var["id"], "comment", "List of clients");
-    JsonArray rows = web->addResponseA(var["id"], "table");
+    JsonArray rows = web->addResponseA(var["id"], "data");
     web->clientsToJson(rows);
   });
   ui->initNumber(tableVar, "clNr", 0, 0, 999, true, [](JsonObject var) { //uiFun
@@ -75,7 +75,7 @@ void SysModWeb::setup() {
   ui->initSelect(tableVar, "clStatus", -1, true, [](JsonObject var) { //uiFun
     web->addResponse(var["id"], "label", "Status");
     //tbd: not working yet in ui
-    JsonArray select = web->addResponseA(var["id"], "select");
+    JsonArray select = web->addResponseA(var["id"], "data");
     select.add("Disconnected"); //0
     select.add("Connected"); //1
     select.add("Disconnecting"); //2

src/User/UserModArtNet.h

@@ -37,7 +37,7 @@ class UserModArtNet:public SysModule {
     ui->initSelect(parentVar, "artInst", -1, false, [](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Instance");
       web->addResponse(var["id"], "comment", "Instance to send data");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       JsonArray instanceObject = select.createNestedArray();
       instanceObject.add(0);
       instanceObject.add("no sync");

src/User/UserModDDP.h

@@ -53,7 +53,7 @@ class UserModDDP:public SysModule {
     ui->initSelect(parentVar, "ddpInst", -1, false, [](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Instance");
       web->addResponse(var["id"], "comment", "Instance to send data");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       JsonArray instanceObject = select.createNestedArray();
       instanceObject.add(0);
       instanceObject.add("no sync");

src/User/UserModE131.h

@@ -49,7 +49,7 @@ class UserModE131:public SysModule {
     JsonObject tableVar = ui->initTable(parentVar, "e131Tbl", nullptr, false, [this](JsonObject var) { //uiFun
       web->addResponse(var["id"], "label", "Vars to watch");
       web->addResponse(var["id"], "comment", "List of instances");
-      JsonArray rows = web->addResponseA(var["id"], "table");
+      JsonArray rows = web->addResponseA(var["id"], "data");
       for (auto varToWatch: varsToWatch) {
         JsonArray row = rows.createNestedArray();
         row.add(varToWatch.channel + mdl->getValue("dch").as<uint8_t>());

src/User/UserModInstances.h

@@ -180,7 +180,7 @@ class UserModInstances:public SysModule {
     const char * varID = var["id"];
       web->addResponse(varID, "label", "Instances");
       web->addResponse(varID, "comment", "List of instances");
-      JsonArray rows = web->addResponseA(varID, "table");
+      JsonArray rows = web->addResponseA(varID, "data");
       for (auto node=this->nodes.begin(); node!=this->nodes.end(); ++node) {
         addTblRow(rows, node);
       }
@@ -213,7 +213,7 @@ class UserModInstances:public SysModule {
     currentVar = ui->initSelect(parentVar, "sma", 0, false, [this](JsonObject var) { //uiFun tbd: make dropdown where value is ...ip number
       web->addResponse(var["id"], "label", "Sync Master");
       web->addResponse(var["id"], "comment", "Instance to sync from");
-      JsonArray select = web->addResponseA(var["id"], "select");
+      JsonArray select = web->addResponseA(var["id"], "data");
       JsonArray instanceObject = select.createNestedArray();
       instanceObject.add(0);
       instanceObject.add("no sync");