1 /** |
|
2 * ListBox.js |
|
3 * |
|
4 * Copyright, Moxiecode Systems AB |
|
5 * Released under LGPL License. |
|
6 * |
|
7 * License: http://www.tinymce.com/license |
|
8 * Contributing: http://www.tinymce.com/contributing |
|
9 */ |
|
10 |
|
11 /** |
|
12 * Creates a new list box control. |
|
13 * |
|
14 * @-x-less ListBox.less |
|
15 * @class tinymce.ui.ListBox |
|
16 * @extends tinymce.ui.MenuButton |
|
17 */ |
|
18 define("tinymce/ui/ListBox", [ |
|
19 "tinymce/ui/MenuButton" |
|
20 ], function(MenuButton) { |
|
21 "use strict"; |
|
22 |
|
23 return MenuButton.extend({ |
|
24 /** |
|
25 * Constructs a instance with the specified settings. |
|
26 * |
|
27 * @constructor |
|
28 * @param {Object} settings Name/value object with settings. |
|
29 * @setting {Array} values Array with values to add to list box. |
|
30 */ |
|
31 init: function(settings) { |
|
32 var self = this, values, selected, selectedText, lastItemCtrl; |
|
33 |
|
34 function setSelected(menuValues) { |
|
35 // Try to find a selected value |
|
36 for (var i = 0; i < menuValues.length; i++) { |
|
37 selected = menuValues[i].selected || settings.value === menuValues[i].value; |
|
38 |
|
39 if (selected) { |
|
40 selectedText = selectedText || menuValues[i].text; |
|
41 self._value = menuValues[i].value; |
|
42 break; |
|
43 } |
|
44 |
|
45 // If the value has a submenu, try to find the selected values in that menu |
|
46 if (menuValues[i].menu) { |
|
47 setSelected(menuValues[i].menu); |
|
48 } |
|
49 } |
|
50 } |
|
51 |
|
52 self._values = values = settings.values; |
|
53 if (values) { |
|
54 setSelected(values); |
|
55 |
|
56 // Default with first item |
|
57 if (!selected && values.length > 0) { |
|
58 selectedText = values[0].text; |
|
59 self._value = values[0].value; |
|
60 } |
|
61 |
|
62 settings.menu = values; |
|
63 } |
|
64 |
|
65 settings.text = settings.text || selectedText || values[0].text; |
|
66 |
|
67 self._super(settings); |
|
68 self.addClass('listbox'); |
|
69 |
|
70 self.on('select', function(e) { |
|
71 var ctrl = e.control; |
|
72 |
|
73 if (lastItemCtrl) { |
|
74 e.lastControl = lastItemCtrl; |
|
75 } |
|
76 |
|
77 if (settings.multiple) { |
|
78 ctrl.active(!ctrl.active()); |
|
79 } else { |
|
80 self.value(e.control.settings.value); |
|
81 } |
|
82 |
|
83 lastItemCtrl = ctrl; |
|
84 }); |
|
85 }, |
|
86 |
|
87 /** |
|
88 * Getter/setter function for the control value. |
|
89 * |
|
90 * @method value |
|
91 * @param {String} [value] Value to be set. |
|
92 * @return {Boolean/tinymce.ui.ListBox} Value or self if it's a set operation. |
|
93 */ |
|
94 value: function(value) { |
|
95 var self = this, active, selectedText, menu; |
|
96 |
|
97 function activateByValue(menu, value) { |
|
98 menu.items().each(function(ctrl) { |
|
99 active = ctrl.value() === value; |
|
100 |
|
101 if (active) { |
|
102 selectedText = selectedText || ctrl.text(); |
|
103 } |
|
104 |
|
105 ctrl.active(active); |
|
106 |
|
107 if (ctrl.menu) { |
|
108 activateByValue(ctrl.menu, value); |
|
109 } |
|
110 }); |
|
111 } |
|
112 |
|
113 function setActiveValues(menuValues) { |
|
114 for (var i = 0; i < menuValues.length; i++) { |
|
115 active = menuValues[i].value == value; |
|
116 |
|
117 if (active) { |
|
118 selectedText = selectedText || menuValues[i].text; |
|
119 } |
|
120 |
|
121 menuValues[i].active = active; |
|
122 |
|
123 if (menuValues[i].menu) { |
|
124 setActiveValues(menuValues[i].menu); |
|
125 } |
|
126 } |
|
127 } |
|
128 |
|
129 if (typeof value != "undefined") { |
|
130 if (self.menu) { |
|
131 activateByValue(self.menu, value); |
|
132 } else { |
|
133 menu = self.settings.menu; |
|
134 setActiveValues(menu); |
|
135 } |
|
136 |
|
137 self.text(selectedText || this.settings.text); |
|
138 } |
|
139 |
|
140 return self._super(value); |
|
141 } |
|
142 }); |
|
143 }); |
|