Enhance pages (#2075)

* enhance pages

* .

* .

* .

* .

* .

* .

---------

Co-authored-by: CaCO3 <caco@ruinelli.ch>

code/components/jomjol_flowcontroll/ClassFlowControll.cpp

@@ -195,6 +195,7 @@ void ClassFlowControll::SetInitialParameter(void)
     disabled = false;
     aktRunNr = 0;
     aktstatus = "Flow task not yet created";
+    aktstatusWithTime = aktstatus;
 }
 
 
@@ -272,6 +273,8 @@ ClassFlow* ClassFlowControll::CreateClassFlow(std::string _type)
 void ClassFlowControll::InitFlow(std::string config)
 {
     aktstatus = "Initialization";
+    aktstatusWithTime = aktstatus;
+
     //#ifdef ENABLE_MQTT
         //MQTTPublish(mqttServer_getMainTopic() + "/" + "status", "Initialization", false); // Right now, not possible -> MQTT Service is going to be started later
     //#endif //ENABLE_MQTT
@@ -318,6 +321,12 @@ void ClassFlowControll::InitFlow(std::string config)
 }
 
 
+std::string* ClassFlowControll::getActStatusWithTime()
+{
+    return &aktstatusWithTime;
+}
+
+
 std::string* ClassFlowControll::getActStatus()
 {
     return &aktstatus;
@@ -327,6 +336,7 @@ std::string* ClassFlowControll::getActStatus()
 void ClassFlowControll::setActStatus(std::string _aktstatus)
 {
     aktstatus = _aktstatus;
+    aktstatusWithTime = aktstatus;
 }
 
 
@@ -338,10 +348,10 @@ void ClassFlowControll::doFlowTakeImageOnly(string time)
     {
         if (FlowControll[i]->name() == "ClassFlowTakeImage") {
             zw_time = getCurrentTimeString("%H:%M:%S");
-            std::string flowStatus = TranslateAktstatus(FlowControll[i]->name());
-            aktstatus = flowStatus + " (" + zw_time + ")";
+            aktstatus = TranslateAktstatus(FlowControll[i]->name());
+            aktstatusWithTime = aktstatus + " (" + zw_time + ")";
             #ifdef ENABLE_MQTT
-                MQTTPublish(mqttServer_getMainTopic() + "/" + "status", flowStatus, false);
+                MQTTPublish(mqttServer_getMainTopic() + "/" + "status", aktstatus, false);
             #endif //ENABLE_MQTT
 
             FlowControll[i]->doFlow(time);
@@ -371,11 +381,11 @@ bool ClassFlowControll::doFlow(string time)
     for (int i = 0; i < FlowControll.size(); ++i)
     {
         zw_time = getCurrentTimeString("%H:%M:%S");
-        std::string flowStatus = TranslateAktstatus(FlowControll[i]->name());
-        aktstatus = flowStatus + " (" + zw_time + ")";
-        //LogFile.WriteToFile(ESP_LOG_INFO, TAG, aktstatus);
+        aktstatus = TranslateAktstatus(FlowControll[i]->name());
+        aktstatusWithTime = aktstatus + " (" + zw_time + ")";
+        //LogFile.WriteToFile(ESP_LOG_INFO, TAG, aktstatusWithTime);
         #ifdef ENABLE_MQTT
-            MQTTPublish(mqttServer_getMainTopic() + "/" + "status", flowStatus, false);
+            MQTTPublish(mqttServer_getMainTopic() + "/" + "status", aktstatus, false);
         #endif //ENABLE_MQTT
 
         #ifdef DEBUG_DETAIL_ON
@@ -405,11 +415,11 @@ bool ClassFlowControll::doFlow(string time)
     }
 
     zw_time = getCurrentTimeString("%H:%M:%S");
-    std::string flowStatus = "Flow finished";
-    aktstatus = flowStatus + " (" + zw_time + ")";
-    //LogFile.WriteToFile(ESP_LOG_INFO, TAG, aktstatus);
+    aktstatus = "Flow finished";
+    aktstatusWithTime = aktstatus + " (" + zw_time + ")";
+    //LogFile.WriteToFile(ESP_LOG_INFO, TAG, aktstatusWithTime);
     #ifdef ENABLE_MQTT
-        MQTTPublish(mqttServer_getMainTopic() + "/" + "status", flowStatus, false);
+        MQTTPublish(mqttServer_getMainTopic() + "/" + "status", aktstatus, false);
     #endif //ENABLE_MQTT
 
     return result;

code/components/jomjol_flowcontroll/ClassFlowControll.h

@@ -37,6 +37,7 @@ protected:
 	float AutoInterval;
 	bool SetupModeActive;
 	void SetInitialParameter(void);	
+	std::string aktstatusWithTime;
 	std::string aktstatus;
 	int aktRunNr;
 
@@ -71,6 +72,7 @@ public:
 
 	bool isAutoStart(long &_interval);
 
+	std::string* getActStatusWithTime();
 	std::string* getActStatus();
 	void setActStatus(std::string _aktstatus);
 

code/components/jomjol_tfliteclass/server_tflite.cpp

@@ -379,55 +379,85 @@ esp_err_t handler_wasserzaehler(httpd_req_t *req)
         if (query.find("full") != std::string::npos)
         {
             string txt, zw;
-            
-            txt = "<p>Aligned Image: <p><img src=\"/img_tmp/alg_roi.jpg\"> <p>\n";
-            txt = txt + "Digital Counter: <p> ";
-            httpd_resp_sendstr_chunk(req, txt.c_str()); 
-            
-            std::vector<HTMLInfo*> htmlinfodig;
-            htmlinfodig = tfliteflow.GetAllDigital();  
 
-            for (int i = 0; i < htmlinfodig.size(); ++i)
-            {
-                if (tfliteflow.GetTypeDigital() == Digital)
+            std::string *status = tfliteflow.getActStatus();
+
+            if ((countRounds <= 1) && (*status != std::string("Flow finished"))) { // First round not completed yet
+                txt = "<body style=\"font-family: arial\">";
+                txt += "<h3>Please wait for the first round to complete!</h3><h3>Current state: " + *status + "</h3>\n";
+                httpd_resp_sendstr_chunk(req, txt.c_str());
+            }
+            else {
+                /* Digital ROIs */
+                txt = "<body style=\"font-family: arial\">";
+                txt += "<h3>Recognized Digit ROIs (previous round)</h3>\n";
+                txt += "<table style=\"border-spacing: 5px\"><tr style=\"text-align: center; vertical-align: top;\">\n";
+
+                std::vector<HTMLInfo*> htmlinfodig;
+                htmlinfodig = tfliteflow.GetAllDigital(); 
+
+                for (int i = 0; i < htmlinfodig.size(); ++i)
                 {
-                    if (htmlinfodig[i]->val == 10)
-                        zw = "NaN";
+                    if (tfliteflow.GetTypeDigital() == Digital)
+                    {
+                        if (htmlinfodig[i]->val == 10)
+                            zw = "NaN";
+                        else
+                            zw = to_string((int) htmlinfodig[i]->val);
+
+                        txt += "<td style=\"width: 100px\"><h4>" + zw + "</h4><p><img src=\"/img_tmp/" +  htmlinfodig[i]->filename + "\"></p></td>\n";
+                    }
                     else
-                        zw = to_string((int) htmlinfodig[i]->val);
-
-                    txt = "<img src=\"/img_tmp/" +  htmlinfodig[i]->filename + "\"> " + zw;
+                    {
+                        std::stringstream stream;
+                        stream << std::fixed << std::setprecision(1) << htmlinfodig[i]->val;
+                        zw = stream.str();
+
+                        txt += "<td style=\"width: 100px\"><h4>" + zw + "</h4><p><img src=\"/img_tmp/" +  htmlinfodig[i]->filename + "\"></p></td>\n";
+                    }
+                    delete htmlinfodig[i];
                 }
-                else
+
+                htmlinfodig.clear();
+            
+                txt += "</tr></table>\n";
+                httpd_resp_sendstr_chunk(req, txt.c_str()); 
+
+
+                /* Analog ROIs */
+                txt = "<h3>Recognized Analog ROIs (previous round)</h3>\n";
+                txt += "<table style=\"border-spacing: 5px\"><tr style=\"text-align: center; vertical-align: top;\">\n";
+                
+                std::vector<HTMLInfo*> htmlinfoana;
+                htmlinfoana = tfliteflow.GetAllAnalog();
+                for (int i = 0; i < htmlinfoana.size(); ++i)
                 {
                     std::stringstream stream;
-                    stream << std::fixed << std::setprecision(1) << htmlinfodig[i]->val;
+                    stream << std::fixed << std::setprecision(1) << htmlinfoana[i]->val;
                     zw = stream.str();
 
-                    txt = "<img src=\"/img_tmp/" +  htmlinfodig[i]->filename + "\"> " + zw;
+                    txt += "<td style=\"width: 150px;\"><h4>" + zw + "</h4><p><img src=\"/img_tmp/" +  htmlinfoana[i]->filename + "\"></p></td>\n";
+                delete htmlinfoana[i];
                 }
+                htmlinfoana.clear();   
+
+                txt += "</tr>\n</table>\n";
                 httpd_resp_sendstr_chunk(req, txt.c_str()); 
-                delete htmlinfodig[i];
-            }
-            htmlinfodig.clear();
-        
-            txt = " <p> Analog Meter: <p> ";
-            httpd_resp_sendstr_chunk(req, txt.c_str()); 
-            
-            std::vector<HTMLInfo*> htmlinfoana;
-            htmlinfoana = tfliteflow.GetAllAnalog();
-            for (int i = 0; i < htmlinfoana.size(); ++i)
-            {
-                std::stringstream stream;
-                stream << std::fixed << std::setprecision(1) << htmlinfoana[i]->val;
-                zw = stream.str();
 
-                txt = "<img src=\"/img_tmp/" +  htmlinfoana[i]->filename + "\"> " + zw;
+
+                /* Full Image 
+                 * Only show it after the image got taken and aligned */
+                txt = "<h3>Aligned Image (current round)</h3>\n";
+                if ((*status == std::string("Initialization")) || 
+                    (*status == std::string("Initialization (delayed)")) || 
+                    (*status == std::string("Take Image"))) {
+                    txt += "<p>Current state: " + *status + "</p>\n";
+                }
+                else {
+                    txt += "<img src=\"/img_tmp/alg_roi.jpg\">\n";
+                }
                 httpd_resp_sendstr_chunk(req, txt.c_str()); 
-                delete htmlinfoana[i];
             }
-            htmlinfoana.clear();   
-
         }   
 
         /* Respond with an empty chunk to signal HTTP response completion */
@@ -664,7 +694,7 @@ esp_err_t handler_statusflow(httpd_req_t *req)
             ESP_LOGD(TAG, "handler_prevalue: %s", req->uri);
         #endif
 
-        string* zw = tfliteflow.getActStatus();
+        string* zw = tfliteflow.getActStatusWithTime();
         resp_str = zw->c_str();
 
         httpd_resp_send(req, resp_str, HTTPD_RESP_USE_STRLEN);   

sd-card/html/edit_alignment.html

@@ -115,7 +115,7 @@ select {
             param;
     
 function doReboot() {
-    if (confirm("Are you sure you want to reboot? Did you save the config?")) {
+    if (confirm("Are you sure you want to reboot? Did you save your changes?")) {
             var stringota = getDomainname() + "/reboot";
             window.location = stringota;
             window.location.href = stringota;

sd-card/html/edit_analog.html

@@ -165,7 +165,7 @@ th, td {
 
     
 function doReboot() {
-    if (confirm("Are you sure you want to reboot? Did you save the config?")) {
+    if (confirm("Are you sure you want to reboot? Did you save your changes?")) {
             var stringota = getDomainname() + "/reboot";
             window.location = stringota;
             window.location.href = stringota;

sd-card/html/edit_digits.html

@@ -161,7 +161,7 @@ th, td {
             domainname = getDomainname();
 
     function doReboot() {
-        if (confirm("Are you sure you want to reboot? Did you save the config?")) {
+        if (confirm("Are you sure you want to reboot? Did you save your changes?")) {
                 var stringota = getDomainname() + "/reboot";
                 window.location = stringota;
                 window.location.href = stringota;

sd-card/html/edit_reference.html

@@ -238,7 +238,7 @@ table {
         }			
                 
         function SaveReference(){
-            if (confirm("Are you sure you want to update the reference image?")) {
+            if (confirm("Are you sure you want to update the Reference Image?")) {
                 param["Alignment"]["InitialRotate"].value1 = document.getElementById("prerotateangle").value;
 
                 if ((param["Alignment"]["InitialMirror"].found == true) && (document.getElementById("mirror").checked))

sd-card/html/index.html

@@ -6,6 +6,7 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <link rel="stylesheet" href="style.css?v=$COMMIT_HASH" type="text/css" >
+<link href="firework.css?v=$COMMIT_HASH" rel="stylesheet">
 
 <script type="text/javascript" src="common.js?v=$COMMIT_HASH"></script>
 <script type="text/javascript" src="readconfigcommon.js?v=$COMMIT_HASH"></script>

sd-card/html/prevalue_set.html

@@ -48,20 +48,32 @@ input[type=number] {
 
 <table style="width:100%">
   <tr>
-    <h3>Current Value:</h3><p>
-	<div id="prevalue"></div>
-  <h3>Set Value:</h3><p>
-    Input (Format = 123.456):<p>
-	Previous Value: 
-	 <input type="number" id="myInput" name="myInput"
-           pattern="[0-9]+([\.,][0-9]+)?" step="0.001"
-            title="This should be a number with up to 4 decimal places.">
-	<p></p>
-	<button class="button" type="button" onclick="setprevalue()">Set Previous Value</button>
+    <td>
+      <h3>Current "Previous Value":</h3>
+    </td>
+    <td>
+      <div id="prevalue"></div>
+    </td>
+  </tr>
+  <tr>
+    <td>
+      <h3>New "Previous Value":<br>(Format = 123.456)</h3><p>&nbsp;</p>
+    </td>
+    <td>
+      <input type="number" id="myInput" name="myInput"
+              pattern="[0-9]+([\.,][0-9]+)?" step="0.001"
+                title="This should be a number with up to 4 decimal places.">
+      <button class="button" type="button" onclick="setprevalue()">Set Previous Value</button>
+      <p>(The current "Raw Value" got entered as the suggested new "Previous Value")</p>
+    </td>
   </tr>	
   <tr>
-    <h3>Result:</h3><p>
-	<div id="result" readonly></div>
+    <td>
+      <h3>Result:</h3>
+    </td>
+    <td>
+	    <div id="result" readonly></div>
+    </td>
   </tr>	 
 
 </table>