1

// widget_button.ysl2

     2

     3

// Finite state machine

     4

decl fsm(name);

     5

decl state(name);

     6

decl on_mouse(position);

     7

decl on_dispatch(value);

     8

decl jump(state);

     9

decl show(eltname);

    10

decl hmi_value(value);

    11

    12

// State machine to drive HMI_BOOL on a potentially laggy connection

    13

const "_button_fsm" fsm {

    14

    state "init" {

    15

        on_dispatch "false" jump "released";

    16

        on_dispatch "true" jump "pressed";

    17

    }

    18

    19

    state "pressing" {

    20

        // show "waitactive";

    21

        hmi_value "true";

    22

        on_dispatch "true" jump "pressed";

    23

        on_mouse "up" jump "shortpress";

    24

    }

    25

    state "pressed" {

    26

        show "active";

    27

        on_mouse "up" jump "releasing";

    28

        on_dispatch "false" jump "released";

    29

    }

    30

    state "shortpress" {

    31

        on_dispatch "true" jump "releasing";

    32

        on_mouse "down" jump "pressing";

    33

    }

    34

    35

    state "releasing" {

    36

        // show "waitinactive";

    37

        hmi_value "false";

    38

        on_dispatch "false" jump "released";

    39

        on_mouse "down" jump "shortrelease";

    40

    }

    41

    state "released" {

    42

        show "inactive";

    43

        on_mouse "down" jump "pressing";

    44

        on_dispatch "true" jump "pressed";

    45

    }

    46

    state "shortrelease" {

    47

        on_dispatch "false" jump "pressing";

    48

        on_mouse "up" jump "releasing";

    49

    }

    50

}

    51

    52

template "fsm", mode="dispatch_transition" {

    53

    |         switch (this.state) {

    54

    apply "state", mode="dispatch_transition";

    55

    |         }

    56

}

    57

template "state", mode="dispatch_transition" {

    58

    |           case "«@name»":

    59

       apply "on-dispatch";

    60

    |             break;

    61

}

    62

template "on-dispatch" {

    63

    |             if(value ==  «@value») {

    64

    apply "jump", mode="transition";

    65

    |             }

    66

}

    67

    68

template "fsm", mode="mouse_transition" {

    69

    param "position";

    70

    |         switch (this.state) {

    71

    apply "state", mode="mouse_transition" with "position", "$position";

    72

    |         }

    73

}

    74

template "state", mode="mouse_transition" {

    75

    param "position";

    76

    |           case "«@name»":

    77

    apply "on-mouse[@position = $position]";

    78

    |             break;

    79

}

    80

template "on-mouse" {

    81

    // up or down state is already assumed because apply statement filters it

    82

    apply "jump", mode="transition";

    83

}

    84

    85

template "jump", mode="transition" {

    86

    |             this.state = "«@state»";

    87

    |             this.«@state»_action();

    88

}

    89

    90

template "fsm", mode="actions" {

    91

    apply "state", mode="actions";

    92

}

    93

template "state", mode="actions" {

    94

    |     «@name»_action(){

    95

    //| console.log("Entering state «@name»");

    96

    apply "*", mode="actions";

    97

    |     }

    98

}

    99

template "show", mode="actions" {

   100

    |         this.display = "«@eltname»";

   101

    |         this.request_animate();

   102

}

   103

template "hmi-value", mode="actions" {

   104

    |         this.apply_hmi_value(0, «@value»);

   105

}

   106

   107

template "widget[@type='Button']", mode="widget_class"{

   108

    const "fsm","exsl:node-set($_button_fsm)";

   109

    | class ButtonWidget extends Widget{

   110

    |     frequency = 5;

   111

   112

    |     display = "inactive";

   113

    |     state = "init";

   114

   115

    |     dispatch(value) {

   116

    // |         console.log("dispatch"+value);

   117

    apply "$fsm", mode="dispatch_transition";

   118

    |     }

   119

   120

    |     onmouseup(evt) {

   121

    |         svg_root.removeEventListener("pointerup", this.bound_onmouseup, true);

   122

    // |         console.log("onmouseup");

   123

    apply "$fsm", mode="mouse_transition" with "position", "'up'";

   124

    |     }

   125

    |     onmousedown(evt) {

   126

    |         svg_root.addEventListener("pointerup", this.bound_onmouseup, true);

   127

    // |         console.log("onmousedown");

   128

    apply "$fsm", mode="mouse_transition" with "position", "'down'";

   129

    |     }

   130

   131

    apply "$fsm", mode="actions";

   132

   133

    |     animate(){

   134

    |         if (this.active_elt && this.inactive_elt) {

   135

    foreach "str:split('active inactive')" {

   136

    |             if(this.display == "«.»")

   137

    |                 this.«.»_elt.style.display = "";

   138

    |             else

   139

    |                 this.«.»_elt.style.display = "none";

   140

    }

   141

    |         }

   142

    |     }

   143

   144

    |     init() {

   145

    |         this.bound_onmouseup = this.onmouseup.bind(this);

   146

    |         this.element.addEventListener("pointerdown", this.onmousedown.bind(this));

   147

    |     }

   148

    | }

   149

}

   150

   151

   152

template "widget[@type='Button']", mode="widget_defs" {

   153

    param "hmi_element";

   154

    optional_labels("active inactive");

   155

}