1473 <xsl:otherwise> |
1473 <xsl:otherwise> |
1474 <func:result select="$txt"/> |
1474 <func:result select="$txt"/> |
1475 </xsl:otherwise> |
1475 </xsl:otherwise> |
1476 </xsl:choose> |
1476 </xsl:choose> |
1477 </func:function> |
1477 </func:function> |
|
1478 <xsl:template mode="widget_class" match="widget[@type='Animate']"> |
|
1479 <xsl:text>class AnimateWidget extends Widget{ |
|
1480 </xsl:text> |
|
1481 <xsl:text> frequency = 5; |
|
1482 </xsl:text> |
|
1483 <xsl:text> speed = 0; |
|
1484 </xsl:text> |
|
1485 <xsl:text> start = false; |
|
1486 </xsl:text> |
|
1487 <xsl:text> widget_center = undefined; |
|
1488 </xsl:text> |
|
1489 <xsl:text> |
|
1490 </xsl:text> |
|
1491 <xsl:text> dispatch(value) { |
|
1492 </xsl:text> |
|
1493 <xsl:text> this.speed = value / 5; |
|
1494 </xsl:text> |
|
1495 <xsl:text> |
|
1496 </xsl:text> |
|
1497 <xsl:text> //reconfigure animation |
|
1498 </xsl:text> |
|
1499 <xsl:text> this.request_animate(); |
|
1500 </xsl:text> |
|
1501 <xsl:text> } |
|
1502 </xsl:text> |
|
1503 <xsl:text> |
|
1504 </xsl:text> |
|
1505 <xsl:text> animate(){ |
|
1506 </xsl:text> |
|
1507 <xsl:text> // change animation properties |
|
1508 </xsl:text> |
|
1509 <xsl:text> for(let child of this.element.children){ |
|
1510 </xsl:text> |
|
1511 <xsl:text> if(child.nodeName.startsWith("animate")){ |
|
1512 </xsl:text> |
|
1513 <xsl:text> if(this.speed != 0 && !this.start){ |
|
1514 </xsl:text> |
|
1515 <xsl:text> this.start = true; |
|
1516 </xsl:text> |
|
1517 <xsl:text> this.element.beginElement(); |
|
1518 </xsl:text> |
|
1519 <xsl:text> } |
|
1520 </xsl:text> |
|
1521 <xsl:text> |
|
1522 </xsl:text> |
|
1523 <xsl:text> if(this.speed > 0){ |
|
1524 </xsl:text> |
|
1525 <xsl:text> child.setAttribute("dur", this.speed+"s"); |
|
1526 </xsl:text> |
|
1527 <xsl:text> } |
|
1528 </xsl:text> |
|
1529 <xsl:text> else if(this.speed < 0){ |
|
1530 </xsl:text> |
|
1531 <xsl:text> child.setAttribute("dur", (-1)*this.speed+"s"); |
|
1532 </xsl:text> |
|
1533 <xsl:text> } |
|
1534 </xsl:text> |
|
1535 <xsl:text> else{ |
|
1536 </xsl:text> |
|
1537 <xsl:text> this.start = false; |
|
1538 </xsl:text> |
|
1539 <xsl:text> this.element.endElement(); |
|
1540 </xsl:text> |
|
1541 <xsl:text> } |
|
1542 </xsl:text> |
|
1543 <xsl:text> } |
|
1544 </xsl:text> |
|
1545 <xsl:text> } |
|
1546 </xsl:text> |
|
1547 <xsl:text> } |
|
1548 </xsl:text> |
|
1549 <xsl:text> |
|
1550 </xsl:text> |
|
1551 <xsl:text> init() { |
|
1552 </xsl:text> |
|
1553 <xsl:text> let widget_pos = this.element.getBBox(); |
|
1554 </xsl:text> |
|
1555 <xsl:text> this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)]; |
|
1556 </xsl:text> |
|
1557 <xsl:text> } |
|
1558 </xsl:text> |
|
1559 <xsl:text>} |
|
1560 </xsl:text> |
|
1561 </xsl:template> |
|
1562 <xsl:template mode="widget_defs" match="widget[@type='Animate']"> |
|
1563 <xsl:param name="hmi_element"/> |
|
1564 <xsl:text> |
|
1565 </xsl:text> |
|
1566 </xsl:template> |
|
1567 <xsl:template mode="widget_class" match="widget[@type='AnimateRotation']"> |
|
1568 <xsl:text>class AnimateRotationWidget extends Widget{ |
|
1569 </xsl:text> |
|
1570 <xsl:text> frequency = 5; |
|
1571 </xsl:text> |
|
1572 <xsl:text> speed = 0; |
|
1573 </xsl:text> |
|
1574 <xsl:text> widget_center = undefined; |
|
1575 </xsl:text> |
|
1576 <xsl:text> |
|
1577 </xsl:text> |
|
1578 <xsl:text> dispatch(value) { |
|
1579 </xsl:text> |
|
1580 <xsl:text> this.speed = value / 5; |
|
1581 </xsl:text> |
|
1582 <xsl:text> |
|
1583 </xsl:text> |
|
1584 <xsl:text> //reconfigure animation |
|
1585 </xsl:text> |
|
1586 <xsl:text> this.request_animate(); |
|
1587 </xsl:text> |
|
1588 <xsl:text> } |
|
1589 </xsl:text> |
|
1590 <xsl:text> |
|
1591 </xsl:text> |
|
1592 <xsl:text> animate(){ |
|
1593 </xsl:text> |
|
1594 <xsl:text> // change animation properties |
|
1595 </xsl:text> |
|
1596 <xsl:text> for(let child of this.element.children){ |
|
1597 </xsl:text> |
|
1598 <xsl:text> if(child.nodeName == "animateTransform"){ |
|
1599 </xsl:text> |
|
1600 <xsl:text> if(this.speed > 0){ |
|
1601 </xsl:text> |
|
1602 <xsl:text> child.setAttribute("dur", this.speed+"s"); |
|
1603 </xsl:text> |
|
1604 <xsl:text> child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1605 </xsl:text> |
|
1606 <xsl:text> child.setAttribute("to", "360 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1607 </xsl:text> |
|
1608 <xsl:text> } |
|
1609 </xsl:text> |
|
1610 <xsl:text> else if(this.speed < 0){ |
|
1611 </xsl:text> |
|
1612 <xsl:text> child.setAttribute("dur", (-1)*this.speed+"s"); |
|
1613 </xsl:text> |
|
1614 <xsl:text> child.setAttribute("from", "360 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1615 </xsl:text> |
|
1616 <xsl:text> child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1617 </xsl:text> |
|
1618 <xsl:text> } |
|
1619 </xsl:text> |
|
1620 <xsl:text> else{ |
|
1621 </xsl:text> |
|
1622 <xsl:text> child.setAttribute("from", "0 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1623 </xsl:text> |
|
1624 <xsl:text> child.setAttribute("to", "0 "+this.widget_center[0]+" "+this.widget_center[1]); |
|
1625 </xsl:text> |
|
1626 <xsl:text> } |
|
1627 </xsl:text> |
|
1628 <xsl:text> } |
|
1629 </xsl:text> |
|
1630 <xsl:text> } |
|
1631 </xsl:text> |
|
1632 <xsl:text> } |
|
1633 </xsl:text> |
|
1634 <xsl:text> |
|
1635 </xsl:text> |
|
1636 <xsl:text> init() { |
|
1637 </xsl:text> |
|
1638 <xsl:text> let widget_pos = this.element.getBBox(); |
|
1639 </xsl:text> |
|
1640 <xsl:text> this.widget_center = [(widget_pos.x+widget_pos.width/2), (widget_pos.y+widget_pos.height/2)]; |
|
1641 </xsl:text> |
|
1642 <xsl:text> } |
|
1643 </xsl:text> |
|
1644 <xsl:text>} |
|
1645 </xsl:text> |
|
1646 </xsl:template> |
|
1647 <xsl:template mode="widget_defs" match="widget[@type='AnimateRotation']"> |
|
1648 <xsl:param name="hmi_element"/> |
|
1649 <xsl:text> |
|
1650 </xsl:text> |
|
1651 </xsl:template> |
1478 <xsl:template mode="widget_class" match="widget[@type='Back']"> |
1652 <xsl:template mode="widget_class" match="widget[@type='Back']"> |
1479 <xsl:text>class BackWidget extends Widget{ |
1653 <xsl:text>class BackWidget extends Widget{ |
1480 </xsl:text> |
1654 </xsl:text> |
1481 <xsl:text> on_click(evt) { |
1655 <xsl:text> on_click(evt) { |
1482 </xsl:text> |
1656 </xsl:text> |
1516 </xsl:text> |
1692 </xsl:text> |
1517 <xsl:text> |
1693 <xsl:text> |
1518 </xsl:text> |
1694 </xsl:text> |
1519 <xsl:text> dispatch(value) { |
1695 <xsl:text> dispatch(value) { |
1520 </xsl:text> |
1696 </xsl:text> |
1521 <xsl:text> if(value){ |
1697 <xsl:text> this.state_plc = value; |
1522 </xsl:text> |
1698 </xsl:text> |
1523 <xsl:text> this.button_release(); |
1699 <xsl:text> if(this.plc_lock){ |
|
1700 </xsl:text> |
|
1701 <xsl:text> if(this.state_plc == 1){ |
|
1702 </xsl:text> |
|
1703 <xsl:text> this.apply_hmi_value(0, 0); |
|
1704 </xsl:text> |
|
1705 <xsl:text> this.plc_lock = false; |
|
1706 </xsl:text> |
|
1707 <xsl:text> } |
1524 </xsl:text> |
1708 </xsl:text> |
1525 <xsl:text> } |
1709 <xsl:text> } |
1526 </xsl:text> |
1710 </xsl:text> |
1527 <xsl:text> } |
1711 <xsl:text> |
1528 </xsl:text> |
1712 </xsl:text> |
1529 <xsl:text> |
1713 <xsl:text> //redraw button |
1530 </xsl:text> |
1714 </xsl:text> |
1531 <xsl:text> on_mouse_down(evt) { |
1715 <xsl:text> this.state_hmi = this.state_plc; |
1532 </xsl:text> |
1716 </xsl:text> |
1533 <xsl:text> if (this.active_style && this.inactive_style) { |
1717 <xsl:text> this.request_animate(); |
1534 </xsl:text> |
1718 </xsl:text> |
1535 <xsl:text> this.active_elt.setAttribute("style", this.active_style); |
1719 <xsl:text> } |
1536 </xsl:text> |
1720 </xsl:text> |
1537 <xsl:text> this.inactive_elt.setAttribute("style", "display:none"); |
1721 <xsl:text> |
1538 </xsl:text> |
1722 </xsl:text> |
1539 <xsl:text> } |
1723 <xsl:text> animate(){ |
1540 </xsl:text> |
1724 </xsl:text> |
1541 <xsl:text> this.apply_hmi_value(0, 1); |
1725 <xsl:text> if (this.active_style && this.inactive_style) { |
1542 </xsl:text> |
1726 </xsl:text> |
1543 <xsl:text> this.plc_lock = false; |
1727 <xsl:text> // redraw button on screen refresh |
1544 </xsl:text> |
1728 </xsl:text> |
1545 <xsl:text> } |
1729 <xsl:text> if (this.state_hmi) { |
1546 </xsl:text> |
1730 </xsl:text> |
1547 <xsl:text> |
1731 <xsl:text> this.active_elt.setAttribute("style", this.active_style); |
1548 </xsl:text> |
1732 </xsl:text> |
1549 <xsl:text> on_mouse_up(evt) { |
1733 <xsl:text> this.inactive_elt.setAttribute("style", "display:none"); |
1550 </xsl:text> |
1734 </xsl:text> |
1551 <xsl:text> this.button_release(); |
1735 <xsl:text> } else { |
1552 </xsl:text> |
1736 </xsl:text> |
1553 <xsl:text> } |
1737 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
1554 </xsl:text> |
1738 </xsl:text> |
1555 <xsl:text> |
1739 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
1556 </xsl:text> |
1740 </xsl:text> |
1557 <xsl:text> button_release(){ |
1741 <xsl:text> } |
1558 </xsl:text> |
1742 </xsl:text> |
1559 <xsl:text> if(!this.plc_lock){ |
1743 <xsl:text> } |
1560 </xsl:text> |
1744 </xsl:text> |
1561 <xsl:text> this.plc_lock = true; |
1745 <xsl:text> } |
|
1746 </xsl:text> |
|
1747 <xsl:text> |
|
1748 </xsl:text> |
|
1749 <xsl:text> on_click(evt) { |
|
1750 </xsl:text> |
|
1751 <xsl:text> //set state and apply if plc is 0 |
|
1752 </xsl:text> |
|
1753 <xsl:text> this.plc_lock = true; |
|
1754 </xsl:text> |
|
1755 <xsl:text> if(this.state_plc == 0){ |
|
1756 </xsl:text> |
|
1757 <xsl:text> this.apply_hmi_value(0, 1); |
1562 </xsl:text> |
1758 </xsl:text> |
1563 <xsl:text> } |
1759 <xsl:text> } |
1564 </xsl:text> |
1760 </xsl:text> |
1565 <xsl:text> else{ |
1761 <xsl:text> //redraw button |
1566 </xsl:text> |
1762 </xsl:text> |
1567 <xsl:text> if (this.active_style && this.inactive_style) { |
1763 <xsl:text> this.request_animate(); |
1568 </xsl:text> |
1764 </xsl:text> |
1569 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
1765 <xsl:text> } |
1570 </xsl:text> |
1766 </xsl:text> |
1571 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
1767 <xsl:text> |
1572 </xsl:text> |
1768 </xsl:text> |
1573 <xsl:text> } |
1769 <xsl:text> on_press(evt) { |
1574 </xsl:text> |
1770 </xsl:text> |
1575 <xsl:text> this.apply_hmi_value(0, 0); |
1771 <xsl:text> //set graphic |
|
1772 </xsl:text> |
|
1773 <xsl:text> this.state_hmi = 1; |
|
1774 </xsl:text> |
|
1775 <xsl:text> //redraw button |
|
1776 </xsl:text> |
|
1777 <xsl:text> this.request_animate(); |
|
1778 </xsl:text> |
|
1779 <xsl:text> } |
|
1780 </xsl:text> |
|
1781 <xsl:text> |
|
1782 </xsl:text> |
|
1783 <xsl:text> init() { |
|
1784 </xsl:text> |
|
1785 <xsl:text> this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined; |
|
1786 </xsl:text> |
|
1787 <xsl:text> this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined; |
|
1788 </xsl:text> |
|
1789 <xsl:text> |
|
1790 </xsl:text> |
|
1791 <xsl:text> if (this.active_style && this.inactive_style) { |
|
1792 </xsl:text> |
|
1793 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
|
1794 </xsl:text> |
|
1795 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
1576 </xsl:text> |
1796 </xsl:text> |
1577 <xsl:text> } |
1797 <xsl:text> } |
1578 </xsl:text> |
1798 </xsl:text> |
1579 <xsl:text> } |
1799 <xsl:text> |
1580 </xsl:text> |
1800 </xsl:text> |
1581 <xsl:text> |
1801 <xsl:text> this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)"); |
1582 </xsl:text> |
1802 </xsl:text> |
1583 <xsl:text> init() { |
1803 <xsl:text> this.element.setAttribute("onmousedown", "hmi_widgets['"+this.element_id+"'].on_press(evt)"); |
1584 </xsl:text> |
|
1585 <xsl:text> this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined; |
|
1586 </xsl:text> |
|
1587 <xsl:text> this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined; |
|
1588 </xsl:text> |
|
1589 <xsl:text> |
|
1590 </xsl:text> |
|
1591 <xsl:text> if (this.active_style && this.inactive_style) { |
|
1592 </xsl:text> |
|
1593 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
|
1594 </xsl:text> |
|
1595 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
|
1596 </xsl:text> |
|
1597 <xsl:text> } |
|
1598 </xsl:text> |
|
1599 <xsl:text> |
|
1600 </xsl:text> |
|
1601 <xsl:text> this.element.setAttribute("onmousedown", "hmi_widgets["+this.element_id+"].on_mouse_down(evt)"); |
|
1602 </xsl:text> |
|
1603 <xsl:text> this.element.setAttribute("onmouseup", "hmi_widgets["+this.element_id+"].on_mouse_up(evt)"); |
|
1604 </xsl:text> |
1804 </xsl:text> |
1605 <xsl:text> } |
1805 <xsl:text> } |
1606 </xsl:text> |
1806 </xsl:text> |
1607 <xsl:text>} |
1807 <xsl:text>} |
1608 </xsl:text> |
1808 </xsl:text> |
1748 </xsl:text> |
1948 </xsl:text> |
1749 <xsl:text> |
1949 <xsl:text> |
1750 </xsl:text> |
1950 </xsl:text> |
1751 <xsl:text> dispatch(value) { |
1951 <xsl:text> dispatch(value) { |
1752 </xsl:text> |
1952 </xsl:text> |
|
1953 <xsl:text> let [min,max,start,totallength] = this.range; |
|
1954 </xsl:text> |
|
1955 <xsl:text> //save current value inside widget |
|
1956 </xsl:text> |
|
1957 <xsl:text> this.curr_value = value; |
|
1958 </xsl:text> |
|
1959 <xsl:text> |
|
1960 </xsl:text> |
|
1961 <xsl:text> //check if in range |
|
1962 </xsl:text> |
|
1963 <xsl:text> if (this.curr_value > max){ |
|
1964 </xsl:text> |
|
1965 <xsl:text> this.curr_value = max; |
|
1966 </xsl:text> |
|
1967 <xsl:text> this.apply_hmi_value(0, this.curr_value); |
|
1968 </xsl:text> |
|
1969 <xsl:text> } |
|
1970 </xsl:text> |
|
1971 <xsl:text> else if (this.curr_value < min){ |
|
1972 </xsl:text> |
|
1973 <xsl:text> this.curr_value = min; |
|
1974 </xsl:text> |
|
1975 <xsl:text> this.apply_hmi_value(0, this.curr_value); |
|
1976 </xsl:text> |
|
1977 <xsl:text> } |
|
1978 </xsl:text> |
|
1979 <xsl:text> |
|
1980 </xsl:text> |
1753 <xsl:text> if(this.value_elt) |
1981 <xsl:text> if(this.value_elt) |
1754 </xsl:text> |
1982 </xsl:text> |
1755 <xsl:text> this.value_elt.textContent = String(value); |
1983 <xsl:text> this.value_elt.textContent = String(value); |
1756 </xsl:text> |
1984 </xsl:text> |
1757 <xsl:text> |
1985 <xsl:text> |
1758 </xsl:text> |
1986 </xsl:text> |
1759 <xsl:text> this.update_DOM(value, this.handle_elt); |
1987 <xsl:text> //don't update if draging and setpoint ghost doesn't exist |
|
1988 </xsl:text> |
|
1989 <xsl:text> if(!this.drag || (this.setpoint_elt != undefined)){ |
|
1990 </xsl:text> |
|
1991 <xsl:text> this.update_DOM(value, this.handle_elt); |
|
1992 </xsl:text> |
|
1993 <xsl:text> } |
1760 </xsl:text> |
1994 </xsl:text> |
1761 <xsl:text> } |
1995 <xsl:text> } |
1762 </xsl:text> |
1996 </xsl:text> |
1763 <xsl:text> |
1997 <xsl:text> |
1764 </xsl:text> |
1998 </xsl:text> |
1810 </xsl:text> |
2048 </xsl:text> |
1811 <xsl:text> window.removeEventListener("touchend", this.bound_on_release, true); |
2049 <xsl:text> window.removeEventListener("touchend", this.bound_on_release, true); |
1812 </xsl:text> |
2050 </xsl:text> |
1813 <xsl:text> window.removeEventListener("touchcancel", this.bound_on_release, true); |
2051 <xsl:text> window.removeEventListener("touchcancel", this.bound_on_release, true); |
1814 </xsl:text> |
2052 </xsl:text> |
|
2053 <xsl:text> |
|
2054 </xsl:text> |
|
2055 <xsl:text> //reset drag flag |
|
2056 </xsl:text> |
1815 <xsl:text> if(this.drag){ |
2057 <xsl:text> if(this.drag){ |
1816 </xsl:text> |
2058 </xsl:text> |
1817 <xsl:text> this.drag = false; |
2059 <xsl:text> this.drag = false; |
1818 </xsl:text> |
2060 </xsl:text> |
1819 <xsl:text> } |
2061 <xsl:text> } |
1820 </xsl:text> |
2062 </xsl:text> |
|
2063 <xsl:text> |
|
2064 </xsl:text> |
|
2065 <xsl:text> // get final position |
|
2066 </xsl:text> |
1821 <xsl:text> this.update_position(evt); |
2067 <xsl:text> this.update_position(evt); |
1822 </xsl:text> |
2068 </xsl:text> |
1823 <xsl:text> } |
2069 <xsl:text> } |
1824 </xsl:text> |
2070 </xsl:text> |
1825 <xsl:text> |
2071 <xsl:text> |
1826 </xsl:text> |
2072 </xsl:text> |
1827 <xsl:text> on_drag(evt){ |
2073 <xsl:text> on_drag(evt){ |
1828 </xsl:text> |
2074 </xsl:text> |
|
2075 <xsl:text> //ignore drag event for X amount of time and if not selected |
|
2076 </xsl:text> |
1829 <xsl:text> if(this.enTimer && this.drag){ |
2077 <xsl:text> if(this.enTimer && this.drag){ |
1830 </xsl:text> |
2078 </xsl:text> |
1831 <xsl:text> this.update_position(evt); |
2079 <xsl:text> this.update_position(evt); |
1832 </xsl:text> |
2080 </xsl:text> |
|
2081 <xsl:text> |
|
2082 </xsl:text> |
1833 <xsl:text> //reset timer |
2083 <xsl:text> //reset timer |
1834 </xsl:text> |
2084 </xsl:text> |
1835 <xsl:text> this.enTimer = false; |
2085 <xsl:text> this.enTimer = false; |
1836 </xsl:text> |
2086 </xsl:text> |
1837 <xsl:text> setTimeout("{hmi_widgets['"+this.element_id+"'].enTimer = true;}", 100); |
2087 <xsl:text> setTimeout("{hmi_widgets['"+this.element_id+"'].enTimer = true;}", 100); |
1928 </xsl:text> |
2178 </xsl:text> |
1929 <xsl:text> //get handle distance from mouse position |
2179 <xsl:text> //get handle distance from mouse position |
1930 </xsl:text> |
2180 </xsl:text> |
1931 <xsl:text> if(fi<fiEnd){ |
2181 <xsl:text> if(fi<fiEnd){ |
1932 </xsl:text> |
2182 </xsl:text> |
1933 <xsl:text> this.svg_dist=(fi)/(fiEnd)*(this.range[1]-this.range[0]); |
2183 <xsl:text> this.curr_value=(fi)/(fiEnd)*(this.range[1]-this.range[0]); |
1934 </xsl:text> |
2184 </xsl:text> |
1935 <xsl:text> } |
2185 <xsl:text> } |
1936 </xsl:text> |
2186 </xsl:text> |
1937 <xsl:text> else if(fiEnd<fi && fi<fiEnd+minMax){ |
2187 <xsl:text> else if(fiEnd<fi && fi<fiEnd+minMax){ |
1938 </xsl:text> |
2188 </xsl:text> |
1939 <xsl:text> this.svg_dist = this.range[1]; |
2189 <xsl:text> this.curr_value = this.range[1]; |
1940 </xsl:text> |
2190 </xsl:text> |
1941 <xsl:text> } |
2191 <xsl:text> } |
1942 </xsl:text> |
2192 </xsl:text> |
1943 <xsl:text> else{ |
2193 <xsl:text> else{ |
1944 </xsl:text> |
2194 </xsl:text> |
1945 <xsl:text> this.svg_dist = this.range[0]; |
2195 <xsl:text> this.curr_value = this.range[0]; |
1946 </xsl:text> |
2196 </xsl:text> |
1947 <xsl:text> } |
2197 <xsl:text> } |
1948 </xsl:text> |
2198 </xsl:text> |
1949 <xsl:text> |
2199 <xsl:text> |
1950 </xsl:text> |
2200 </xsl:text> |
1951 <xsl:text> |
2201 <xsl:text> //apply value to hmi |
1952 </xsl:text> |
2202 </xsl:text> |
1953 <xsl:text> this.apply_hmi_value(0, Math.ceil(this.svg_dist)); |
2203 <xsl:text> this.apply_hmi_value(0, Math.ceil(this.curr_value)); |
1954 </xsl:text> |
2204 </xsl:text> |
1955 <xsl:text> |
2205 <xsl:text> |
1956 </xsl:text> |
2206 </xsl:text> |
1957 <xsl:text> // update ghost cursor |
2207 <xsl:text> //redraw handle |
1958 </xsl:text> |
2208 </xsl:text> |
1959 <xsl:text> if(this.setpoint_elt != undefined){ |
2209 <xsl:text> this.request_animate(); |
1960 </xsl:text> |
2210 </xsl:text> |
1961 <xsl:text> this.request_animate(); |
2211 <xsl:text> |
1962 </xsl:text> |
|
1963 <xsl:text> } |
|
1964 </xsl:text> |
2212 </xsl:text> |
1965 <xsl:text> } |
2213 <xsl:text> } |
1966 </xsl:text> |
2214 </xsl:text> |
1967 <xsl:text> |
2215 <xsl:text> |
1968 </xsl:text> |
2216 </xsl:text> |
1970 </xsl:text> |
2218 </xsl:text> |
1971 <xsl:text> |
2219 <xsl:text> |
1972 </xsl:text> |
2220 </xsl:text> |
1973 <xsl:text> animate(){ |
2221 <xsl:text> animate(){ |
1974 </xsl:text> |
2222 </xsl:text> |
1975 <xsl:text> this.update_DOM(this.svg_dist, this.setpoint_elt); |
2223 <xsl:text> // redraw handle on screen refresh |
|
2224 </xsl:text> |
|
2225 <xsl:text> // check if setpoint(ghost) handle exsist otherwise update main handle |
|
2226 </xsl:text> |
|
2227 <xsl:text> if(this.setpoint_elt != undefined){ |
|
2228 </xsl:text> |
|
2229 <xsl:text> this.update_DOM(this.curr_value, this.setpoint_elt); |
|
2230 </xsl:text> |
|
2231 <xsl:text> } |
|
2232 </xsl:text> |
|
2233 <xsl:text> else{ |
|
2234 </xsl:text> |
|
2235 <xsl:text> this.update_DOM(this.curr_value, this.handle_elt); |
|
2236 </xsl:text> |
|
2237 <xsl:text> } |
1976 </xsl:text> |
2238 </xsl:text> |
1977 <xsl:text> } |
2239 <xsl:text> } |
1978 </xsl:text> |
2240 </xsl:text> |
1979 <xsl:text> |
2241 <xsl:text> |
1980 </xsl:text> |
2242 </xsl:text> |
1981 <xsl:text> on_select(evt){ |
2243 <xsl:text> on_select(evt){ |
1982 </xsl:text> |
2244 </xsl:text> |
|
2245 <xsl:text> //enable drag flag and timer |
|
2246 </xsl:text> |
1983 <xsl:text> this.drag = true; |
2247 <xsl:text> this.drag = true; |
1984 </xsl:text> |
2248 </xsl:text> |
1985 <xsl:text> this.enTimer = true; |
2249 <xsl:text> this.enTimer = true; |
1986 </xsl:text> |
2250 </xsl:text> |
|
2251 <xsl:text> |
|
2252 </xsl:text> |
|
2253 <xsl:text> //bind events |
|
2254 </xsl:text> |
1987 <xsl:text> window.addEventListener("touchmove", this.on_bound_drag, true); |
2255 <xsl:text> window.addEventListener("touchmove", this.on_bound_drag, true); |
1988 </xsl:text> |
2256 </xsl:text> |
1989 <xsl:text> window.addEventListener("mousemove", this.on_bound_drag, true); |
2257 <xsl:text> window.addEventListener("mousemove", this.on_bound_drag, true); |
1990 </xsl:text> |
2258 </xsl:text> |
1991 <xsl:text> |
2259 <xsl:text> |
1992 </xsl:text> |
2260 </xsl:text> |
1993 <xsl:text> window.addEventListener("mouseup", this.bound_on_release, true) |
2261 <xsl:text> window.addEventListener("mouseup", this.bound_on_release, true); |
1994 </xsl:text> |
2262 </xsl:text> |
1995 <xsl:text> window.addEventListener("touchend", this.bound_on_release, true); |
2263 <xsl:text> window.addEventListener("touchend", this.bound_on_release, true); |
1996 </xsl:text> |
2264 </xsl:text> |
1997 <xsl:text> window.addEventListener("touchcancel", this.bound_on_release, true); |
2265 <xsl:text> window.addEventListener("touchcancel", this.bound_on_release, true); |
1998 </xsl:text> |
2266 </xsl:text> |
|
2267 <xsl:text> |
|
2268 </xsl:text> |
|
2269 <xsl:text> //update postion on mouse press |
|
2270 </xsl:text> |
1999 <xsl:text> this.update_position(evt); |
2271 <xsl:text> this.update_position(evt); |
2000 </xsl:text> |
2272 </xsl:text> |
|
2273 <xsl:text> |
|
2274 </xsl:text> |
|
2275 <xsl:text> //prevent next events |
|
2276 </xsl:text> |
|
2277 <xsl:text> evt.stopPropagation(); |
|
2278 </xsl:text> |
2001 <xsl:text> } |
2279 <xsl:text> } |
2002 </xsl:text> |
2280 </xsl:text> |
2003 <xsl:text> |
2281 <xsl:text> |
2004 </xsl:text> |
2282 </xsl:text> |
2005 <xsl:text> init() { |
2283 <xsl:text> init() { |
2072 </xsl:text> |
2350 </xsl:text> |
2073 <xsl:text> this.on_bound_drag = this.on_drag.bind(this); |
2351 <xsl:text> this.on_bound_drag = this.on_drag.bind(this); |
2074 </xsl:text> |
2352 </xsl:text> |
2075 <xsl:text> |
2353 <xsl:text> |
2076 </xsl:text> |
2354 </xsl:text> |
2077 <xsl:text> //init events |
2355 <xsl:text> this.handle_elt.addEventListener("mousedown", this.bound_on_select); |
2078 </xsl:text> |
2356 </xsl:text> |
2079 <xsl:text> this.element.addEventListener("mousedown", this.bound_on_select); |
2357 <xsl:text> this.element.addEventListener("mousedown", this.bound_on_select); |
2080 </xsl:text> |
2358 </xsl:text> |
2081 <xsl:text> this.element.addEventListener("touchstart", this.bound_on_select); |
2359 <xsl:text> this.element.addEventListener("touchstart", this.bound_on_select); |
2082 </xsl:text> |
2360 </xsl:text> |
2083 <xsl:text> |
2361 <xsl:text> //touch recognised as page drag without next command |
|
2362 </xsl:text> |
|
2363 <xsl:text> document.body.addEventListener("touchstart", function(e){}, false); |
|
2364 </xsl:text> |
|
2365 <xsl:text> |
|
2366 </xsl:text> |
|
2367 <xsl:text> //save ghost style |
|
2368 </xsl:text> |
|
2369 <xsl:text> //save ghost style |
2084 </xsl:text> |
2370 </xsl:text> |
2085 <xsl:text> if(this.setpoint_elt != undefined){ |
2371 <xsl:text> if(this.setpoint_elt != undefined){ |
2086 </xsl:text> |
2372 </xsl:text> |
2087 <xsl:text> this.setpoint_style = this.setpoint_elt.getAttribute("style"); |
2373 <xsl:text> this.setpoint_style = this.setpoint_elt.getAttribute("style"); |
2088 </xsl:text> |
2374 </xsl:text> |
2089 <xsl:text> this.setpoint_elt.setAttribute("style", "display:none"); |
2375 <xsl:text> this.setpoint_elt.setAttribute("style", "display:none"); |
2090 </xsl:text> |
2376 </xsl:text> |
2091 <xsl:text> } |
2377 <xsl:text> } |
2092 </xsl:text> |
|
2093 <xsl:text> |
|
2094 </xsl:text> |
|
2095 <xsl:text> |
|
2096 </xsl:text> |
|
2097 <xsl:text> window.addEventListener("touchmove", hmi_widgets[this.element_id].update_position.bind(this)); |
|
2098 </xsl:text> |
|
2099 <xsl:text> window.addEventListener("mousemove", hmi_widgets[this.element_id].update_position.bind(this)); |
|
2100 </xsl:text> |
|
2101 <xsl:text> |
|
2102 </xsl:text> |
|
2103 <xsl:text> window.addEventListener("mouseup", hmi_widgets[this.element_id].on_release.bind(this)) |
|
2104 </xsl:text> |
|
2105 <xsl:text> window.addEventListener("touchend", hmi_widgets[this.element_id].on_release.bind(this)); |
|
2106 </xsl:text> |
|
2107 <xsl:text> window.addEventListener("touchcancel", hmi_widgets[this.element_id].on_release.bind(this)); |
|
2108 </xsl:text> |
2378 </xsl:text> |
2109 <xsl:text> |
2379 <xsl:text> |
2110 </xsl:text> |
2380 </xsl:text> |
2111 <xsl:text> } |
2381 <xsl:text> } |
2112 </xsl:text> |
2382 </xsl:text> |
2122 </xsl:with-param> |
2392 </xsl:with-param> |
2123 </xsl:call-template> |
2393 </xsl:call-template> |
2124 <xsl:call-template name="defs_by_labels"> |
2394 <xsl:call-template name="defs_by_labels"> |
2125 <xsl:with-param name="hmi_element" select="$hmi_element"/> |
2395 <xsl:with-param name="hmi_element" select="$hmi_element"/> |
2126 <xsl:with-param name="labels"> |
2396 <xsl:with-param name="labels"> |
2127 <xsl:text>value min max</xsl:text> |
2397 <xsl:text>value min max setpoint</xsl:text> |
2128 </xsl:with-param> |
2398 </xsl:with-param> |
2129 <xsl:with-param name="mandatory" select="'no'"/> |
2399 <xsl:with-param name="mandatory" select="'no'"/> |
|
2400 </xsl:call-template> |
|
2401 <xsl:text> |
|
2402 </xsl:text> |
|
2403 </xsl:template> |
|
2404 <xsl:template mode="widget_class" match="widget[@type='CustomHtml']"> |
|
2405 <xsl:text>class CustomHtmlWidget extends Widget{ |
|
2406 </xsl:text> |
|
2407 <xsl:text> frequency = 5; |
|
2408 </xsl:text> |
|
2409 <xsl:text> widget_size = undefined; |
|
2410 </xsl:text> |
|
2411 <xsl:text> |
|
2412 </xsl:text> |
|
2413 <xsl:text> dispatch(value) { |
|
2414 </xsl:text> |
|
2415 <xsl:text> this.request_animate(); |
|
2416 </xsl:text> |
|
2417 <xsl:text> } |
|
2418 </xsl:text> |
|
2419 <xsl:text> |
|
2420 </xsl:text> |
|
2421 <xsl:text> animate(){ |
|
2422 </xsl:text> |
|
2423 <xsl:text> } |
|
2424 </xsl:text> |
|
2425 <xsl:text> |
|
2426 </xsl:text> |
|
2427 <xsl:text> init() { |
|
2428 </xsl:text> |
|
2429 <xsl:text> this.widget_size = this.container_elt.getBBox(); |
|
2430 </xsl:text> |
|
2431 <xsl:text> this.element.innerHTML ='<foreignObject x="'+ |
|
2432 </xsl:text> |
|
2433 <xsl:text> this.widget_size.x+'" y="'+this.widget_size.y+ |
|
2434 </xsl:text> |
|
2435 <xsl:text> '" width="'+this.widget_size.width+'" height="'+this.widget_size.height+'"> '+ |
|
2436 </xsl:text> |
|
2437 <xsl:text> this.code_elt.textContent+ |
|
2438 </xsl:text> |
|
2439 <xsl:text> ' </foreignObject>'; |
|
2440 </xsl:text> |
|
2441 <xsl:text> } |
|
2442 </xsl:text> |
|
2443 <xsl:text>} |
|
2444 </xsl:text> |
|
2445 </xsl:template> |
|
2446 <xsl:template mode="widget_defs" match="widget[@type='CustomHtml']"> |
|
2447 <xsl:param name="hmi_element"/> |
|
2448 <xsl:call-template name="defs_by_labels"> |
|
2449 <xsl:with-param name="hmi_element" select="$hmi_element"/> |
|
2450 <xsl:with-param name="labels"> |
|
2451 <xsl:text>container code</xsl:text> |
|
2452 </xsl:with-param> |
2130 </xsl:call-template> |
2453 </xsl:call-template> |
2131 <xsl:text> |
2454 <xsl:text> |
2132 </xsl:text> |
2455 </xsl:text> |
2133 </xsl:template> |
2456 </xsl:template> |
2134 <xsl:template mode="widget_class" match="widget[@type='Display']"> |
2457 <xsl:template mode="widget_class" match="widget[@type='Display']"> |
3499 </xsl:text> |
3824 </xsl:text> |
3500 </xsl:template> |
3825 </xsl:template> |
3501 <xsl:template mode="widget_class" match="widget[@type='JsonTable']"> |
3826 <xsl:template mode="widget_class" match="widget[@type='JsonTable']"> |
3502 <xsl:text>class JsonTableWidget extends Widget{ |
3827 <xsl:text>class JsonTableWidget extends Widget{ |
3503 </xsl:text> |
3828 </xsl:text> |
3504 <xsl:text> cache = []; |
3829 <xsl:text> cache = [100,50]; |
3505 </xsl:text> |
3830 </xsl:text> |
3506 <xsl:text> do_http_request(...opt) { |
3831 <xsl:text> do_http_request(...opt) { |
3507 </xsl:text> |
3832 </xsl:text> |
3508 <xsl:text> const query = { |
3833 <xsl:text> const query = { |
3509 </xsl:text> |
3834 </xsl:text> |
3510 <xsl:text> args: this.args, |
3835 <xsl:text> args: this.args, |
3511 </xsl:text> |
3836 </xsl:text> |
3512 <xsl:text> vars: this.cache, |
3837 <xsl:text> range: this.cache[1], |
|
3838 </xsl:text> |
|
3839 <xsl:text> position: this.cache[2], |
3513 </xsl:text> |
3840 </xsl:text> |
3514 <xsl:text> visible: this.visible, |
3841 <xsl:text> visible: this.visible, |
3515 </xsl:text> |
3842 </xsl:text> |
3516 <xsl:text> options: opt |
3843 <xsl:text> options: opt |
3517 </xsl:text> |
3844 </xsl:text> |
3846 </xsl:text> |
4173 </xsl:text> |
3847 <xsl:text> this.apply_hmi_value(1, range); |
4174 <xsl:text> this.apply_hmi_value(1, range); |
3848 </xsl:text> |
4175 </xsl:text> |
3849 <xsl:text> this.apply_hmi_value(2, position); |
4176 <xsl:text> this.apply_hmi_value(2, position); |
3850 </xsl:text> |
4177 </xsl:text> |
|
4178 <xsl:text> this.apply_hmi_value(3, this.visible); |
|
4179 </xsl:text> |
3851 <xsl:text> console.log(range,position,jdata); |
4180 <xsl:text> console.log(range,position,jdata); |
3852 </xsl:text> |
4181 </xsl:text> |
3853 <xsl:apply-templates mode="json_table_render_except_comments" select="$data_elt"> |
4182 <xsl:apply-templates mode="json_table_render_except_comments" select="$data_elt"> |
3854 <xsl:with-param name="expressions" select="$initexpr_ns"/> |
4183 <xsl:with-param name="expressions" select="$initexpr_ns"/> |
3855 <xsl:with-param name="widget_elts" select="$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*"/> |
4184 <xsl:with-param name="widget_elts" select="$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*"/> |
4772 </xsl:text> |
5105 </xsl:text> |
4773 <xsl:text> last_drag = false; |
5106 <xsl:text> last_drag = false; |
4774 </xsl:text> |
5107 </xsl:text> |
4775 <xsl:text> |
5108 <xsl:text> |
4776 </xsl:text> |
5109 </xsl:text> |
4777 <xsl:text> dispatch(value) { |
5110 <xsl:text> dispatch(value,oldval, index) { |
4778 </xsl:text> |
5111 </xsl:text> |
4779 <xsl:text> //save current value inside widget |
5112 <xsl:text> if (index == 0){ |
4780 </xsl:text> |
5113 </xsl:text> |
4781 <xsl:text> this.curr_value = value; |
5114 <xsl:text> let [min,max,start,totallength] = this.range; |
4782 </xsl:text> |
5115 </xsl:text> |
4783 <xsl:text> |
5116 <xsl:text> //save current value inside widget |
4784 </xsl:text> |
5117 </xsl:text> |
4785 <xsl:text> if(this.value_elt) |
5118 <xsl:text> this.curr_value = value; |
4786 </xsl:text> |
5119 </xsl:text> |
4787 <xsl:text> this.value_elt.textContent = String(value); |
5120 <xsl:text> |
|
5121 </xsl:text> |
|
5122 <xsl:text> //check if in range |
|
5123 </xsl:text> |
|
5124 <xsl:text> if (this.curr_value > max){ |
|
5125 </xsl:text> |
|
5126 <xsl:text> this.curr_value = max; |
|
5127 </xsl:text> |
|
5128 <xsl:text> this.apply_hmi_value(0, this.curr_value); |
|
5129 </xsl:text> |
|
5130 <xsl:text> } |
|
5131 </xsl:text> |
|
5132 <xsl:text> else if (this.curr_value < min){ |
|
5133 </xsl:text> |
|
5134 <xsl:text> this.curr_value = min; |
|
5135 </xsl:text> |
|
5136 <xsl:text> this.apply_hmi_value(0, this.curr_value); |
|
5137 </xsl:text> |
|
5138 <xsl:text> } |
|
5139 </xsl:text> |
|
5140 <xsl:text> |
|
5141 </xsl:text> |
|
5142 <xsl:text> if(this.value_elt) |
|
5143 </xsl:text> |
|
5144 <xsl:text> this.value_elt.textContent = String(value); |
|
5145 </xsl:text> |
|
5146 <xsl:text> } |
|
5147 </xsl:text> |
|
5148 <xsl:text> else if(index == 1){ |
|
5149 </xsl:text> |
|
5150 <xsl:text> this.scroll_range = value; |
|
5151 </xsl:text> |
|
5152 <xsl:text> this.set_scroll(); |
|
5153 </xsl:text> |
|
5154 <xsl:text> } |
|
5155 </xsl:text> |
|
5156 <xsl:text> else if(index == 2){ |
|
5157 </xsl:text> |
|
5158 <xsl:text> this.scroll_visible = value; |
|
5159 </xsl:text> |
|
5160 <xsl:text> this.set_scroll(); |
|
5161 </xsl:text> |
|
5162 <xsl:text> } |
4788 </xsl:text> |
5163 </xsl:text> |
4789 <xsl:text> |
5164 <xsl:text> |
4790 </xsl:text> |
5165 </xsl:text> |
4791 <xsl:text> //don't update if draging and setpoint ghost doesn't exist |
5166 <xsl:text> //don't update if draging and setpoint ghost doesn't exist |
4792 </xsl:text> |
5167 </xsl:text> |
4793 <xsl:text> if(!this.drag || (this.setpoint_elt != undefined)){ |
5168 <xsl:text> if(!this.drag || (this.setpoint_elt != undefined)){ |
4794 </xsl:text> |
5169 </xsl:text> |
4795 <xsl:text> this.update_DOM(value, this.handle_elt); |
5170 <xsl:text> this.update_DOM(this.curr_value, this.handle_elt); |
4796 </xsl:text> |
5171 </xsl:text> |
4797 <xsl:text> } |
5172 <xsl:text> } |
4798 </xsl:text> |
5173 </xsl:text> |
4799 <xsl:text> } |
5174 <xsl:text> } |
4800 </xsl:text> |
5175 </xsl:text> |
4801 <xsl:text> |
5176 <xsl:text> |
4802 </xsl:text> |
5177 </xsl:text> |
|
5178 <xsl:text> set_scroll(){ |
|
5179 </xsl:text> |
|
5180 <xsl:text> //check if range is bigger than visible and set scroll size |
|
5181 </xsl:text> |
|
5182 <xsl:text> if(this.scroll_range > this.scroll_visible){ |
|
5183 </xsl:text> |
|
5184 <xsl:text> this.scroll_size = this.scroll_range - this.scroll_visible; |
|
5185 </xsl:text> |
|
5186 <xsl:text> this.range[0] = 0; |
|
5187 </xsl:text> |
|
5188 <xsl:text> this.range[1] = this.scroll_size; |
|
5189 </xsl:text> |
|
5190 <xsl:text> } |
|
5191 </xsl:text> |
|
5192 <xsl:text> else{ |
|
5193 </xsl:text> |
|
5194 <xsl:text> this.scroll_size = 1; |
|
5195 </xsl:text> |
|
5196 <xsl:text> this.range[0] = 0; |
|
5197 </xsl:text> |
|
5198 <xsl:text> this.range[1] = 1; |
|
5199 </xsl:text> |
|
5200 <xsl:text> } |
|
5201 </xsl:text> |
|
5202 <xsl:text> } |
|
5203 </xsl:text> |
|
5204 <xsl:text> |
|
5205 </xsl:text> |
4803 <xsl:text> update_DOM(value, elt){ |
5206 <xsl:text> update_DOM(value, elt){ |
4804 </xsl:text> |
5207 </xsl:text> |
4805 <xsl:text> let [min,max,start,totallength] = this.range; |
5208 <xsl:text> let [min,max,start,totallength] = this.range; |
4806 </xsl:text> |
5209 </xsl:text> |
4807 <xsl:text> // check if handle is resizeable |
5210 <xsl:text> // check if handle is resizeable |
4944 </xsl:text> |
5347 </xsl:text> |
4945 <xsl:text> window.removeEventListener("mousemove", this.on_bound_drag, true); |
5348 <xsl:text> window.removeEventListener("mousemove", this.on_bound_drag, true); |
4946 </xsl:text> |
5349 </xsl:text> |
4947 <xsl:text> |
5350 <xsl:text> |
4948 </xsl:text> |
5351 </xsl:text> |
4949 <xsl:text> window.removeEventListener("mouseup", this.bound_on_release, true) |
5352 <xsl:text> window.removeEventListener("mouseup", this.bound_on_release, true); |
4950 </xsl:text> |
5353 </xsl:text> |
4951 <xsl:text> window.removeEventListener("touchend", this.bound_on_release, true); |
5354 <xsl:text> window.removeEventListener("touchend", this.bound_on_release, true); |
4952 </xsl:text> |
5355 </xsl:text> |
4953 <xsl:text> window.removeEventListener("touchcancel", this.bound_on_release, true); |
5356 <xsl:text> window.removeEventListener("touchcancel", this.bound_on_release, true); |
4954 </xsl:text> |
5357 </xsl:text> |
5206 </xsl:text> |
5607 </xsl:text> |
5207 <xsl:text> window.addEventListener("mousemove", this.on_bound_drag, true); |
5608 <xsl:text> window.addEventListener("mousemove", this.on_bound_drag, true); |
5208 </xsl:text> |
5609 </xsl:text> |
5209 <xsl:text> |
5610 <xsl:text> |
5210 </xsl:text> |
5611 </xsl:text> |
5211 <xsl:text> window.addEventListener("mouseup", this.bound_on_release, true) |
5612 <xsl:text> window.addEventListener("mouseup", this.bound_on_release, true); |
5212 </xsl:text> |
5613 </xsl:text> |
5213 <xsl:text> window.addEventListener("touchend", this.bound_on_release, true); |
5614 <xsl:text> window.addEventListener("touchend", this.bound_on_release, true); |
5214 </xsl:text> |
5615 </xsl:text> |
5215 <xsl:text> window.addEventListener("touchcancel", this.bound_on_release, true); |
5616 <xsl:text> window.addEventListener("touchcancel", this.bound_on_release, true); |
5216 </xsl:text> |
5617 </xsl:text> |
5316 </xsl:text> |
5723 </xsl:text> |
5317 <xsl:text> this.element.addEventListener("mousedown", this.bound_on_select); |
5724 <xsl:text> this.element.addEventListener("mousedown", this.bound_on_select); |
5318 </xsl:text> |
5725 </xsl:text> |
5319 <xsl:text> this.element.addEventListener("touchstart", this.bound_on_select); |
5726 <xsl:text> this.element.addEventListener("touchstart", this.bound_on_select); |
5320 </xsl:text> |
5727 </xsl:text> |
5321 <xsl:text> |
5728 <xsl:text> //touch recognised as page drag without next command |
|
5729 </xsl:text> |
|
5730 <xsl:text> document.body.addEventListener("touchstart", function(e){}, false); |
|
5731 </xsl:text> |
|
5732 <xsl:text> |
|
5733 </xsl:text> |
|
5734 <xsl:text> //save ghost style |
5322 </xsl:text> |
5735 </xsl:text> |
5323 <xsl:text> if(this.setpoint_elt != undefined){ |
5736 <xsl:text> if(this.setpoint_elt != undefined){ |
5324 </xsl:text> |
5737 </xsl:text> |
5325 <xsl:text> this.setpoint_style = this.setpoint_elt.getAttribute("style"); |
5738 <xsl:text> this.setpoint_style = this.setpoint_elt.getAttribute("style"); |
5326 </xsl:text> |
5739 </xsl:text> |
5423 </xsl:text> |
5836 </xsl:text> |
5424 <xsl:text> |
5837 <xsl:text> |
5425 </xsl:text> |
5838 </xsl:text> |
5426 <xsl:text> dispatch(value) { |
5839 <xsl:text> dispatch(value) { |
5427 </xsl:text> |
5840 </xsl:text> |
5428 <xsl:text> if(this.state != value){ |
5841 <xsl:text> this.state = value; |
5429 </xsl:text> |
5842 </xsl:text> |
5430 <xsl:text> this.state = value; |
5843 <xsl:text> //redraw toggle button |
5431 </xsl:text> |
5844 </xsl:text> |
5432 <xsl:text> if (this.state) { |
5845 <xsl:text> this.request_animate(); |
5433 </xsl:text> |
5846 </xsl:text> |
5434 <xsl:text> this.active_elt.setAttribute("style", this.active_style); |
5847 <xsl:text> } |
5435 </xsl:text> |
5848 </xsl:text> |
5436 <xsl:text> this.inactive_elt.setAttribute("style", "display:none"); |
5849 <xsl:text> |
5437 </xsl:text> |
5850 </xsl:text> |
5438 <xsl:text> } else { |
5851 <xsl:text> on_click(evt) { |
5439 </xsl:text> |
5852 </xsl:text> |
5440 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
5853 <xsl:text> //toggle state and apply |
5441 </xsl:text> |
5854 </xsl:text> |
5442 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
5855 <xsl:text> if (this.state) { |
5443 </xsl:text> |
5856 </xsl:text> |
5444 <xsl:text> } |
5857 <xsl:text> this.state = 0; |
|
5858 </xsl:text> |
|
5859 <xsl:text> } else { |
|
5860 </xsl:text> |
|
5861 <xsl:text> this.state = 1; |
5445 </xsl:text> |
5862 </xsl:text> |
5446 <xsl:text> } |
5863 <xsl:text> } |
5447 </xsl:text> |
5864 </xsl:text> |
5448 <xsl:text> } |
5865 <xsl:text> this.apply_hmi_value(0, this.state); |
5449 </xsl:text> |
5866 </xsl:text> |
5450 <xsl:text> |
5867 <xsl:text> |
5451 </xsl:text> |
5868 </xsl:text> |
5452 <xsl:text> on_click(evt) { |
5869 <xsl:text> //redraw toggle button |
5453 </xsl:text> |
5870 </xsl:text> |
5454 <xsl:text> if (this.state) { |
5871 <xsl:text> this.request_animate(); |
|
5872 </xsl:text> |
|
5873 <xsl:text> } |
|
5874 </xsl:text> |
|
5875 <xsl:text> |
|
5876 </xsl:text> |
|
5877 <xsl:text> animate(){ |
|
5878 </xsl:text> |
|
5879 <xsl:text> // redraw toggle button on screen refresh |
|
5880 </xsl:text> |
|
5881 <xsl:text> if (this.state) { |
|
5882 </xsl:text> |
|
5883 <xsl:text> this.active_elt.setAttribute("style", this.active_style); |
|
5884 </xsl:text> |
|
5885 <xsl:text> this.inactive_elt.setAttribute("style", "display:none"); |
|
5886 </xsl:text> |
|
5887 <xsl:text> } else { |
|
5888 </xsl:text> |
|
5889 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
|
5890 </xsl:text> |
|
5891 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
|
5892 </xsl:text> |
|
5893 <xsl:text> } |
|
5894 </xsl:text> |
|
5895 <xsl:text> } |
|
5896 </xsl:text> |
|
5897 <xsl:text> |
|
5898 </xsl:text> |
|
5899 <xsl:text> init() { |
|
5900 </xsl:text> |
|
5901 <xsl:text> this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined; |
|
5902 </xsl:text> |
|
5903 <xsl:text> this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined; |
|
5904 </xsl:text> |
|
5905 <xsl:text> |
|
5906 </xsl:text> |
|
5907 <xsl:text> if (this.active_style && this.inactive_style) { |
|
5908 </xsl:text> |
|
5909 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
5455 </xsl:text> |
5910 </xsl:text> |
5456 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
5911 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
5457 </xsl:text> |
5912 </xsl:text> |
5458 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
|
5459 </xsl:text> |
|
5460 <xsl:text> this.state = 0; |
|
5461 </xsl:text> |
|
5462 <xsl:text> } else { |
|
5463 </xsl:text> |
|
5464 <xsl:text> this.active_elt.setAttribute("style", this.active_style); |
|
5465 </xsl:text> |
|
5466 <xsl:text> this.inactive_elt.setAttribute("style", "display:none"); |
|
5467 </xsl:text> |
|
5468 <xsl:text> this.state = 1; |
|
5469 </xsl:text> |
|
5470 <xsl:text> } |
5913 <xsl:text> } |
5471 </xsl:text> |
5914 </xsl:text> |
5472 <xsl:text> this.apply_hmi_value(0, this.state); |
5915 <xsl:text> |
5473 </xsl:text> |
|
5474 <xsl:text> } |
|
5475 </xsl:text> |
|
5476 <xsl:text> |
|
5477 </xsl:text> |
|
5478 <xsl:text> init() { |
|
5479 </xsl:text> |
|
5480 <xsl:text> this.active_style = this.active_elt.style.cssText; |
|
5481 </xsl:text> |
|
5482 <xsl:text> this.inactive_style = this.inactive_elt.style.cssText; |
|
5483 </xsl:text> |
5916 </xsl:text> |
5484 <xsl:text> this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)"); |
5917 <xsl:text> this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)"); |
5485 </xsl:text> |
|
5486 <xsl:text> this.inactive_elt.setAttribute("style", this.inactive_style); |
|
5487 </xsl:text> |
|
5488 <xsl:text> this.active_elt.setAttribute("style", "display:none"); |
|
5489 </xsl:text> |
5918 </xsl:text> |
5490 <xsl:text> } |
5919 <xsl:text> } |
5491 </xsl:text> |
5920 </xsl:text> |
5492 <xsl:text>} |
5921 <xsl:text>} |
5493 </xsl:text> |
5922 </xsl:text> |