svghmi/widget_keypad.ysl2
author Edouard Tisserant <edouard.tisserant@gmail.com>
Sun, 02 May 2021 23:01:08 +0200
branchsvghmi
changeset 3232 7bdb766c2a4d
parent 3125 1fb0c07bd97b
child 3241 fe945f1f48b7
permissions -rw-r--r--
SVGHMI: In order to allow widget signature and description to coexist in same ysl2 file, introduced widget_class, widget_defs to declare widget codegen templates and gen_index_xhtml to mark templates that are only usefull in gen_index_xhtml.xslt.
2908
01352aca1cae SVGHMI: empty widget_keypad.ysl2, WIP
Edouard Tisserant
parents:
diff changeset
     1
// widget_keypad.ysl2
01352aca1cae SVGHMI: empty widget_keypad.ysl2, WIP
Edouard Tisserant
parents:
diff changeset
     2
2943
304e88bae115 SVGHMI: added more meaningful namespaces to emit javascript code from.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2941
diff changeset
     3
emit "declarations:keypad" {
2941
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     4
    |
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     5
    | var keypads = {
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     6
    foreach "$keypads_descs"{
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     7
        const "keypad_id","@id";
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     8
        foreach "arg"{
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
     9
            const "g", "$geometry[@Id = $keypad_id]";
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    10
    |     "«@value»":["«$keypad_id»", «$g/@x», «$g/@y»],
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    11
        }
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    12
    }
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    13
    | }
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    14
}
ef13a4007538 SVGHMI: spread JS code from svghmi/scripts.ysl2 in other .ysl2 files, using dedicated preamble and epilogue namespaces
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2920
diff changeset
    15
3232
7bdb766c2a4d SVGHMI: In order to allow widget signature and description to coexist in same ysl2 file, introduced widget_class, widget_defs to declare widget codegen templates and gen_index_xhtml to mark templates that are only usefull in gen_index_xhtml.xslt.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3125
diff changeset
    16
widget_class("Keypad")
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    17
    ||
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    18
         on_key_click(symbols) {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    19
             var syms = symbols.split(" ");
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    20
             this.shift |= this.caps;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    21
             this.editstr += syms[this.shift?syms.length-1:0];
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    22
             this.shift = false;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    23
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    24
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    25
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    26
         on_Esc_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    27
             end_modal.call(this);
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    28
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    29
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    30
         on_Enter_click() {
3033
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    31
             let coercedval = (typeof this.initial) == "number" ? Number(this.editstr) : this.editstr;
3042
ed43facc7137 SVGHMI: Fix keypad : non-number input was always considered invalid because of missing type checking.
Edouard Tisserant
parents: 3033
diff changeset
    32
             if(typeof coercedval == 'number' && isNaN(coercedval)){
ed43facc7137 SVGHMI: Fix keypad : non-number input was always considered invalid because of missing type checking.
Edouard Tisserant
parents: 3033
diff changeset
    33
                 // revert to initial so it explicitely shows input was ignored
3033
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    34
                 this.editstr = String(this.initial);
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    35
                 this.update();
3042
ed43facc7137 SVGHMI: Fix keypad : non-number input was always considered invalid because of missing type checking.
Edouard Tisserant
parents: 3033
diff changeset
    36
             } else { 
3033
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    37
                 let callback_obj = this.result_callback_obj;
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    38
                 end_modal.call(this);
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    39
                 callback_obj.edit_callback(coercedval);
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    40
             }
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    41
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    42
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    43
         on_BackSpace_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    44
             this.editstr = this.editstr.slice(0,this.editstr.length-1);
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    45
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    46
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    47
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    48
         on_Sign_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    49
             if(this.editstr[0] == "-")
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    50
                 this.editstr = this.editstr.slice(1,this.editstr.length);
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    51
             else
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    52
                 this.editstr = "-" + this.editstr;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    53
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    54
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    55
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    56
         on_NumDot_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    57
             if(this.editstr.indexOf(".") == "-1"){
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    58
                 this.editstr += ".";
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    59
                 this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    60
             }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    61
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    62
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    63
         on_Space_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    64
             this.editstr += " ";
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    65
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    66
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    67
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    68
         caps = false;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    69
         _caps = undefined;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    70
         on_CapsLock_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    71
             this.caps = !this.caps;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    72
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    73
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    74
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    75
         shift = false;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    76
         _shift = undefined;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    77
         on_Shift_click() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    78
             this.shift = !this.shift;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    79
             this.caps = false;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    80
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    81
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    82
         editstr = "";
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    83
         _editstr = undefined;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    84
         result_callback_obj = undefined;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    85
         start_edit(info, valuetype, callback_obj, initial,size) {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    86
             show_modal.call(this,size);
3033
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    87
             this.editstr = String(initial);
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    88
             this.result_callback_obj = callback_obj;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    89
             this.Info_elt.textContent = info;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    90
             this.shift = false;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    91
             this.caps = false;
3033
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    92
             this.initial = initial;
52f6548982d4 SVGHMI: Keypad is now keeping Javascript type constency. In other words, if a number was given as initial value, input value will have to convert to number in order to be valid. In case invalid value is entered, initial value is restored.
Edouard Tisserant
parents: 3010
diff changeset
    93
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    94
             this.update();
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    95
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    96
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    97
         update() {
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    98
             if(this.editstr != this._editstr){
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
    99
                 this._editstr = this.editstr;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   100
                 this.Value_elt.textContent = this.editstr;
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   101
             }
3102
abb487b56911 SVGHMI: Fix bug in keypad leading to error messages in browser console when keypas has no Shift or CapsLock keys
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3047
diff changeset
   102
             if(this.Shift_sub && this.shift != this._shift){
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   103
                 this._shift = this.shift;
3125
1fb0c07bd97b SVGHMI: widget activable elements : moved code to wher it belongs, rewrote cleaner
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3118
diff changeset
   104
                 (this.shift?this.activate_activable:this.inactivate_activable)(this.Shift_sub);
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   105
             }
3102
abb487b56911 SVGHMI: Fix bug in keypad leading to error messages in browser console when keypas has no Shift or CapsLock keys
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3047
diff changeset
   106
             if(this.CapsLock_sub && this.caps != this._caps){
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   107
                 this._caps = this.caps;
3125
1fb0c07bd97b SVGHMI: widget activable elements : moved code to wher it belongs, rewrote cleaner
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3118
diff changeset
   108
                 (this.caps?this.activate_activable:this.inactivate_activable)(this.CapsLock_sub);
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   109
             }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   110
         }
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   111
    ||
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   112
3232
7bdb766c2a4d SVGHMI: In order to allow widget signature and description to coexist in same ysl2 file, introduced widget_class, widget_defs to declare widget codegen templates and gen_index_xhtml to mark templates that are only usefull in gen_index_xhtml.xslt.
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 3125
diff changeset
   113
widget_defs("Keypad") {
2917
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   114
    param "hmi_element";
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   115
    labels("Esc Enter BackSpace Keys Info Value");
3118
e704b0487515 SVGHMI : removed support for changing keyboard position and showing at user defined location. Feature was problematic in many respect.
Edouard Tisserant
parents: 3102
diff changeset
   116
    optional_labels("Sign Space NumDot");
2920
3ee337c8c769 SVGHMI: finished shift and capslock support n keypad widget. Added a helper in widgets_common to collect subelements likle active/inactive/disabled...
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2919
diff changeset
   117
    activable_labels("CapsLock Shift");
2911
211d6a185e31 SVGHMI: More infrastructure for editing values with a keypad.
Edouard Tisserant
parents: 2908
diff changeset
   118
    |     init: function() {
2917
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   119
    foreach "$hmi_element/*[@inkscape:label = 'Keys']/*" {
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   120
    |         id("«@id»").setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_key_click('«func:escape_quotes(@inkscape:label)»')");
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   121
    }
2920
3ee337c8c769 SVGHMI: finished shift and capslock support n keypad widget. Added a helper in widgets_common to collect subelements likle active/inactive/disabled...
Edouard Tisserant <edouard.tisserant@gmail.com>
parents: 2919
diff changeset
   122
    foreach "str:split('Esc Enter BackSpace Sign Space NumDot CapsLock Shift')" {
2917
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   123
    |         if(this.«.»_elt)
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   124
    |             this.«.»_elt.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_«.»_click()");
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   125
    }
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   126
    |     },
3010
893cc309f5e2 Changed keyboard to show on defined position.
usveticic
parents: 2943
diff changeset
   127
    |
2917
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   128
    const "g", "$geometry[@Id = $hmi_element/@id]"; 
c8d923dd707f SVGHMI: Keypad working for HMI_STRING, still Shift/CapsLock not finished.
Edouard Tisserant
parents: 2911
diff changeset
   129
    |     coordinates: [«$g/@x», «$g/@y»],
2908
01352aca1cae SVGHMI: empty widget_keypad.ysl2, WIP
Edouard Tisserant
parents:
diff changeset
   130
}