6

||    

     7

    dispatch: function(value) {

     8

        let span = this.text_elt.firstElementChild;

     9

        span.textContent = (value >= 0 && value < this.content.length) ?

    10

          this.content[value] : String(value);

    11

    },

    12

    init: function() {

    13

        this.element.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_click()");

    14

        this.text_bbox = this.text_elt.getBBox()

    15

        this.box_bbox = this.box_elt.getBBox()

    16

        lmargin = this.text_bbox.x - this.box_bbox.x;

    17

        tmargin = this.text_bbox.y - this.box_bbox.y;

    18

        rmargin = this.box_bbox.width - this.text_bbox.width - lmargin;

    19

        bmargin = this.box_bbox.height - this.text_bbox.height - tmargin;

    20

        this.margins = [lmargin, tmargin, rmargin, bmargin].map(x => Math.max(x,0));

    21

        this.content = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"];

    22

        //this.content = ["one", "two", "three", "four", "5", "6"];

    23

        this.offset = 0;

    24

        this.lift = 0;

    25

    },

    26

    on_click: function() {

    27

        this.open();

    28

    },

    29

    try_grow_one: function() {

    30

        let txt = this.text_elt; 

    31

        let first = txt.firstElementChild;

    32

        let bounds = svg_root.getBoundingClientRect(); 

    33

        let next = first.cloneNode();

    34

        //next.removeAttribute("x");

    35

        next.removeAttribute("y");

    36

        next.setAttribute("dy", "1.1em");

    37

        next.textContent = "...";

    38

        txt.appendChild(next);

    39

        let rect = txt.getBoundingClientRect();

    40

        console.log("bounds", bounds);

    41

        console.log("rect", rect);

    42

        if(rect.bottom > bounds.bottom){

    43

            let backup = first.getAttribute("dy");

    44

            first.setAttribute("dy", "-"+String((this.lift+1)*1.1)+"em");

    45

            rect = txt.getBoundingClientRect();

    46

            if(rect.top > bounds.top){

    47

                console.log("rect2ok", rect);

    48

                this.lift += 1;

    49

            } else {

    50

                console.log("rect2Nok", rect);

    51

                if(backup)

    52

                    first.setAttribute("dy", backup);

    53

                else

    54

                    first.removeAttribute("dy");

    55

                txt.removeChild(next);

    56

                return false;

    57

            }

    58

        }

    59

        return true;

    60

    },

    61

    open: function(){

    62

        let l = this.content.length;

    63

        let c = 1;

    64

        this.lift = 0;

    65

        this.purge();

    66

        while(c < l && this.try_grow_one()) c++;

    67

        let spans = Array.from(this.text_elt.children); 

    68

        if(c == l) {

    69

            c = 0;

    70

            while(c < l){

    71

                spans[c].textContent = this.content[c];

    72

                c++;

    73

            }

    74

        } else {

    75

            let slots = c;

    76

            let elipses = [];

    77

            if(this.offset != 0) 

    78

                elipses.push(0);

    79

            if(this.offset + slots - elipses.length < l)

    80

                elipses.push(spans.length-1);

    81

            let i = 0;

    82

            c = 0;

    83

            while(c < spans.length){

    84

                if(elipses.indexOf(c) != -1)

    85

                    spans[c].textContent = "...";

    86

                else{

    87

                    spans[c].textContent = this.content[this.offset + i];

    88

                    i++;

    89

                }

    90

                c++;

    91

            }

    92

        }

    93

        this.adjust_to_text();

    94

    },

    95

    purge: function(){

    96

        let txt = this.text_elt; 

    97

        for(let span of Array.from(txt.children).slice(1)){

    98

            txt.removeChild(span)

    99

        }

   100

    },

   101

    adjust_to_text: function(){

   102

        let [lmargin, tmargin, rmargin, bmargin] = this.margins;

   103

        let m = this.text_elt.getBBox();

   104

        this.box_elt.x.baseVal.value = m.x - lmargin;

   105

        this.box_elt.y.baseVal.value = m.y - tmargin;

   106

        this.box_elt.width.baseVal.value = lmargin + m.width + rmargin;

   107

        this.box_elt.height.baseVal.value = tmargin + m.height + bmargin;

   108

    },

   109

||

   112

    // |         let p = new DOMPoint(this.box_elt.x.baseVal.value, this.box_elt.y.baseVal.value);

   113

    // |         let k = DOMMatrix.fromMatrix(this.box_elt.getCTM());

   114

    // |         let new_corner = k.transformPoint(p);

   115

    // |         new_corner.y = 0;

   116

    // |         let nc = k.inverse().transformPoint(new_corner);

   117

    // |         this.box_elt.x.baseVal.value = nc.x;

   118

    // |         this.box_elt.y.baseVal.value = nc.y;