svghmi/gen_index_xhtml.ysl2
branchsvghmi
changeset 2851 8d15c6238e62
parent 2850 e38654ec6281
child 2852 f7349ca820c9
equal deleted inserted replaced
2850:e38654ec6281 2851:8d15c6238e62
   692         const "value_elt" {
   692         const "value_elt" {
   693             optional_labels("value");
   693             optional_labels("value");
   694         }
   694         }
   695         value "$value_elt";
   695         value "$value_elt";
   696         if "$value_elt"
   696         if "$value_elt"
   697             | frequency: 5,
   697         |     frequency: 5,
   698         | dispatch: function(value) {
   698 
       
   699         |     dispatch: function(value) {
       
   700 
   699         if "$value_elt"
   701         if "$value_elt"
   700         |     this.value_elt.textContent = String(value);
   702         |         this.value_elt.textContent = String(value);
   701         | },
   703 
       
   704         |     },
   702         const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
   705         const "edit_elt_id","$hmi_element/*[@inkscape:label='edit'][1]/@id";
   703         | init: function() {
   706         |     init: function() {
   704         if "$edit_elt_id" {
   707         if "$edit_elt_id" {
   705         |     id("«$edit_elt_id»").addEventListener(
   708         |         id("«$edit_elt_id»").addEventListener(
   706         |         "click", 
   709         |             "click", 
   707         |         evt => alert('XXX TODO : Edit value'));
   710         |             evt => alert('XXX TODO : Edit value'));
   708         }
   711         }
   709         foreach "$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]" {
   712         foreach "$hmi_element/*[regexp:test(@inkscape:label,'^[=+\-].+')]" {
   710         |     id("«@id»").addEventListener(
   713         |         id("«@id»").addEventListener(
   711         |         "click", 
   714         |             "click", 
   712         |         evt => {let new_val = change_hmi_value(this.indexes[0], "«func:escape_quotes(@inkscape:label)»");
   715         |             evt => {let new_val = change_hmi_value(this.indexes[0], "«func:escape_quotes(@inkscape:label)»");
   713         |                 this.value_elt.textContent = String(new_val);});
   716         |                     this.value_elt.textContent = String(new_val);});
   714                           /* could gray out value until refreshed */
   717                               /* TODO gray out value until refreshed */
   715         }
   718         }
   716         | },
   719         |     },
   717     }
   720     }
   718     template "widget[@type='Button']", mode="widget_defs" {
   721     template "widget[@type='Button']", mode="widget_defs" {
   719     }
   722     }
   720     template "widget[@type='Toggle']", mode="widget_defs" {
   723     template "widget[@type='Toggle']", mode="widget_defs" {
   721         |     frequency: 5,
   724         |     frequency: 5,
   722     }
   725     }
   723     template "widget[@type='Switch']", mode="widget_defs" {
   726     template "widget[@type='Switch']", mode="widget_defs" {
   724         param "hmi_element";
   727         param "hmi_element";
   725         | frequency: 5,
   728         |     frequency: 5,
   726         | dispatch: function(value) {
   729         |     dispatch: function(value) {
   727         |     for(let choice of this.choices){
   730         |         for(let choice of this.choices){
   728         |         if(value != choice.value){
   731         |             if(value != choice.value){
   729         |             choice.elt.setAttribute("style", "display:none");
   732         |                 choice.elt.setAttribute("style", "display:none");
   730         |         } else {
   733         |             } else {
   731         |             choice.elt.setAttribute("style", choice.style);
   734         |                 choice.elt.setAttribute("style", choice.style);
       
   735         |             }
   732         |         }
   736         |         }
   733         |     }
   737         |     },
   734         | },
   738         |     init: function() {
   735         | init: function() {
   739         |         // Hello Switch
   736         |     // Hello Switch
   740         |     },
   737         | },
   741         |     choices: [
   738         | choices: [
       
   739         const "regex",!"'^(\"[^\"].*\"|\-?[0-9]+)(#.*)?$'"!;
   742         const "regex",!"'^(\"[^\"].*\"|\-?[0-9]+)(#.*)?$'"!;
   740         foreach "$hmi_element/*[regexp:test(@inkscape:label,$regex)]" {
   743         foreach "$hmi_element/*[regexp:test(@inkscape:label,$regex)]" {
   741             const "literal", "regexp:match(@inkscape:label,$regex)[2]";
   744             const "literal", "regexp:match(@inkscape:label,$regex)[2]";
   742         |     {
   745         |         {
   743         |         elt:id("«@id»"),
   746         |             elt:id("«@id»"),
   744         |         style:"«@style»",
   747         |             style:"«@style»",
   745         |         value:«$literal»
   748         |             value:«$literal»
   746         |     }`if "position()!=last()" > ,`
   749         |         }`if "position()!=last()" > ,`
   747         }
   750         }
   748         | ],
   751         |     ],
   749     }
   752     }
   750     template "widget[@type='Jump']", mode="widget_defs" {
   753     template "widget[@type='Jump']", mode="widget_defs" {
   751         param "hmi_element";
   754         param "hmi_element";
   752         | on_click: function(evt) {
   755         |     on_click: function(evt) {
   753         |     console.log(evt);
   756         |         console.log(evt);
   754         |     switch_page(this.args[0]);
   757         |         switch_page(this.args[0]);
   755         | },
   758         |     },
   756         | init: function() {
   759         |     init: function() {
   757         /* registering event this way doies not "click" through svg:use 
   760         /* registering event this way doies not "click" through svg:use 
   758         |     this.element.onclick = evt => switch_page(this.args[0]);
   761         |     this.element.onclick = evt => switch_page(this.args[0]);
   759         event must be registered by adding attribute to element instead
   762         event must be registered by adding attribute to element instead
   760         TODO : generalize mouse event handling by global event capture + getElementsAtPoint()
   763         TODO : generalize mouse event handling by global event capture + getElementsAtPoint()
   761         */
   764         */
   762         |     this.element.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_click(evt)");
   765         |         this.element.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_click(evt)");
   763         | },
   766         |     },
   764     }
   767     }
   765 }
   768 }