123

src/App.svelte

@@ -37,7 +37,7 @@
   let updatingTimeout = 120000;
   let opened = false;
   let preventMove = false;
-  let devMode = true;
+  let devMode = false;
 
   //****************************************************variable section**********************************************************/
   //******************************************************************************************************************************/
@@ -481,7 +481,7 @@
                 //if (debug) console.log("[i] status (arr)", ws);
               } else {
                 updateWidget(statusJson);
-                //if (debug) console.log("[i] status (dgt)", ws, JSON.stringify(statusJson));
+                if (debug) console.log("[i] status (dgt)", ws, JSON.stringify(statusJson));
               }
             }
           }
@@ -768,7 +768,7 @@
           //widget.ws = selectedWs;
 
           widget.topic = settingsJson.root + "/" + config.id;
-          layout.push(widget);
+          if (setWidget !== "nil") layout.push(widget);
           if (widget.widget === "chart") {
             let input = getInput();
             input.page = config.page;

src/widgets/Anydata.svelte

@@ -2,6 +2,26 @@
   export let widget;
   export let value;
   value = value;
+
+  $: widget.status, blink();
+
+  let prevStatus;
+
+  let green = false;
+
+  function blink() {
+    if (widget.status) {
+      if (widget.status != prevStatus) {
+        setTimeout(stopBlink, 4000);
+        green = true;
+      }
+      prevStatus = widget.status;
+    }
+  }
+
+  function stopBlink() {
+    green = false;
+  }
 </script>
 
 <div class="crd-itm-psn">
@@ -11,8 +31,8 @@
   </div>
   <div class="flex justify-end w-1/3">
     <!-- svelte-ignore a11y-label-has-associated-control -->
-    <label class="wgt-adt-stl">{!widget.status ? "" : widget.status}</label>
+    <label class="wgt-adt-stl {green ? 'text-green-500 animate-pulse' : ''}">{!widget.status ? "" : widget.status}</label>
     <!-- svelte-ignore a11y-label-has-associated-control -->
-    <label class="wgt-adt-stl">&nbsp;{!widget.after ? "" : widget.after}</label>
+    <label class="wgt-adt-stl {green ? 'text-green-500 animate-pulse' : ''}">&nbsp;{!widget.after ? "" : widget.after}</label>
   </div>
 </div>