14 lmargin = this.text_bbox.x - this.box_bbox.x; |
14 lmargin = this.text_bbox.x - this.box_bbox.x; |
15 tmargin = this.text_bbox.y - this.box_bbox.y; |
15 tmargin = this.text_bbox.y - this.box_bbox.y; |
16 rmargin = this.box_bbox.width - this.text_bbox.width - lmargin; |
16 rmargin = this.box_bbox.width - this.text_bbox.width - lmargin; |
17 bmargin = this.box_bbox.height - this.text_bbox.height - tmargin; |
17 bmargin = this.box_bbox.height - this.text_bbox.height - tmargin; |
18 this.margins = [lmargin, tmargin, rmargin, bmargin].map(x => Math.max(x,0)); |
18 this.margins = [lmargin, tmargin, rmargin, bmargin].map(x => Math.max(x,0)); |
19 this.content = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten"]; |
19 this.content = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten", |
|
20 "eleven", "twelve", "thirteen", "fourteen", "fifteen"]; |
20 //this.content = ["one", "two", "three", "four", "5", "6"]; |
21 //this.content = ["one", "two", "three", "four", "5", "6"]; |
21 this.menu_offset = 0; |
22 this.menu_offset = 0; |
22 this.lift = 0; |
23 this.lift = 0; |
23 this.opened = false; |
24 this.opened = false; |
24 }, |
25 }, |
25 on_selection_click: function(selection) { |
26 on_selection_click: function(selection) { |
26 this.set_selection(selection); |
27 this.set_selection(selection); |
27 }, |
28 }, |
28 on_click: function() { |
29 on_click: function() { |
29 if(this.opened){ |
30 if(this.opened){ |
30 this.close(); |
31 //this.close(); |
31 }else{ |
32 }else{ |
32 this.open(); |
33 this.open(); |
33 } |
34 } |
|
35 }, |
|
36 on_backward_click:function(){ |
|
37 this.move(false); |
|
38 }, |
|
39 on_forward_click:function(){ |
|
40 this.move(true); |
34 }, |
41 }, |
35 set_selection: function(value) { |
42 set_selection: function(value) { |
36 this.text_elt.firstElementChild.textContent = |
43 this.text_elt.firstElementChild.textContent = |
37 (value >= 0 && value < this.content.length) ? |
44 (value >= 0 && value < this.content.length) ? |
38 this.content[value] : "?"+String(value)+"?"; |
45 this.content[value] : "?"+String(value)+"?"; |
82 span.textContent = item; |
89 span.textContent = item; |
83 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_selection_click("+c+")"); |
90 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_selection_click("+c+")"); |
84 c++; |
91 c++; |
85 } |
92 } |
86 }, |
93 }, |
|
94 move: function(forward){ |
|
95 let contentlength = this.content.length; |
|
96 let spans = this.text_elt.children; |
|
97 let spanslength = spans.length; |
|
98 if(this.menu_offset != 0) spanslength--; |
|
99 if(this.menu_offset < contentlength - 1) spanslength--; |
|
100 if(forward){ |
|
101 this.menu_offset = Math.min( |
|
102 contentlength - spans.length + 1, |
|
103 this.menu_offset + spanslength); |
|
104 }else{ |
|
105 this.menu_offset = Math.max( |
|
106 0, |
|
107 this.menu_offset - spanslength); |
|
108 } |
|
109 console.log(this.menu_offset); |
|
110 this.set_partial_text(); |
|
111 }, |
87 set_partial_text: function(){ |
112 set_partial_text: function(){ |
88 let spans = this.text_elt.children; |
113 let spans = this.text_elt.children; |
89 let length = this.content.length; |
114 let contentlength = this.content.length; |
|
115 let spanslength = spans.length; |
90 let i = this.menu_offset, c = 0; |
116 let i = this.menu_offset, c = 0; |
91 while(c < spans.length){ |
117 while(c < spanslength){ |
|
118 let span=spans[c]; |
92 if(c == 0 && i != 0){ |
119 if(c == 0 && i != 0){ |
93 spans[c].textContent = "..."; |
120 span.textContent = "↑ ↑ ↑"; |
94 /* TODO: set onclick */ |
121 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_backward_click()"); |
95 }else if(c == spans.length-1 && i < length - 1) |
122 }else if(c == spanslength-1 && i < contentlength - 1){ |
96 spans[c].textContent = "..."; |
123 span.textContent = "↓ ↓ ↓"; |
97 /* TODO: set onclick */ |
124 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_forward_click()"); |
98 else{ |
125 }else{ |
99 let span=spans[c]; |
|
100 span.textContent = this.content[i]; |
126 span.textContent = this.content[i]; |
101 /* TODO: set onclick */ |
|
102 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_selection_click("+i+")"); |
127 span.setAttribute("onclick", "hmi_widgets['«$hmi_element/@id»'].on_selection_click("+i+")"); |
103 i++; |
128 i++; |
104 } |
129 } |
105 c++; |
130 c++; |
106 } |
131 } |