1

// widget_jsontable.ysl2

     2

     3

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

     4

    ||

     5

    class JsonTableWidget extends Widget{

     6

        // arbitrary defaults to avoid missing entries in query

     7

        cache = [0,0,0];

     8

        init_common() {

     9

            this.spread_json_data_bound = this.spread_json_data.bind(this);

    10

            this.handle_http_response_bound = this.handle_http_response.bind(this);

    11

            this.fetch_error_bound = this.fetch_error.bind(this);

    12

            this.promised = false;

    13

        }

    14

    15

        handle_http_response(response) {

    16

            if (!response.ok) {

    17

              console.log("HTTP error, status = " + response.status);

    18

            }

    19

            return response.json();

    20

        }

    21

    22

        fetch_error(e){

    23

            console.log("HTTP fetch error, message = " + e.message + "Widget:" + this.element_id);

    24

        }

    25

    26

        do_http_request(...opt) {

    27

            this.abort_controller = new AbortController();

    28

            return Promise.resolve().then(() => {

    29

    30

                const query = {

    31

                    args: this.args,

    32

                    range: this.cache[1],

    33

                    position: this.cache[2],

    34

                    visible: this.visible,

    35

                    extra: this.cache.slice(4),

    36

                    options: opt

    37

                };

    38

    39

                const options = {

    40

                     method: 'POST',

    41

                     body: JSON.stringify(query),

    42

                     headers: {'Content-Type': 'application/json'},

    43

                     signal: this.abort_controller.signal

    44

                };

    45

    46

                return fetch(this.args[0], options)

    47

                        .then(this.handle_http_response_bound)

    48

                        .then(this.spread_json_data_bound)

    49

                        .catch(this.fetch_error_bound);

    50

            });

    51

        }

    52

    53

        unsub(){

    54

            this.abort_controller.abort();

    55

            super.unsub();

    56

        }

    57

    58

        sub(...args){

    59

            this.cache[0] = undefined;

    60

            super.sub(...args);

    61

        }

    62

    63

        dispatch(value, oldval, index) {

    64

    65

            if(this.cache[index] != value)

    66

                this.cache[index] = value;

    67

            else

    68

                return;

    69

    70

            if(!this.promised){

    71

                this.promised = true;

    72

                this.do_http_request().finally(() => {

    73

                    this.promised = false;

    74

                });

    75

            }

    76

        }

    77

        make_on_click(...options){

    78

            let that = this;

    79

            return function(evt){

    80

                that.do_http_request(...options);

    81

            }

    82

        }

    83

        // on_click(evt, ...options) {

    84

        //     this.do_http_request(...options);

    85

        // }

    86

    }

    87

    ||

    88

    89

template "svg:*", mode="json_table_elt_render" {

    90

    error > JsonTable Widget can't contain element of type «local-name()».

    91

}

    92

    93

    94

const "hmi_textstylelists_descs", "$parsed_widgets/widget[@type = 'TextStyleList']";

    95

const "hmi_textstylelists", "$hmi_elements[@id = $hmi_textstylelists_descs/@id]";

    96

    97

const "textstylelist_related" foreach "$hmi_textstylelists" list {

    98

    attrib "listid" value "@id";

    99

    foreach "func:refered_elements(.)" elt {

   100

        attrib "eltid" value "@id";

   101

    }

   102

}

   103

const "textstylelist_related_ns", "exsl:node-set($textstylelist_related)";

   104

   105

def "func:json_expressions" {

   106

    param "expressions";

   107

    param "label";

   108

   109

    // compute javascript expressions to access JSON data

   110

    // desscribed in given svg element's "label"

   111

    // knowing that parent element already has given "expressions".

   112

   113

    choose {

   114

        when "$label" {

   115

            const "suffixes", "str:split($label)";

   116

            const "res" foreach "$suffixes" expression {

   117

                const "suffix",".";

   118

                const "pos","position()";

   119

                // take last available expression (i.e can have more suffixes than expressions)

   120

                const "expr","$expressions[position() <= $pos][last()]/expression";

   121

                choose {

   122

                    when "contains($suffix,'=')" {

   123

                        const "name", "substring-before($suffix,'=')";

   124

                        if "$expr/@name[. != $name]"

   125

                            error > JsonTable : missplaced '=' or inconsistent names in Json data expressions.

   126

                        attrib "name" value "$name";

   127

                        attrib "content" > «$expr/@content»«substring-after($suffix,'=')»

   128

                    }

   129

                    otherwise {

   130

                        copy "$expr/@name";

   131

                        attrib "content" > «$expr/@content»«$suffix»

   132

                    }

   133

                }

   134

            }

   135

            result "exsl:node-set($res)";

   136

        }

   137

        // Empty labels are ignored, expressions are then passed as-is.

   138

        otherwise result "$expressions";

   139

    }

   140

   141

}

   142

   143

const "initexpr" expression attrib "content" > jdata

   144

const "initexpr_ns", "exsl:node-set($initexpr)";

   145

   146

template "svg:use", mode="json_table_elt_render" {

   147

    param "expressions";

   148

    // cloned element must be part of a HMI:List

   149

    const "targetid", "substring-after(@xlink:href,'#')";

   150

    const "from_list", "$hmi_lists[(@id | */@id) = $targetid]";

   151

   152

    choose {

   153

        when "count($from_list) > 0" {

   154

            |         id("«@id»").setAttribute("xlink:href",

   155

            // obtain new target id from HMI:List widget

   156

            |             "#"+hmi_widgets["«$from_list/@id»"].items[«$expressions/expression[1]/@content»]);

   157

        }

   158

        otherwise

   159

            warning > Clones (svg:use) in JsonTable Widget must point to a valid HMI:List widget or item. Reference "«@xlink:href»" is not valid and will not be updated.

   160

    }

   161

}

   162

   163

template "svg:text", mode="json_table_elt_render" {

   164

    param "expressions";

   165

    const "value_expr", "$expressions/expression[1]/@content";

   166

    const "original", "@original";

   167

    const "from_textstylelist", "$textstylelist_related_ns/list[elt/@eltid = $original]";

   168

    choose {

   169

   170

        when "count($from_textstylelist) > 0" {

   171

            const "content_expr", "$expressions/expression[2]/@content";

   172

            if "string-length($content_expr) = 0 or $expressions/expression[2]/@name != 'textContent'"

   173

                error > Clones (svg:use) in JsonTable Widget pointing to a HMI:TextStyleList widget or item must have a "textContent=.someVal" assignement following value expression in label.

   174

            |         {

   175

            |           let elt = id("«@id»");

   176

            |           elt.textContent = String(«$content_expr»);

   177

            |           elt.style = hmi_widgets["«$from_textstylelist/@listid»"].styles[«$value_expr»];

   178

            |         }

   179

        }

   180

        otherwise {

   181

            |         id("«@id»").textContent = String(«$value_expr»);

   182

        }

   183

    }

   184

}

   185

   186

   187

// only labels comming from Json widget are counted in

   188

def "func:filter_non_widget_label" {

   189

    param "elt";

   190

    param "widget_elts";

   191

    const "eltid" choose {

   192

        when "$elt/@original" value "$elt/@original";

   193

        otherwise value "$elt/@id";

   194

    }

   195

    result "$widget_elts[@id=$eltid]/@inkscape:label";

   196

}

   197

   198

template "svg:*", mode="json_table_render_except_comments"{

   199

    param "expressions";

   200

    param "widget_elts";

   201

   202

    const "label", "func:filter_non_widget_label(., $widget_elts)";

   203

    // filter out "# commented" elements

   204

    if "not(starts-with($label,'#'))" 

   205

        apply ".", mode="json_table_render"{

   206

            with "expressions", "$expressions";

   207

            with "widget_elts", "$widget_elts";

   208

            with "label", "$label";

   209

        }

   210

}

   211

   212

   213

template "svg:*", mode="json_table_render" {

   214

    param "expressions";

   215

    param "widget_elts";

   216

    param "label";

   217

   218

    const "new_expressions", "func:json_expressions($expressions, $label)";

   219

   220

    const "elt",".";

   221

    foreach "$new_expressions/expression[position() > 1][starts-with(@name,'onClick')]"

   222

    |         id("«$elt/@id»").onclick = this.make_on_click('«@name»', «@content»);

   223

   224

    apply ".", mode="json_table_elt_render"

   225

        with "expressions", "$new_expressions";

   226

}

   227

   228

template "svg:g", mode="json_table_render" {

   229

    param "expressions";

   230

    param "widget_elts";

   231

    param "label";

   232

   233

    // use intermediate variables for optimization

   234

    const "varprefix" > obj_«@id»_

   235

    |         try {

   236

   237

    foreach "$expressions/expression"{

   238

    |          let «$varprefix»«position()» = «@content»;

   239

    |          if(«$varprefix»«position()» == undefined) {

   240

    |               throw null;

   241

    |          }

   242

    }

   243

   244

    // because we put values in a variables, we can replace corresponding expression with variable name

   245

    const "new_expressions" foreach "$expressions/expression" xsl:copy {

   246

        copy "@name";

   247

        attrib "content" > «$varprefix»«position()»

   248

    }

   249

   250

    // revert hiding in case it did happen before

   251

    |           id("«@id»").style = "«@style»";

   252

   253

    apply "*", mode="json_table_render_except_comments" {

   254

        with "expressions", "func:json_expressions(exsl:node-set($new_expressions), $label)";

   255

        with "widget_elts", "$widget_elts";

   256

    }

   257

    |         } catch(err) {

   258

    |           id("«@id»").style = "display:none";

   259

    |         }

   260

}

   261

   262

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

   263

    param "hmi_element";

   264

    labels("data");

   265

    const "data_elt", "$result_svg_ns//*[@id = $hmi_element/@id]/*[@inkscape:label = 'data']";

   266

    |     visible: «count($data_elt/*[@inkscape:label])»,

   267

    |     spread_json_data: function(janswer) {

   268

    |         let [range,position,jdata] = janswer;

   269

    |         [[1, range], [2, position], [3, this.visible]].map(([i,v]) => {

   270

    |              this.apply_hmi_value(i,v);

   271

    |              this.cache[i] = v;

   272

    |         });

   273

    apply "$data_elt", mode="json_table_render_except_comments" {

   274

        with "expressions","$initexpr_ns";

   275

        with "widget_elts","$hmi_element/*[@inkscape:label = 'data']/descendant::svg:*";

   276

    }

   277

    |     },

   278

    |     init() {

   279

    |        this.init_common();

   280

    foreach "$hmi_element/*[starts-with(@inkscape:label,'action_')]" {

   281

    |         id("«@id»").onclick = this.make_on_click("«func:escape_quotes(@inkscape:label)»");

   282

    }

   283

    |     }

   284

   285

}