Mercurial Mercurial > beremiz / comparison
summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help
svghmi/gen_index_xhtml.xslt
branchsvghmi
changeset 3038 92101729f7b7
parent 3034 793ce2117258
child 3041 de4503de2f8c
equal deleted inserted replaced
3037:da51baea69cb 3038:92101729f7b7 
  1494 </xsl:text>
 
  1494 </xsl:text>
 
  1495     <xsl:text>    inactive_style = undefined;
 
  1495     <xsl:text>    inactive_style = undefined;
 
  1496 </xsl:text>
 
  1496 </xsl:text>
 
  1497     <xsl:text>
 
  1497     <xsl:text>
 
  1498 </xsl:text>
 
  1498 </xsl:text>
 
  1499     <xsl:text>     on_mouse_down(evt) {
 
  1499     <xsl:text>    // TODO decouple update of DOM from event (i.e use animate())
 
  1500 </xsl:text>
 
  1500 </xsl:text>
 
  1501     <xsl:text>         if (this.active_style &amp;&amp; this.inactive_style) {
 
  1501     <xsl:text>
 
  1502 </xsl:text>
 
  1502 </xsl:text>
 
  1503     <xsl:text>             this.active_elt.setAttribute("style", this.active_style);
 
  1503     <xsl:text>
 
  1504 </xsl:text>
 
  1504 </xsl:text>
 
  1505     <xsl:text>             this.inactive_elt.setAttribute("style", "display:none");
 
  1505     <xsl:text>    // TODO State of the button should distinguish UI feedbak from current PLC value
 
  1506 </xsl:text>
 
  1506 </xsl:text>
 
  1507     <xsl:text>         }
 
  1507     <xsl:text>
 
  1508 </xsl:text>
 
  1508 </xsl:text>
 
  1509     <xsl:text>         this.apply_hmi_value(0, 1);
 
  1509     <xsl:text>    on_mouse_down(evt) {
 
  1510 </xsl:text>
 
       
  1511     <xsl:text>     }
 
       
  1512 </xsl:text>
 
       
  1513     <xsl:text>
 
       
  1514 </xsl:text>
 
       
  1515     <xsl:text>     on_mouse_up(evt) {
 
       
  1516 </xsl:text>
 
       
  1517     <xsl:text>         if (this.active_style &amp;&amp; this.inactive_style) {
 
       
  1518 </xsl:text>
 
       
  1519     <xsl:text>             this.active_elt.setAttribute("style", "display:none");
 
       
  1520 </xsl:text>
 
       
  1521     <xsl:text>             this.inactive_elt.setAttribute("style", this.inactive_style);
 
       
  1522 </xsl:text>
 
       
  1523     <xsl:text>         }
 
       
  1524 </xsl:text>
 
       
  1525     <xsl:text>         this.apply_hmi_value(0, 0);
 
       
  1526 </xsl:text>
 
       
  1527     <xsl:text>     }
 
       
  1528 </xsl:text>
 
       
  1529     <xsl:text>
 
       
  1530 </xsl:text>
 
       
  1531     <xsl:text>     init() {
 
       
  1532 </xsl:text>
 
       
  1533     <xsl:text>        this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined;
 
       
  1534 </xsl:text>
 
       
  1535     <xsl:text>        this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined;
 
       
  1536 </xsl:text>
 
       
  1537     <xsl:text>
 
       
  1538 </xsl:text>
 
  1510 </xsl:text>
 
  1539     <xsl:text>        if (this.active_style &amp;&amp; this.inactive_style) {
 
  1511     <xsl:text>        if (this.active_style &amp;&amp; this.inactive_style) {
 
  1540 </xsl:text>
 
  1512 </xsl:text>
 
       
  1513     <xsl:text>            console.log("pressedi...")
 
       
  1514 </xsl:text>
 
       
  1515     <xsl:text>            this.active_elt.setAttribute("style", this.active_style);
 
       
  1516 </xsl:text>
 
       
  1517     <xsl:text>            this.inactive_elt.setAttribute("style", "display:none");
 
       
  1518 </xsl:text>
 
       
  1519     <xsl:text>        }
 
       
  1520 </xsl:text>
 
       
  1521     <xsl:text>        this.apply_hmi_value(0, 1);
 
       
  1522 </xsl:text>
 
       
  1523     <xsl:text>        console.log("pressed")
 
       
  1524 </xsl:text>
 
       
  1525     <xsl:text>        // TODO inhibit all mouse/touch events except mouse up (in other word grab cursor)
 
       
  1526 </xsl:text>
 
       
  1527     <xsl:text>    }
 
       
  1528 </xsl:text>
 
       
  1529     <xsl:text>
 
       
  1530 </xsl:text>
 
       
  1531     <xsl:text>    on_mouse_up(evt) {
 
       
  1532 </xsl:text>
 
       
  1533     <xsl:text>        if (this.active_style &amp;&amp; this.inactive_style) {
 
       
  1534 </xsl:text>
 
       
  1535     <xsl:text>            console.log("unpressedi...")
 
       
  1536 </xsl:text>
 
  1541     <xsl:text>            this.active_elt.setAttribute("style", "display:none");
 
  1537     <xsl:text>            this.active_elt.setAttribute("style", "display:none");
 
  1542 </xsl:text>
 
  1538 </xsl:text>
 
  1543     <xsl:text>            this.inactive_elt.setAttribute("style", this.inactive_style);
 
  1539     <xsl:text>            this.inactive_elt.setAttribute("style", this.inactive_style);
 
  1544 </xsl:text>
 
  1540 </xsl:text>
 
  1545     <xsl:text>        }
 
  1541     <xsl:text>        }
 
  1546 </xsl:text>
 
  1542 </xsl:text>
 
  1547     <xsl:text>
 
  1543     <xsl:text>        this.apply_hmi_value(0, 0);
 
  1548 </xsl:text>
 
  1544 </xsl:text>
 
  1549     <xsl:text>        this.element.setAttribute("onmousedown", "hmi_widgets["+this.element_id+"].on_mouse_down(evt)");
 
  1545     <xsl:text>        console.log("unpressed")
 
  1550 </xsl:text>
 
  1546 </xsl:text>
 
  1551     <xsl:text>        this.element.setAttribute("onmouseup", "hmi_widgets["+this.element_id+"].on_mouse_up(evt)");
 
  1547     <xsl:text>        // TODO release inhibited events 
  1552 </xsl:text>
 
  1548 </xsl:text>
 
  1553     <xsl:text>     }
 
  1549     <xsl:text>    }
 
       
  1550 </xsl:text>
 
       
  1551     <xsl:text>
 
       
  1552 </xsl:text>
 
       
  1553     <xsl:text>    init() {
 
       
  1554 </xsl:text>
 
       
  1555     <xsl:text>       // TODO : move to widget_defs so that we can have generated string literals directly
 
       
  1556 </xsl:text>
 
       
  1557     <xsl:text>       this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined;
 
       
  1558 </xsl:text>
 
       
  1559     <xsl:text>       this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined;
 
       
  1560 </xsl:text>
 
       
  1561     <xsl:text>
 
       
  1562 </xsl:text>
 
       
  1563     <xsl:text>       if (this.active_style &amp;&amp; this.inactive_style) {
 
       
  1564 </xsl:text>
 
       
  1565     <xsl:text>           this.active_elt.setAttribute("style", "display:none");
 
       
  1566 </xsl:text>
 
       
  1567     <xsl:text>           this.inactive_elt.setAttribute("style", this.inactive_style);
 
       
  1568 </xsl:text>
 
       
  1569     <xsl:text>       }
 
       
  1570 </xsl:text>
 
       
  1571     <xsl:text>
 
       
  1572 </xsl:text>
 
       
  1573     <xsl:text>       this.element.setAttribute("onmousedown", "hmi_widgets[\""+this.element_id+"\"].on_mouse_down(evt)");
 
       
  1574 </xsl:text>
 
       
  1575     <xsl:text>       this.element.setAttribute("onmouseup", "hmi_widgets[\""+this.element_id+"\"].on_mouse_up(evt)");
 
       
  1576 </xsl:text>
 
       
  1577     <xsl:text>    }
 
  1554 </xsl:text>
 
  1578 </xsl:text>
 
  1555     <xsl:text>}
 
  1579     <xsl:text>}
 
  1556 </xsl:text>
 
  1580 </xsl:text>
 
  1557   </xsl:template>
 
  1581   </xsl:template>
 
  1558   <xsl:template mode="widget_defs" match="widget[@type='Button']">
 
  1582   <xsl:template mode="widget_defs" match="widget[@type='Button']">
 
  1983     <xsl:text>    frequency = 5;
 
  2007     <xsl:text>    frequency = 5;
 
  1984 </xsl:text>
 
  2008 </xsl:text>
 
  1985     <xsl:text>    dispatch(value, oldval, index) {
 
  2009     <xsl:text>    dispatch(value, oldval, index) {
 
  1986 </xsl:text>
 
  2010 </xsl:text>
 
  1987     <xsl:text>        this.fields[index] = value;    
  2011     <xsl:text>        this.fields[index] = value;    
  1988 </xsl:text>
 
       
  1989     <xsl:text>        console.log(value, index);
 
       
  1990 </xsl:text>
 
  2012 </xsl:text>
 
  1991     <xsl:text>        this.element.textContent = this.args.length == 1 ? vsprintf(this.args[0],this.fields) : this.fields.join(' ');
 
  2013     <xsl:text>        this.element.textContent = this.args.length == 1 ? vsprintf(this.args[0],this.fields) : this.fields.join(' ');
 
  1992 </xsl:text>
 
  2014 </xsl:text>
 
  1993     <xsl:text>    }
 
  2015     <xsl:text>    }
 
  1994 </xsl:text>
 
  2016 </xsl:text>
 
  2822     <xsl:text>                0, 
  2844     <xsl:text>                0, 
  2823 </xsl:text>
 
  2845 </xsl:text>
 
  2824     <xsl:text>                this.menu_offset - spanslength);
 
  2846     <xsl:text>                this.menu_offset - spanslength);
 
  2825 </xsl:text>
 
  2847 </xsl:text>
 
  2826     <xsl:text>        }
 
  2848     <xsl:text>        }
 
  2827 </xsl:text>
 
       
  2828     <xsl:text>        console.log(this.menu_offset);
 
       
  2829 </xsl:text>
 
  2849 </xsl:text>
 
  2830     <xsl:text>        this.set_partial_text();
 
  2850     <xsl:text>        this.set_partial_text();
 
  2831 </xsl:text>
 
  2851 </xsl:text>
 
  2832     <xsl:text>    },
 
  2852     <xsl:text>    },
 
  2833 </xsl:text>
 
  2853 </xsl:text>
 
  3357 </xsl:text>
 
  3377 </xsl:text>
 
  3358     <xsl:text>        const query = {
 
  3378     <xsl:text>        const query = {
 
  3359 </xsl:text>
 
  3379 </xsl:text>
 
  3360     <xsl:text>            args: this.args,
 
  3380     <xsl:text>            args: this.args,
 
  3361 </xsl:text>
 
  3381 </xsl:text>
 
  3362     <xsl:text>            vars: this.cache
 
  3382     <xsl:text>            vars: this.cache,
 
       
  3383 </xsl:text>
 
       
  3384     <xsl:text>            visible: this.visible
 
  3363 </xsl:text>
 
  3385 </xsl:text>
 
  3364     <xsl:text>        };
 
  3386     <xsl:text>        };
 
  3365 </xsl:text>
 
  3387 </xsl:text>
 
  3366     <xsl:text>
 
  3388     <xsl:text>
 
  3367 </xsl:text>
 
  3389 </xsl:text>
 
  3386     <xsl:text>
 
  3408     <xsl:text>
 
  3387 </xsl:text>
 
  3409 </xsl:text>
 
  3388     <xsl:text>    }
 
  3410     <xsl:text>    }
 
  3389 </xsl:text>
 
  3411 </xsl:text>
 
  3390     <xsl:text>    dispatch(value, oldval, index) {
 
  3412     <xsl:text>    dispatch(value, oldval, index) {
 
  3391 </xsl:text>
 
       
  3392     <xsl:text>        console.log("mhooo", index);
 
       
  3393 </xsl:text>
 
  3413 </xsl:text>
 
  3394     <xsl:text>        this.cache[index] = value;
 
  3414     <xsl:text>        this.cache[index] = value;
 
  3395 </xsl:text>
 
  3415 </xsl:text>
 
  3396     <xsl:text>        this.do_http_request();
 
  3416     <xsl:text>        this.do_http_request();
 
  3397 </xsl:text>
 
  3417 </xsl:text>
 
  3584     </xsl:apply-templates>
 
  3604     </xsl:apply-templates>
 
  3585   </xsl:template>
 
  3605   </xsl:template>
 
  3586   <xsl:template mode="json_table_render" match="svg:g">
 
  3606   <xsl:template mode="json_table_render" match="svg:g">
 
  3587     <xsl:param name="expressions"/>
 
  3607     <xsl:param name="expressions"/>
 
  3588     <xsl:param name="widget_elts"/>
 
  3608     <xsl:param name="widget_elts"/>
 
       
  3609     <xsl:variable name="gid" select="@id"/>
 
       
  3610     <xsl:variable name="varprefix">
 
       
  3611       <xsl:text>obj_</xsl:text>
 
       
  3612       <xsl:value-of select="$gid"/>
 
       
  3613       <xsl:text>_</xsl:text>
 
       
  3614     </xsl:variable>
 
       
  3615     <xsl:text>        try {
 
       
  3616 </xsl:text>
 
       
  3617     <xsl:for-each select="$expressions/expression">
 
       
  3618       <xsl:text>         let </xsl:text>
 
       
  3619       <xsl:value-of select="$varprefix"/>
 
       
  3620       <xsl:value-of select="position()"/>
 
       
  3621       <xsl:text> = </xsl:text>
 
       
  3622       <xsl:value-of select="@content"/>
 
       
  3623       <xsl:text>;
 
       
  3624 </xsl:text>
 
       
  3625       <xsl:text>         if(</xsl:text>
 
       
  3626       <xsl:value-of select="$varprefix"/>
 
       
  3627       <xsl:value-of select="position()"/>
 
       
  3628       <xsl:text> == undefined) {
 
       
  3629 </xsl:text>
 
       
  3630       <xsl:text>              console.log("</xsl:text>
 
       
  3631       <xsl:value-of select="$varprefix"/>
 
       
  3632       <xsl:value-of select="position()"/>
 
       
  3633       <xsl:text> = </xsl:text>
 
       
  3634       <xsl:value-of select="@content"/>
 
       
  3635       <xsl:text>");
 
       
  3636 </xsl:text>
 
       
  3637       <xsl:text>              throw null;
 
       
  3638 </xsl:text>
 
       
  3639       <xsl:text>         }
 
       
  3640 </xsl:text>
 
       
  3641     </xsl:for-each>
 
       
  3642     <xsl:variable name="new_expressions">
 
       
  3643       <xsl:for-each select="$expressions/expression">
 
       
  3644         <xsl:copy>
 
       
  3645           <xsl:copy-of select="@name"/>
 
       
  3646           <xsl:attribute name="content">
 
       
  3647             <xsl:value-of select="$varprefix"/>
 
       
  3648             <xsl:value-of select="position()"/>
 
       
  3649           </xsl:attribute>
 
       
  3650         </xsl:copy>
 
       
  3651       </xsl:for-each>
 
       
  3652     </xsl:variable>
 
       
  3653     <xsl:text>          id("</xsl:text>
 
       
  3654     <xsl:value-of select="@id"/>
 
       
  3655     <xsl:text>").setAttribute("style", "</xsl:text>
 
       
  3656     <xsl:value-of select="@style"/>
 
       
  3657     <xsl:text>");
 
       
  3658 </xsl:text>
 
  3589     <xsl:variable name="label" select="func:filter_non_widget_label(., $widget_elts)"/>
 
  3659     <xsl:variable name="label" select="func:filter_non_widget_label(., $widget_elts)"/>
 
  3590     <xsl:apply-templates mode="json_table_render" select="*">
 
  3660     <xsl:apply-templates mode="json_table_render" select="*">
 
  3591       <xsl:with-param name="expressions" select="func:json_expressions($expressions, $label)"/>
 
  3661       <xsl:with-param name="expressions" select="func:json_expressions(exsl:node-set($new_expressions), $label)"/>
 
  3592       <xsl:with-param name="widget_elts" select="$widget_elts"/>
 
  3662       <xsl:with-param name="widget_elts" select="$widget_elts"/>
 
  3593     </xsl:apply-templates>
 
  3663     </xsl:apply-templates>
 
       
  3664     <xsl:text>        } catch(err) {
 
       
  3665 </xsl:text>
 
       
  3666     <xsl:text>          id("</xsl:text>
 
       
  3667     <xsl:value-of select="$gid"/>
 
       
  3668     <xsl:text>").setAttribute("style", "display:none");
 
       
  3669 </xsl:text>
 
       
  3670     <xsl:text>        }
 
       
  3671 </xsl:text>
 
  3594   </xsl:template>
 
  3672   </xsl:template>
 
  3595   <xsl:template mode="widget_defs" match="widget[@type='JsonTable']">
 
  3673   <xsl:template mode="widget_defs" match="widget[@type='JsonTable']">
 
  3596     <xsl:param name="hmi_element"/>
 
  3674     <xsl:param name="hmi_element"/>
 
  3597     <xsl:call-template name="defs_by_labels">
 
  3675     <xsl:call-template name="defs_by_labels">
 
  3598       <xsl:with-param name="hmi_element" select="$hmi_element"/>
 
  3676       <xsl:with-param name="hmi_element" select="$hmi_element"/>
 
  3606         <xsl:text>forward backward cursor</xsl:text>
 
  3684         <xsl:text>forward backward cursor</xsl:text>
 
  3607       </xsl:with-param>
 
  3685       </xsl:with-param>
 
  3608       <xsl:with-param name="mandatory" select="'no'"/>
 
  3686       <xsl:with-param name="mandatory" select="'no'"/>
 
  3609     </xsl:call-template>
 
  3687     </xsl:call-template>
 
  3610     <xsl:variable name="data_elt" select="$result_svg_ns//*[@id = $hmi_element/@id]/*[@inkscape:label = 'data']"/>
 
  3688     <xsl:variable name="data_elt" select="$result_svg_ns//*[@id = $hmi_element/@id]/*[@inkscape:label = 'data']"/>
 
  3611     <xsl:text>    spread_json_data: function(jdata) {
 
  3689     <xsl:text>    visible: </xsl:text>
 
       
  3690     <xsl:value-of select="count($data_elt/*[@inkscape:label])"/>
 
       
  3691     <xsl:text>,
 
       
  3692 </xsl:text>
 
       
  3693     <xsl:text>    spread_json_data: function(janswer) {
 
       
  3694 </xsl:text>
 
       
  3695     <xsl:text>        let [range,position,jdata] = janswer;
 
       
  3696 </xsl:text>
 
       
  3697     <xsl:text>        console.log(range,position,jdata);
 
  3612 </xsl:text>
 
  3698 </xsl:text>
 
  3613     <xsl:apply-templates mode="json_table_render" select="$data_elt/*">
 
  3699     <xsl:apply-templates mode="json_table_render" select="$data_elt/*">
 
  3614       <xsl:with-param name="expressions" select="$initexpr_ns"/>
 
  3700       <xsl:with-param name="expressions" select="$initexpr_ns"/>
 
  3615       <xsl:with-param name="widget_elts" select="$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*"/>
 
  3701       <xsl:with-param name="widget_elts" select="$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*"/>
 
  3616     </xsl:apply-templates>
 
  3702     </xsl:apply-templates>
 
  5451 </xsl:text>
 
  5537 </xsl:text>
 
  5452           <xsl:text>function send_hmi_value(index, value) {
 
  5538           <xsl:text>function send_hmi_value(index, value) {
 
  5453 </xsl:text>
 
  5539 </xsl:text>
 
  5454           <xsl:text>    if(index &gt; last_remote_index){
 
  5540           <xsl:text>    if(index &gt; last_remote_index){
 
  5455 </xsl:text>
 
  5541 </xsl:text>
 
  5456           <xsl:text>        console.log("updated local variable ",index,value);
 
       
  5457 </xsl:text>
 
       
  5458           <xsl:text>        updates[index] = value;
 
  5542           <xsl:text>        updates[index] = value;
 
  5459 </xsl:text>
 
  5543 </xsl:text>
 
  5460           <xsl:text>        requestHMIAnimation();
 
  5544           <xsl:text>        requestHMIAnimation();
 
  5461 </xsl:text>
 
  5545 </xsl:text>
 
  5462           <xsl:text>        return;
 
  5546           <xsl:text>        return;
 
  5803 </xsl:text>
 
  5887 </xsl:text>
 
  5804           <xsl:text>
 
  5888           <xsl:text>
 
  5805 </xsl:text>
 
  5889 </xsl:text>
 
  5806           <xsl:text>    let [keypadid, xcoord, ycoord] = keypads[valuetype];
 
  5890           <xsl:text>    let [keypadid, xcoord, ycoord] = keypads[valuetype];
 
  5807 </xsl:text>
 
  5891 </xsl:text>
 
  5808           <xsl:text>    console.log('XXX TODO : Edit value', path, valuetype, callback, initial, keypadid);
 
       
  5809 </xsl:text>
 
       
  5810           <xsl:text>    edit_callback = callback;
 
  5892           <xsl:text>    edit_callback = callback;
 
  5811 </xsl:text>
 
  5893 </xsl:text>
 
  5812           <xsl:text>    let widget = hmi_widgets[keypadid];
 
  5894           <xsl:text>    let widget = hmi_widgets[keypadid];
 
  5813 </xsl:text>
 
  5895 </xsl:text>
 
  5814           <xsl:text>    widget.start_edit(path, valuetype, callback, initial, size);
 
  5896           <xsl:text>    widget.start_edit(path, valuetype, callback, initial, size);
 
  5893 </xsl:text>
 
  5975 </xsl:text>
 
  5894           <xsl:text>    if(eltsub.active_style !== undefined)
 
  5976           <xsl:text>    if(eltsub.active_style !== undefined)
 
  5895 </xsl:text>
 
  5977 </xsl:text>
 
  5896           <xsl:text>            eltsub.active.setAttribute("style", eltsub.active_style);
 
  5978           <xsl:text>            eltsub.active.setAttribute("style", eltsub.active_style);
 
  5897 </xsl:text>
 
  5979 </xsl:text>
 
  5898           <xsl:text>    console.log("active", eltsub);
 
       
  5899 </xsl:text>
 
       
  5900           <xsl:text>};
 
  5980           <xsl:text>};
 
  5901 </xsl:text>
 
  5981 </xsl:text>
 
  5902           <xsl:text>function widget_inactive_activable(eltsub) {
 
  5982           <xsl:text>function widget_inactive_activable(eltsub) {
 
  5903 </xsl:text>
 
  5983 </xsl:text>
 
  5904           <xsl:text>    if(eltsub.active_style === undefined)
 
  5984           <xsl:text>    if(eltsub.active_style === undefined)
 
  5908           <xsl:text>    eltsub.active.setAttribute("style", "display:none");
 
  5988           <xsl:text>    eltsub.active.setAttribute("style", "display:none");
 
  5909 </xsl:text>
 
  5989 </xsl:text>
 
  5910           <xsl:text>    if(eltsub.inactive_style !== undefined)
 
  5990           <xsl:text>    if(eltsub.inactive_style !== undefined)
 
  5911 </xsl:text>
 
  5991 </xsl:text>
 
  5912           <xsl:text>            eltsub.inactive.setAttribute("style", eltsub.inactive_style);
 
  5992           <xsl:text>            eltsub.inactive.setAttribute("style", eltsub.inactive_style);
 
  5913 </xsl:text>
 
       
  5914           <xsl:text>    console.log("inactive", eltsub);
 
       
  5915 </xsl:text>
 
  5993 </xsl:text>
 
  5916           <xsl:text>};
 
  5994           <xsl:text>};
 
  5917 </xsl:text>
 
  5995 </xsl:text>
 
  5918         </script>
 
  5996         </script>
 
  5919       </body>
 
  5997       </body>
beremiz