blob: bebaac4e6c1b14f127bbed6e0e1cac318d171e93 [file] [log] [blame]
Nils Diewald0e6992a2015-04-14 20:13:52 +00001 /**
Akron52ed22d2018-07-11 17:05:19 +02002 * Menu to choose from in a button group.
Nils Diewald0e6992a2015-04-14 20:13:52 +00003 */
Akron52ed22d2018-07-11 17:05:19 +02004define(['menu'], function (menuClass) {
Nils Diewald0e6992a2015-04-14 20:13:52 +00005 "use strict";
6
7 return {
Nils Diewald7148c6f2015-05-04 15:07:53 +00008
9 /**
10 * Create new menu object.
Akron7f9a6a32018-07-18 15:05:23 +020011 * Pass the panel object
Nils Diewald7148c6f2015-05-04 15:07:53 +000012 * and the item parameters.
13 *
Akron7f9a6a32018-07-18 15:05:23 +020014 * @param panel The panel object
Nils Diewald7148c6f2015-05-04 15:07:53 +000015 * @param params The match menu items
16 * as an array of arrays.
17 */
Akron52ed22d2018-07-11 17:05:19 +020018 create : function (list, itemClass) {
Nils Diewald0e6992a2015-04-14 20:13:52 +000019 var obj = Object.create(menuClass)
Akrond67d45b2017-05-18 21:47:38 +020020 .upgradeTo(this)
Akron0988d882017-11-10 16:13:12 +010021 ._init(list, {itemClass : itemClass});
Nils Diewald0e6992a2015-04-14 20:13:52 +000022 obj.limit(6);
Akroneaba63e2018-01-26 19:49:30 +010023
24 var e = obj.element();
Nils Diewald0e6992a2015-04-14 20:13:52 +000025
26 // This is only domspecific
Akroneaba63e2018-01-26 19:49:30 +010027 e.addEventListener('blur', function (e) {
Akrond67d45b2017-05-18 21:47:38 +020028 this.menu.hide();
Nils Diewald0e6992a2015-04-14 20:13:52 +000029 });
Akroneaba63e2018-01-26 19:49:30 +010030
Akron52ed22d2018-07-11 17:05:19 +020031 e.classList.add('button-group-list');
Akroneaba63e2018-01-26 19:49:30 +010032
33 // Add menu to body
34 document.getElementsByTagName('body')[0].appendChild(e);
35
Nils Diewald0e6992a2015-04-14 20:13:52 +000036 return obj;
37 },
Nils Diewald7148c6f2015-05-04 15:07:53 +000038
39 /**
Akron7f9a6a32018-07-18 15:05:23 +020040 * The panel object of the menu.
Nils Diewald7148c6f2015-05-04 15:07:53 +000041 */
Akron7f9a6a32018-07-18 15:05:23 +020042 panel :function (panelVar) {
43 if (panelVar !== undefined)
44 this._panel = panelVar;
Akroneaba63e2018-01-26 19:49:30 +010045
Akron7f9a6a32018-07-18 15:05:23 +020046 return this._panel;
Akroneaba63e2018-01-26 19:49:30 +010047 },
48
Akronbec4a6a2018-07-10 14:45:15 +020049 // Attach menu to button
Akron52ed22d2018-07-11 17:05:19 +020050 button : function (btn) {
Akron257aa852018-02-06 19:29:51 +010051
Akron1801c5c2018-07-16 18:15:48 +020052 this._button = btn;
53
Akron257aa852018-02-06 19:29:51 +010054 // this._attached = e;
Akron1801c5c2018-07-16 18:15:48 +020055 this._repos(this._button);
Akron257aa852018-02-06 19:29:51 +010056 this.slider().reInit();
57
58 /*
59 * This is a suboptimal scrolling solution, see
60 * see https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects
61 */
62 if (this._onscroll !== undefined) {
63 window.removeEventListener('scroll', this._onscroll);
64 };
65
66 this._onscroll = function () {
Akron1801c5c2018-07-16 18:15:48 +020067 this._repos(this._button);
Akron257aa852018-02-06 19:29:51 +010068 }.bind(this);
69
70 window.addEventListener('scroll', this._onscroll);
71 },
72
73
74 // Overwrite onHide method
75 onHide : function () {
76
77 // Remove listener
78 if (this._onscroll !== undefined) {
79 window.removeEventListener('scroll', this._onscroll);
80 };
Akronc296ca22018-04-24 16:35:26 +020081 this.element().blur();
Akron257aa852018-02-06 19:29:51 +010082 },
83
84 _repos : function (e) {
Akroneaba63e2018-01-26 19:49:30 +010085 var bounding = e.getBoundingClientRect();
86 this._element.style.left = bounding.left + "px";
Akron257aa852018-02-06 19:29:51 +010087 this._element.style.top = (
88 bounding.top +
89 bounding.height -
90 this._element.clientHeight
91 ) + "px";
Nils Diewald0e6992a2015-04-14 20:13:52 +000092 }
93 };
94});