author | tasneems@symbian.org |
Mon, 01 Mar 2010 16:03:32 -0800 | |
changeset 211 | 7b148352159e |
parent 210 | 0f7abfd6ae62 |
child 273 | b1f63c2c240c |
permissions | -rw-r--r-- |
210
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
1 |
/** |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
2 |
* Copyright (c) 2009-2010 Symbian Foundation and/or its subsidiary(-ies). |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
3 |
* All rights reserved. |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
4 |
* This component and the accompanying materials are made available |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
5 |
* under the terms of the License "Eclipse Public License v1.0" |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
6 |
* which accompanies this distribution, and is available |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
7 |
* at the URL "http://www.eclipse.org/legal/epl-v10.html". |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
8 |
* |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
9 |
* Initial Contributors: |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
10 |
* Symbian Foundation - initial contribution. |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
11 |
* Contributors: |
0f7abfd6ae62
Fixed bug 2072: update .js files with EPL
tasneems@symbian.org
parents:
102
diff
changeset
|
12 |
*/ |
73 | 13 |
/* |
211 | 14 |
© Copyright 2008 Nokia Corporation. All rights reserved. |
73 | 15 |
|
16 |
IMPORTANT: The Nokia software ("WRTKit and Example Widget files") is supplied to you by Nokia |
|
211 | 17 |
Corporation ("Nokia") in consideration of your agreement to the following terms. Your use, installation |
73 | 18 |
and/or redistribution of the WRTKit and Example Widget files constitutes acceptance of these terms. If |
19 |
you do not agree with these terms, please do not use, install, or redistribute the WRTKit and Example |
|
20 |
Widget files. |
|
21 |
||
22 |
In consideration of your agreement to abide by the following terms, and subject to these terms, Nokia |
|
211 | 23 |
grants you a personal, non-exclusive license, under Nokia's copyrights in the WRTKit and Example |
73 | 24 |
Widget files, to use, reproduce, and redistribute the WRTKit and Example files, in text form (for HTML, |
25 |
CSS, or JavaScript files) or binary form (for associated images), for the sole purpose of creating S60 |
|
26 |
Widgets. |
|
27 |
||
28 |
If you redistribute the WRTKit and Example files, you must retain this entire notice in all such |
|
29 |
redistributions of the WRTKit and Example files. |
|
30 |
||
31 |
You may not use the name, trademarks, service marks or logos of Nokia to endorse or promote products |
|
32 |
that include the WRTKit and Example files without the prior written explicit agreement with Nokia. |
|
33 |
Except as expressly stated in this notice, no other rights or licenses, express or implied, are granted by |
|
34 |
Nokia herein, including but not limited to any patent rights that may be infringed by your products that |
|
35 |
incorporate the WRTKit and Example files or by other works in which the WRTKit and Example files |
|
36 |
may be incorporated. |
|
37 |
||
38 |
The WRTKit and Example files are provided on an "AS IS" basis. NOKIA MAKES NO |
|
39 |
WARRANTIES, EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED |
|
40 |
WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS FOR A |
|
41 |
PARTICULAR PURPOSE, REGARDING THE EXAMPLES OR ITS USE AND OPERATION |
|
42 |
ALONE OR IN COMBINATION WITH YOUR PRODUCTS. |
|
43 |
||
44 |
IN NO EVENT SHALL NOKIA BE LIABLE FOR ANY SPECIAL, INDIRECT, INCIDENTAL OR |
|
45 |
CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
|
46 |
SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
|
47 |
INTERRUPTION) ARISING IN ANY WAY OUT OF THE USE, REPRODUCTION, AND/OR |
|
48 |
DISTRIBUTION OF THE EXAMPLES, HOWEVER CAUSED AND WHETHER UNDER THEORY |
|
49 |
OF CONTRACT, TORT (INCLUDING NEGLIGENCE), STRICT LIABILITY OR OTHERWISE, |
|
50 |
EVEN IF NOKIA HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. |
|
51 |
||
52 |
*/ |
|
53 |
||
54 |
/////////////////////////////////////////////////////////////////////////////// |
|
55 |
// The SelectionList class implements a single or multi selection control |
|
56 |
// that lets users select one or more options from a list of options. |
|
57 |
||
58 |
// Constructor. |
|
59 |
function SelectionList(id, caption, options, multipleSelection, selected) { |
|
60 |
if (id != UI_NO_INIT_ID) { |
|
61 |
this.init(id, caption, options, multipleSelection, selected); |
|
62 |
} |
|
63 |
} |
|
64 |
||
65 |
// SelectionList inherits from SelectionControl. |
|
66 |
SelectionList.prototype = new SelectionControl(UI_NO_INIT_ID); |
|
67 |
||
68 |
// Root element for options. |
|
69 |
SelectionList.prototype.optionListElement = null; |
|
70 |
||
71 |
// Array for tracking option elements. |
|
72 |
SelectionList.prototype.optionElements = null; |
|
73 |
||
74 |
// Tracking for currently focused option; null if none. |
|
75 |
SelectionList.prototype.focusedOption = null; |
|
76 |
||
77 |
// Enabled status. |
|
78 |
SelectionList.prototype.enabled = false; |
|
79 |
||
80 |
// Initializer - called from constructor. |
|
81 |
SelectionList.prototype.init = function(id, caption, options, multipleSelection, selected) { |
|
82 |
uiLogger.debug("SelectionList.init(" + id + ", " + caption + ", " + options + ", " + multipleSelection + ", " + selected + ")"); |
|
83 |
||
84 |
// call superclass initializer |
|
85 |
SelectionControl.prototype.init.call(this, id, caption, options, multipleSelection, selected); |
|
86 |
||
87 |
// create option list element |
|
88 |
this.optionListElement = document.createElement("div"); |
|
89 |
this.controlElement.appendChild(this.optionListElement); |
|
90 |
||
91 |
// the control defaults to enabled |
|
92 |
this.enabled = true; |
|
93 |
||
94 |
// init option element arrays |
|
95 |
this.optionElements = []; |
|
96 |
||
97 |
// update the option elements to match the options in this control |
|
98 |
this.updateOptionElements(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
99 |
}; |
73 | 100 |
|
101 |
// Returns the enabled state. |
|
102 |
SelectionList.prototype.isEnabled = function() { |
|
103 |
return this.enabled; |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
104 |
}; |
73 | 105 |
|
106 |
// Sets the enabled state. |
|
107 |
SelectionList.prototype.setEnabled = function(enabled) { |
|
108 |
uiLogger.debug("SelectionList.setEnabled(" + enabled + ")"); |
|
109 |
// switch the state and update the the control |
|
110 |
this.enabled = enabled; |
|
111 |
this.updateOptionElements(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
112 |
}; |
73 | 113 |
|
114 |
// Sets the focused state for the control. |
|
115 |
// Note: This may not always succeed. |
|
116 |
SelectionList.prototype.setFocused = function(focused) { |
|
117 |
uiLogger.debug("SelectionList.setFocused(" + focused + ")"); |
|
118 |
if (this.enabled && this.optionElements.length > 0) { |
|
119 |
if (focused) { |
|
120 |
this.optionElements[0].link.focus(); |
|
121 |
} else { |
|
122 |
this.optionElements[0].link.blur(); |
|
123 |
} |
|
124 |
} |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
125 |
}; |
73 | 126 |
|
127 |
// Sets the currently selected options. Pass a single option in a single selection |
|
128 |
// control or an array of selected controls in a multiple selection control. To |
|
129 |
// deselect all options pass null in a single selection control and an empty array |
|
130 |
// in a multiple selection control. |
|
131 |
SelectionList.prototype.setSelected = function(selected) { |
|
132 |
// call superclass setSelected() |
|
133 |
SelectionControl.prototype.setSelected.call(this, selected); |
|
134 |
this.updateStyleFromState(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
135 |
}; |
73 | 136 |
|
137 |
// Sets the options in the control. |
|
138 |
SelectionList.prototype.setOptions = function(options) { |
|
139 |
// call superclass setOptions() |
|
140 |
SelectionControl.prototype.setOptions.call(this, options); |
|
141 |
this.updateOptionElements(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
142 |
}; |
73 | 143 |
|
144 |
// Updates the option elements for the control element. |
|
145 |
SelectionList.prototype.updateOptionElements = function() { |
|
146 |
uiLogger.debug("SelectionControl.updateOptionElements()"); |
|
147 |
||
148 |
// start by removing all current options from the option list element |
|
149 |
while (this.optionListElement.firstChild != null) { |
|
150 |
this.optionListElement.removeChild(this.optionListElement.firstChild); |
|
151 |
} |
|
152 |
||
153 |
// iterate through the options and add (and possibly create) a |
|
154 |
// properly configured option element for each option |
|
155 |
for (var i = 0; i < this.options.length; i++) { |
|
156 |
// get the option and option element we're working on |
|
157 |
var option = this.options[i]; |
|
158 |
||
159 |
// option, link and text elements for this option |
|
160 |
var optionElement; |
|
161 |
var optionLinkElement; |
|
162 |
var optionTextElement; |
|
163 |
||
164 |
// get the elements |
|
165 |
if (i == this.optionElements.length) { |
|
166 |
// we need to create a new option element... |
|
167 |
optionElement = document.createElement("div"); |
|
168 |
||
169 |
// ...and a new option link element... |
|
170 |
optionLinkElement = document.createElement("a"); |
|
171 |
optionLinkElement.href = "JavaScript:void(0)"; |
|
172 |
||
173 |
// ...and a new option text element |
|
174 |
optionTextElement = document.createElement("span"); |
|
175 |
||
176 |
// hook up event listeners to the element |
|
177 |
var self = this; |
|
178 |
optionLinkElement.addEventListener("focus", function(event) { self.optionFocusStateChanged(event, true); }, false); |
|
179 |
optionLinkElement.addEventListener("blur", function(event) { self.optionFocusStateChanged(event, false); }, false); |
|
180 |
optionElement.addEventListener("mouseover", function() { self.hoverStateChanged(true); }, false); |
|
181 |
optionElement.addEventListener("mouseout", function() { self.hoverStateChanged(false); }, false); |
|
182 |
optionElement.addEventListener("mousedown", function(event) { |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
183 |
self.optionClicked(event); |
73 | 184 |
event.stopPropagation(); |
185 |
event.preventDefault(); |
|
186 |
}, true); |
|
187 |
optionElement.addEventListener("keydown", function(event) { |
|
188 |
// center and enter trigger the action |
|
189 |
if (event.keyCode == 0 || event.keyCode == 13) { |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
190 |
self.optionClicked(event); |
73 | 191 |
event.stopPropagation(); |
192 |
event.preventDefault(); |
|
193 |
} |
|
194 |
}, true); |
|
195 |
||
196 |
// add the elements to the option element array |
|
197 |
this.optionElements.push({ option: optionElement, link: optionLinkElement, text: optionTextElement }); |
|
198 |
} else { |
|
199 |
// we already have ready elements so we'll reuse them |
|
200 |
optionElement = this.optionElements[i].option; |
|
201 |
optionLinkElement = this.optionElements[i].link; |
|
202 |
optionTextElement = this.optionElements[i].text; |
|
203 |
||
204 |
// remove the option link element from its current parent - if any |
|
205 |
if (optionLinkElement.parentNode != null) { |
|
206 |
optionLinkElement.parentNode.removeChild(optionLinkElement); |
|
207 |
} |
|
208 |
||
209 |
// remove the option text element from its current parent - if any |
|
210 |
if (optionTextElement.parentNode != null) { |
|
211 |
optionTextElement.parentNode.removeChild(optionTextElement); |
|
212 |
} |
|
213 |
} |
|
214 |
||
215 |
// set the option text |
|
216 |
optionTextElement.innerHTML = option.text; |
|
217 |
||
218 |
// hook up the option to the control |
|
219 |
if (this.enabled) { |
|
220 |
// add the option link element to the option element |
|
221 |
optionElement.appendChild(optionLinkElement); |
|
222 |
// add the text element to the option element |
|
223 |
optionLinkElement.appendChild(optionTextElement); |
|
224 |
} else { |
|
225 |
// add the text element directly to the control element |
|
226 |
optionElement.appendChild(optionTextElement); |
|
227 |
} |
|
228 |
// add the option element to the option list element |
|
229 |
this.optionListElement.appendChild(optionElement); |
|
230 |
} |
|
231 |
||
232 |
// update the style |
|
233 |
this.updateStyleFromState(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
234 |
}; |
73 | 235 |
|
236 |
// Callback for focus state change events. |
|
237 |
SelectionList.prototype.optionFocusStateChanged = function(event, focused) { |
|
238 |
uiLogger.debug("SelectionControl.optionFocusStateChanged()"); |
|
239 |
||
240 |
// get the event source option |
|
241 |
var option = null; |
|
242 |
var optionElement = null; |
|
243 |
for (var i = 0; i < this.optionElements.length; i++) { |
|
244 |
optionElement = this.optionElements[i]; |
|
245 |
if (optionElement.link == event.currentTarget) { |
|
246 |
option = this.options[i]; |
|
247 |
break; |
|
248 |
} |
|
249 |
} |
|
250 |
||
251 |
// remember the focused option; or null if none is focused |
|
252 |
if (focused) { |
|
253 |
this.focusedOption = option; |
|
254 |
} else { |
|
255 |
this.focusedOption = null; |
|
256 |
} |
|
257 |
||
258 |
// call the superclass focus state change handler |
|
259 |
this.focusStateChanged(focused); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
260 |
}; |
73 | 261 |
|
262 |
// Callback for clicks. |
|
263 |
SelectionList.prototype.optionClicked = function(event) { |
|
264 |
uiLogger.debug("SelectionControl.optionClicked()"); |
|
265 |
||
266 |
// bail out if we're not enabled |
|
267 |
if (!this.enabled) { |
|
268 |
return false; |
|
269 |
} |
|
270 |
||
271 |
// get the changed option |
|
272 |
var option = null; |
|
273 |
var optionElement = null; |
|
274 |
for (var i = 0; i < this.optionElements.length; i++) { |
|
275 |
optionElement = this.optionElements[i]; |
|
276 |
if (optionElement.option == event.currentTarget) { |
|
277 |
option = this.options[i]; |
|
278 |
break; |
|
279 |
} |
|
280 |
} |
|
281 |
||
282 |
// make sure the option is focused |
|
283 |
optionElement.link.focus(); |
|
284 |
||
285 |
// toggle the selection |
|
286 |
if (this.multipleSelection) { |
|
287 |
// iterate through the selected options and see if this |
|
288 |
// option is selected. if not then add it to the selection. |
|
289 |
// if it already is selected then them remove it. |
|
290 |
var found = false; |
|
291 |
for (var i = 0; i < this.selected.length; i++) { |
|
292 |
if (this.selected[i] == option) { |
|
293 |
// remove from selected set |
|
294 |
found = true; |
|
295 |
this.selected.splice(i, 1); |
|
296 |
break; |
|
297 |
} |
|
298 |
} |
|
299 |
if (!found) { |
|
300 |
// add to the selected set |
|
301 |
this.selected.push(option); |
|
302 |
} |
|
303 |
} else { |
|
304 |
// update the selected option |
|
305 |
this.selected = option; |
|
306 |
} |
|
307 |
||
308 |
// update the style |
|
309 |
this.updateStyleFromState(); |
|
310 |
||
311 |
// notify event listeners |
|
312 |
this.fireEvent(this.createEvent("SelectionChanged", this.getSelected())); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
313 |
}; |
73 | 314 |
|
315 |
// Resets the state tracking for focus and hover. |
|
316 |
// Override this in subclasses as required to implement the state reset. |
|
317 |
SelectionList.prototype.resetFocusState = function() { |
|
318 |
uiLogger.debug("SelectionList.resetFocusState()"); |
|
319 |
this.hovering = false; |
|
320 |
this.focused = false; |
|
321 |
this.focusedOption = null; |
|
322 |
this.updateStyleFromState(); |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
323 |
}; |
73 | 324 |
|
325 |
// Updates the style of the control to reflects the state of the control. |
|
326 |
SelectionList.prototype.updateStyleFromState = function() { |
|
327 |
uiLogger.debug("SelectionList.updateStyleFromState()"); |
|
328 |
||
329 |
// determine the state name |
|
330 |
var stateName = this.getStyleStateName(); |
|
331 |
||
332 |
// set element class names |
|
333 |
this.setClassName(this.rootElement, "Control"); |
|
334 |
this.setClassName(this.controlElement, "ControlElement"); |
|
335 |
this.setClassName(this.assemblyElement, "ControlAssembly ControlAssembly" + stateName); |
|
336 |
this.setClassName(this.captionElement, "ControlCaption ControlCaption" + stateName); |
|
337 |
||
338 |
// set option list and option class names |
|
339 |
this.setClassName(this.optionListElement, "SelectionList SelectionList" + stateName); |
|
340 |
for (var i = 0; i < this.options.length; i++) { |
|
341 |
var option = this.options[i]; |
|
342 |
||
343 |
// get the option and option text elements for this option |
|
344 |
var optionElement = this.optionElements[i].option; |
|
345 |
var optionTextElement = this.optionElements[i].text; |
|
346 |
||
347 |
// figure out the option state |
|
348 |
var optionStateName = this.isSelected(option) ? "Checked" : "Unchecked"; |
|
349 |
if (!this.enabled) { |
|
350 |
optionStateName += "Disabled"; |
|
351 |
} else if (this.focusedOption == option) { |
|
352 |
optionStateName += "Focus"; |
|
353 |
} else { |
|
354 |
optionStateName += "Normal"; |
|
355 |
} |
|
356 |
||
357 |
// set option element class names |
|
358 |
if (this.multipleSelection) { |
|
359 |
this.setClassName(optionElement, "SelectionListOptionMulti SelectionListOptionMulti" + optionStateName); |
|
360 |
} else { |
|
361 |
this.setClassName(optionElement, "SelectionListOptionSingle SelectionListOptionSingle" + optionStateName); |
|
362 |
} |
|
363 |
||
364 |
// set option text class names |
|
365 |
this.setClassName(optionTextElement, "SelectionListOptionText SelectionListOptionText" + stateName); |
|
366 |
} |
|
102
30e0796f3ebb
Warnings in new projects were fixed
Eugene Ostroukhov <eugeneo@symbian.org>
parents:
73
diff
changeset
|
367 |
}; |