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

    14

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

    15

const "_button_fsm" fsm {

    16

    state "init" {

    17

        on_dispatch "false" jump "released";

    18

        on_dispatch "true" jump "pressed";

    19

    }

    20

    21

    state "pressing" {

    22

        // show "waitactive";

    23

        hmi_value "true";

    24

        on_dispatch "true" jump "pressed";

    25

        on_mouse "up" jump "shortpress";

    26

    }

    27

    state "pressed" {

    28

        show "active";

    29

        on_mouse "up" jump "releasing";

    30

        on_dispatch "false" jump "released";

    31

    }

    32

    state "shortpress" {

    33

        on_dispatch "true" jump "releasing";

    34

        on_mouse "down" jump "pressing";

    35

    }

    36

    37

    state "releasing" {

    38

        // show "waitinactive";

    39

        hmi_value "false";

    40

        on_dispatch "false" jump "released";

    41

        on_mouse "down" jump "shortrelease";

    42

    }

    43

    state "released" {

    44

        show "inactive";

    45

        on_mouse "down" jump "pressing";

    46

        on_dispatch "true" jump "pressed";

    47

    }

    48

    state "shortrelease" {

    49

        on_dispatch "false" jump "pressing";

    50

        on_mouse "up" jump "releasing";

    51

    }

    52

}

    53

    54

template "fsm", mode="dispatch_transition" {

    55

    |         switch (this.state) {

    56

    apply "state", mode="dispatch_transition";

    57

    |         }

    58

}

    59

template "state", mode="dispatch_transition" {

    60

    |           case "«@name»":

    61

       apply "on-dispatch";

    62

    |             break;

    63

}

    64

template "on-dispatch" {

    65

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

    66

    apply "jump", mode="transition";

    67

    |             }

    68

}

    69

    70

template "fsm", mode="mouse_transition" {

    71

    param "position";

    72

    |         switch (this.state) {

    73

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

    74

    |         }

    75

}

    76

template "state", mode="mouse_transition" {

    77

    param "position";

    78

    |           case "«@name»":

    79

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

    80

    |             break;

    81

}

    82

template "on-mouse" {

    83

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

    84

    apply "jump", mode="transition";

    85

}

    86

    87

template "jump", mode="transition" {

    88

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

    89

    |             this.«@state»_action();

    90

}

    91

    92

template "fsm", mode="actions" {

    93

    apply "state", mode="actions";

    94

}

    95

template "state", mode="actions" {

    96

    |     «@name»_action(){

    97

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

    98

    apply "*", mode="actions";

    99

    |     }

   100

}

   101

template "show", mode="actions" {

   102

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

   103

    |         this.request_animate();

   104

}

   105

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

   106

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

   107

}

   108

   112

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

   113

    |     frequency = 5;

   114

   115

    |     display = "inactive";

   116

    |     state = "init";

   117

   118

    |     dispatch(value) {

   119

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

   120

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

   121

    |     }

   122

   123

    |     onmouseup(evt) {

   124

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

   125

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

   126

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

   127

    |     }

   128

    |     onmousedown(evt) {

   129

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

   130

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

   131

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

   132

    |     }

   133

   134

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

   135

   136

    |     animate(){

   137

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

   138

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

   139

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

   140

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

   141

    |             else

   142

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

   143

    }

   144

    |         }

   145

    |     }

   146

   147

    |     init() {

   148

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

   149

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

   150

    |     }

   151

}

   152

   154

    param "hmi_element";

   155

    optional_labels("active inactive");

   156

}