2 © Copyright 2008 Nokia Corporation. All rights reserved.
\r
4 IMPORTANT: The Nokia software ("WRTKit and Example Widget files") is supplied to you by Nokia
\r
5 Corporation (“Nokia”) in consideration of your agreement to the following terms. Your use, installation
\r
6 and/or redistribution of the WRTKit and Example Widget files constitutes acceptance of these terms. If
\r
7 you do not agree with these terms, please do not use, install, or redistribute the WRTKit and Example
\r
10 In consideration of your agreement to abide by the following terms, and subject to these terms, Nokia
\r
11 grants you a personal, non-exclusive license, under Nokia’s copyrights in the WRTKit and Example
\r
12 Widget files, to use, reproduce, and redistribute the WRTKit and Example files, in text form (for HTML,
\r
13 CSS, or JavaScript files) or binary form (for associated images), for the sole purpose of creating S60
\r
16 If you redistribute the WRTKit and Example files, you must retain this entire notice in all such
\r
17 redistributions of the WRTKit and Example files.
\r
19 You may not use the name, trademarks, service marks or logos of Nokia to endorse or promote products
\r
20 that include the WRTKit and Example files without the prior written explicit agreement with Nokia.
\r
21 Except as expressly stated in this notice, no other rights or licenses, express or implied, are granted by
\r
22 Nokia herein, including but not limited to any patent rights that may be infringed by your products that
\r
23 incorporate the WRTKit and Example files or by other works in which the WRTKit and Example files
\r
24 may be incorporated.
\r
26 The WRTKit and Example files are provided on an "AS IS" basis. NOKIA MAKES NO
\r
27 WARRANTIES, EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED
\r
28 WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS FOR A
\r
29 PARTICULAR PURPOSE, REGARDING THE EXAMPLES OR ITS USE AND OPERATION
\r
30 ALONE OR IN COMBINATION WITH YOUR PRODUCTS.
\r
32 IN NO EVENT SHALL NOKIA BE LIABLE FOR ANY SPECIAL, INDIRECT, INCIDENTAL OR
\r
33 CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
\r
34 SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
\r
35 INTERRUPTION) ARISING IN ANY WAY OUT OF THE USE, REPRODUCTION, AND/OR
\r
36 DISTRIBUTION OF THE EXAMPLES, HOWEVER CAUSED AND WHETHER UNDER THEORY
\r
37 OF CONTRACT, TORT (INCLUDING NEGLIGENCE), STRICT LIABILITY OR OTHERWISE,
\r
38 EVEN IF NOKIA HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
\r
42 ///////////////////////////////////////////////////////////////////////////////
\r
43 // The Control class is an abstract base class for all user interface controls.
\r
46 function Control(id, caption) {
\r
47 if (id != UI_NO_INIT_ID) {
\r
48 this.init(id, caption);
\r
52 // Control inherits from UIElement.
\r
53 Control.prototype = new UIElement(UI_NO_INIT_ID);
\r
55 // The view that control belongs to.
\r
56 Control.prototype.view = null;
\r
58 // Is the control focused?
\r
59 Control.prototype.focused = false;
\r
61 // Is the pointer over this control?
\r
62 Control.prototype.hovering = false;
\r
64 // The element hierarchy in a control is as follows:
\r
71 // The assembly element groups the portion of a control that typically handle
\r
72 // the visual effects for focus and hover states. Having a separate root and
\r
73 // assembly elements allows other elements to be added to a control without
\r
74 // them being affected by the CSS rules of the assembly element.
\r
76 // The assembly element of this control.
\r
77 Control.prototype.assemblyElement = null;
\r
79 // The caption of this control; null if none.
\r
80 Control.prototype.caption = null;
\r
82 // The caption element of this control.
\r
83 Control.prototype.captionElement = null;
\r
85 // The control element of this control.
\r
86 Control.prototype.controlElement = null;
\r
88 // Initializer - called from constructor.
\r
89 Control.prototype.init = function(id, caption) {
\r
90 uiLogger.debug("Control.init(" + id + ", " + caption + ")");
\r
92 // call superclass initializer
\r
93 UIElement.prototype.init.call(this, id);
\r
95 // create assembly, caption and control elements
\r
96 this.assemblyElement = document.createElement("div");
\r
97 this.captionElement = document.createElement("div");
\r
98 this.assemblyElement.appendChild(this.captionElement);
\r
99 this.controlElement = document.createElement("div");
\r
100 this.assemblyElement.appendChild(this.controlElement);
\r
101 this.rootElement.appendChild(this.assemblyElement);
\r
104 // style is not updated because the subclass will update the style later
\r
105 // when it has completely initialized the component
\r
106 this.setCaption(caption, true);
\r
109 // Returns the caption; null if none.
\r
110 Control.prototype.getCaption = function() {
\r
111 return this.caption;
\r
114 // Sets the caption; null if none.
\r
115 Control.prototype.setCaption = function(caption, noStyleUpdate) {
\r
116 uiLogger.debug("Control.setCaption(" + caption + ")");
\r
118 // set the display style
\r
119 this.captionElement.style.display = (caption == null) ? "none" : "block";
\r
122 this.caption = caption;
\r
123 this.captionElement.innerHTML = (caption == null) ? "" : caption;
\r
126 if (!noStyleUpdate) {
\r
127 this.updateStyleFromState();
\r
131 // Returns the enabled state.
\r
132 // Override this in subclasses as required to implement the state change.
\r
133 Control.prototype.isEnabled = function() {
\r
137 // Sets the enabled state.
\r
138 // Override this in subclasses as required to implement the state change.
\r
139 Control.prototype.setEnabled = function(enabled) {
\r
140 uiLogger.debug("Control.setEnabled(" + enabled + ")");
\r
143 // Returns the focusable state for the control.
\r
144 // Defaults focusable if enabled - override this in subclasses as required.
\r
145 Control.prototype.isFocusable = function() {
\r
146 return this.isEnabled();
\r
149 // Returns the focused state for the control.
\r
150 Control.prototype.isFocused = function() {
\r
151 return this.focused;
\r
154 // Sets the focused state for the control.
\r
155 // Note: This may not always succeed.
\r
156 // Override this in subclasses as required to implement the state change.
\r
157 Control.prototype.setFocused = function(focused) {
\r
158 uiLogger.debug("Control.setFocused(" + focused + ")");
\r
159 // note that this.focused gets set as a result of focusStateChanged() being called
\r
160 // rather than setting it explicitly here
\r
163 // Called when the focus state has changed for this control.
\r
164 Control.prototype.focusStateChanged = function(focused) {
\r
165 uiLogger.debug("Control.focusStateChanged(" + focused + ")");
\r
166 if (this.focused != focused) {
\r
167 this.focused = focused;
\r
169 // let the view know about the focus change
\r
170 if (this.view != null) {
\r
171 this.view.focusedControlChanged(focused ? this : null);
\r
174 // update the style from the current state
\r
175 this.updateStyleFromState();
\r
177 // notify event listeners
\r
178 this.fireEvent(this.createEvent("FocusStateChanged", focused));
\r
182 // Called when the hover state has changed for this control.
\r
183 Control.prototype.hoverStateChanged = function(hovering) {
\r
184 uiLogger.debug("Control.hoverStateChanged(" + hovering + ")");
\r
185 if (this.hovering != hovering) {
\r
186 this.hovering = hovering;
\r
188 // update the style from the current state
\r
189 this.updateStyleFromState();
\r
191 // notify event listeners
\r
192 this.fireEvent(this.createEvent("HoverStateChanged", hovering));
\r
196 // Helper method that returns the state name for the current state.
\r
197 Control.prototype.getStyleStateName = function() {
\r
198 var focusable = this.isFocusable();
\r
199 if (focusable && this.focused) {
\r
201 } else if (focusable && this.hovering) {
\r
203 } else if (!this.isEnabled()) {
\r
210 // Resets the state tracking for focus and hover.
\r
211 // Override this in subclasses as required to implement the state reset.
\r
212 Control.prototype.resetFocusState = function() {
\r
213 uiLogger.debug("Control.resetFocusState()");
\r
214 this.hovering = false;
\r
215 this.focused = false;
\r
216 this.updateStyleFromState();
\r
219 // Helper function that sets a classname for an element.
\r
220 // Only sets the class name if it actually is different from the current value.
\r
221 Control.prototype.setClassName = function(element, className) {
\r
222 if (element.className != className) {
\r
223 element.className = className;
\r
227 // Updates the style of the control to reflects the state of the control.
\r
228 // Override this in subclasses as required to implement the state change.
\r
229 Control.prototype.updateStyleFromState = function() {
\r
230 uiLogger.debug("Control.updateStyleFromState()");
\r