diff -r 1ae4a871b6f9 -r 6b1b23971960 svghmi/gen_index_xhtml.xslt
--- a/svghmi/gen_index_xhtml.xslt Wed Dec 02 14:33:24 2020 +0100
+++ b/svghmi/gen_index_xhtml.xslt Sat Dec 05 16:59:27 2020 +0100
@@ -1675,134 +1675,219 @@
}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ switch (this.state) {
+
+
+ }
+
+
+
+ case "
+
+ ":
+
+
+ break;
+
+
+
+ if(value ==
+
+ ) {
+
+
+ }
+
+
+
+
+ switch (this.state) {
+
+
+
+
+ }
+
+
+
+
+ case "
+
+ ":
+
+
+ break;
+
+
+
+
+
+
+ this.state = "
+
+ ";
+
+ this.
+
+ _action();
+
+
+
+
+
+
+
+
+ _action(){
+
+
+ }
+
+
+
+ this.display = "
+
+ ";
+
+ this.request_animate();
+
+
+
+ this.apply_hmi_value(0,
+
+ );
+
+
+
class ButtonWidget extends Widget{
frequency = 5;
- state_plc = 0;
-
- state_hmi = 0;
-
- plc_lock = false;
-
- active_style = undefined;
-
- inactive_style = undefined;
-
-
+ display = "inactive";
+
+ state = "init";
dispatch(value) {
- this.state_plc = value;
-
- if(this.plc_lock){
-
- if(this.state_plc == 1){
-
- this.apply_hmi_value(0, 0);
-
- this.plc_lock = false;
-
- }
-
- }
-
-
-
- //redraw button
-
- this.state_hmi = this.state_plc;
-
- this.request_animate();
-
- }
-
-
-
+
+ }
+
+ onmouseup(evt) {
+
+ svg_root.removeEventListener("pointerup", this.bound_onmouseup, true);
+
+
+
+
+ }
+
+ onmousedown(evt) {
+
+ svg_root.addEventListener("pointerup", this.bound_onmouseup, true);
+
+
+
+
+ }
+
+
animate(){
- if (this.active_style && this.inactive_style) {
-
- // redraw button on screen refresh
-
- if (this.state_hmi) {
-
- this.active_elt.setAttribute("style", this.active_style);
-
- this.inactive_elt.setAttribute("style", "display:none");
-
- } else {
-
- this.inactive_elt.setAttribute("style", this.inactive_style);
-
- this.active_elt.setAttribute("style", "display:none");
-
- }
-
- }
-
- }
-
-
-
- on_click(evt) {
-
- //set state and apply if plc is 0
-
- this.plc_lock = true;
-
- if(this.state_plc == 0){
-
- this.apply_hmi_value(0, 1);
-
- }
-
- //redraw button
-
- this.request_animate();
-
- }
-
-
-
- on_press(evt) {
-
- //set graphic
-
- this.state_hmi = 1;
-
- //redraw button
-
- this.request_animate();
-
- }
-
-
-
- init() {
-
- this.active_style = this.active_elt ? this.active_elt.style.cssText : undefined;
-
- this.inactive_style = this.inactive_elt ? this.inactive_elt.style.cssText : undefined;
-
-
-
- if (this.active_style && this.inactive_style) {
-
- this.active_elt.setAttribute("style", "display:none");
-
- this.inactive_elt.setAttribute("style", this.inactive_style);
-
- }
-
-
-
- this.element.setAttribute("onclick", "hmi_widgets['"+this.element_id+"'].on_click(evt)");
-
- this.element.setAttribute("onmousedown", "hmi_widgets['"+this.element_id+"'].on_press(evt)");
-
- }
+ if (this.active_elt && this.inactive_elt) {
+
+
+ if(this.display == "
+
+ ")
+
+ this.
+
+ _elt.style.display = "";
+
+ else
+
+ this.
+
+ _elt.style.display = "none";
+
+
+ }
+
+ }
+
+ init() {
+
+ this.bound_onmouseup = this.onmouseup.bind(this);
+
+ this.element.addEventListener("pointerdown", this.onmousedown.bind(this));
+
+ }
}
@@ -6645,12 +6730,16 @@
function prepare_svg() {
+ // prevents context menu from appearing on right click and long touch
+
document.body.addEventListener('contextmenu', e => {
e.preventDefault();
});
+
+
for(let eltid in detachable_elements){
let [element,parent] = detachable_elements[eltid];