equal
deleted
inserted
replaced
1 // widget_dropdown.ysl2 |
1 // widget_dropdown.ysl2 |
2 |
2 |
3 template "widget[@type='DropDown']", mode="widget_class"{ |
3 widget_class("DropDown") { |
4 || |
4 || |
5 function numb_event(e) { |
|
6 e.stopPropagation(); |
|
7 } |
|
8 class DropDownWidget extends Widget{ |
|
9 dispatch(value) { |
5 dispatch(value) { |
10 if(!this.opened) this.set_selection(value); |
6 if(!this.opened) this.set_selection(value); |
11 } |
7 } |
12 init() { |
8 init() { |
13 this.button_elt.onclick = this.on_button_click.bind(this); |
9 this.button_elt.onclick = this.on_button_click.bind(this); |
117 this.close(); |
113 this.close(); |
118 } |
114 } |
119 } |
115 } |
120 close(){ |
116 close(){ |
121 // Stop hogging all click events |
117 // Stop hogging all click events |
122 svg_root.removeEventListener("pointerdown", numb_event, true); |
118 svg_root.removeEventListener("pointerdown", this.numb_event, true); |
123 svg_root.removeEventListener("pointerup", numb_event, true); |
119 svg_root.removeEventListener("pointerup", this.numb_event, true); |
124 svg_root.removeEventListener("click", this.bound_close_on_click_elsewhere, true); |
120 svg_root.removeEventListener("click", this.bound_close_on_click_elsewhere, true); |
125 // Restore position and sixe of widget elements |
121 // Restore position and sixe of widget elements |
126 this.reset_text(); |
122 this.reset_text(); |
127 this.reset_clickables(); |
123 this.reset_clickables(); |
128 this.reset_box(); |
124 this.reset_box(); |
235 } |
231 } |
236 this.make_clickable(span, onclickfunc); |
232 this.make_clickable(span, onclickfunc); |
237 c++; |
233 c++; |
238 } |
234 } |
239 } |
235 } |
|
236 numb_event(e) { |
|
237 e.stopPropagation(); |
|
238 } |
240 open(){ |
239 open(){ |
241 let length = this.content.length; |
240 let length = this.content.length; |
242 // systematically reset text, to strip eventual whitespace spans |
241 // systematically reset text, to strip eventual whitespace spans |
243 this.reset_text(); |
242 this.reset_text(); |
244 // grow as much as needed or possible |
243 // grow as much as needed or possible |
262 // Take button out until menu closed |
261 // Take button out until menu closed |
263 this.element.removeChild(this.button_elt); |
262 this.element.removeChild(this.button_elt); |
264 // Rise widget to top by moving it to last position among siblings |
263 // Rise widget to top by moving it to last position among siblings |
265 this.element.parentNode.appendChild(this.element.parentNode.removeChild(this.element)); |
264 this.element.parentNode.appendChild(this.element.parentNode.removeChild(this.element)); |
266 // disable interaction with background |
265 // disable interaction with background |
267 svg_root.addEventListener("pointerdown", numb_event, true); |
266 svg_root.addEventListener("pointerdown", this.numb_event, true); |
268 svg_root.addEventListener("pointerup", numb_event, true); |
267 svg_root.addEventListener("pointerup", this.numb_event, true); |
269 svg_root.addEventListener("click", this.bound_close_on_click_elsewhere, true); |
268 svg_root.addEventListener("click", this.bound_close_on_click_elsewhere, true); |
270 this.highlight_selection(); |
269 this.highlight_selection(); |
271 |
270 |
272 // mark as open |
271 // mark as open |
273 this.opened = true; |
272 this.opened = true; |
327 // b.x.baseVal.value = m.x - lmargin; |
326 // b.x.baseVal.value = m.x - lmargin; |
328 b.y.baseVal.value = m.y - tmargin; |
327 b.y.baseVal.value = m.y - tmargin; |
329 // b.width.baseVal.value = 2 * lmargin + m.width; |
328 // b.width.baseVal.value = 2 * lmargin + m.width; |
330 b.height.baseVal.value = 2 * tmargin + m.height; |
329 b.height.baseVal.value = 2 * tmargin + m.height; |
331 } |
330 } |
332 } |
|
333 || |
331 || |
334 } |
332 } |
335 |
333 |
336 template "widget[@type='DropDown']", mode="widget_defs" { |
334 widget_defs("DropDown") { |
337 param "hmi_element"; |
335 param "hmi_element"; |
338 labels("text box button highlight"); |
336 labels("text box button highlight"); |
339 // It is assumed that list content conforms to Array interface. |
337 // It is assumed that list content conforms to Array interface. |
340 > content: |
338 > content: |
341 choose{ |
339 choose{ |