SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed. svghmi
authorEdouard Tisserant
Fri, 21 Feb 2020 16:18:53 +0100
branchsvghmi
changeset 2841 7c6050cde9e3
parent 2840 e588f25e6c74
child 2842 2f73f001955a
SVGHMI: optimize browser work by hiding (display:none) pages that are not displayed.
svghmi/gen_index_xhtml.ysl2
svghmi/svghmi.js
--- a/svghmi/gen_index_xhtml.ysl2	Fri Feb 21 16:15:33 2020 +0100
+++ b/svghmi/gen_index_xhtml.ysl2	Fri Feb 21 16:18:53 2020 +0100
@@ -299,7 +299,7 @@
             const "page_sub_ids", "func:refered_elements($page)[@id = $hmi_elements/@id]/@id";
             const "all_page_ids","$page_ids | $page_sub_ids[not(. = $page_ids)]"; 
             |     "«$desc/arg[1]/@value»": {
-            |         id: "«@id»",
+            |         widget: hmi_widgets["«@id»"],
             |         bbox: [«$p/@x», «$p/@y», «$p/@w», «$p/@h»],
             |         widgets: [
             foreach "$all_page_ids" {
--- a/svghmi/svghmi.js	Fri Feb 21 16:15:33 2020 +0100
+++ b/svghmi/svghmi.js	Fri Feb 21 16:18:53 2020 +0100
@@ -220,28 +220,42 @@
 function switch_page(page_name) {
     let old_desc = page_desc[current_page];
     let new_desc = page_desc[page_name];
-    /* TODO hide / show widgets */
+
+    if(new_desc == undefined){
+        return;
+    }
 
     /* remove subsribers of previous page if any */
-    if(old_desc) for(let widget of old_desc.widgets){
+    if(old_desc){
+        for(let widget of old_desc.widgets){
+            for(let index of widget.indexes){
+                subscribers[index].delete(widget);
+            }
+        }
+        old_desc.widget.element.style.display = "none";
+    } else {
+        /* initial page switch : set everybody hidden */
+        for(let name in page_desc){
+            if(name != new_desc){
+                page_desc[name].widget.element.style.display = "none";
+            }
+        }
+    }
+
+    /* add new subsribers if any */
+    for(let widget of new_desc.widgets){
         for(let index of widget.indexes){
-            subscribers[index].delete(widget);
-        }
-    }
-
-    if(new_desc) {
-        /* add new subsribers if any */
-        for(let widget of new_desc.widgets){
-            for(let index of widget.indexes){
-                subscribers[index].add(widget);
-                let cached_val = cache[index];
-                if(cached_val != undefined)
-                    dispatch_value_to_widget(widget, index, cached_val, cached_val);
-            }
-        }
-        svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
-        // TODO dispatch current cache in newly opened page
-    }
+            subscribers[index].add(widget);
+            /* dispatch current cache in newly opened page widgets */
+            let cached_val = cache[index];
+            if(cached_val != undefined)
+                dispatch_value_to_widget(widget, index, cached_val, cached_val);
+        }
+    }
+
+    new_desc.widget.element.style.display = "inline";
+
+    svg_root.setAttribute('viewBox',new_desc.bbox.join(" "));
     current_page = page_name;
 
     update_subscriptions();