1 /*

     2 � Copyright 2008 Nokia Corporation. All rights reserved.

     3 

     4 IMPORTANT:  The Nokia software ("WRTKit and Example Widget files") is supplied to you by Nokia

     5 Corporation (�Nokia�) in consideration of your agreement to the following terms. Your use, installation

     6 and/or redistribution of the WRTKit and Example Widget files constitutes acceptance of these terms. If

     7 you do not agree with these terms, please do not use, install, or redistribute the WRTKit and Example

     8 Widget files.

     9 

    10 In consideration of your agreement to abide by the following terms, and subject to these terms, Nokia

    11 grants you a personal, non-exclusive license, under Nokia�s copyrights in the WRTKit and Example

    12 Widget files, to use, reproduce, and redistribute the WRTKit and Example files, in text form (for HTML,

    13 CSS, or JavaScript files) or binary form (for associated images), for the sole purpose of creating S60

    14 Widgets.

    15 

    16 If you redistribute the WRTKit and Example files, you must retain this entire notice in all such

    17 redistributions of the WRTKit and Example files.

    18 

    19 You may not use the name, trademarks, service marks or logos of Nokia to endorse or promote products

    20 that include the WRTKit and Example files without the prior written explicit agreement with Nokia.

    21 Except as expressly stated in this notice, no other rights or licenses, express or implied, are granted by

    22 Nokia herein, including but not limited to any patent rights that may be infringed by your products that

    23 incorporate the WRTKit and Example files or by other works in which the WRTKit and Example files

    24 may be incorporated.

    25 

    26 The WRTKit and Example files are provided on an "AS IS" basis.  NOKIA MAKES NO

    27 WARRANTIES, EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED

    28 WARRANTIES OF NON-INFRINGEMENT, MERCHANTABILITY AND FITNESS FOR A

    29 PARTICULAR PURPOSE, REGARDING THE EXAMPLES OR ITS USE AND OPERATION

    30 ALONE OR IN COMBINATION WITH YOUR PRODUCTS.

    31 

    32 IN NO EVENT SHALL NOKIA BE LIABLE FOR ANY SPECIAL, INDIRECT, INCIDENTAL OR

    33 CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF

    34 SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS

    35 INTERRUPTION) ARISING IN ANY WAY OUT OF THE USE, REPRODUCTION, AND/OR

    36 DISTRIBUTION OF THE EXAMPLES, HOWEVER CAUSED AND WHETHER UNDER THEORY

    37 OF CONTRACT, TORT (INCLUDING NEGLIGENCE), STRICT LIABILITY OR OTHERWISE,

    38 EVEN IF NOKIA HAS BEEN ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

    39 

    40 */

    41 

    42 ///////////////////////////////////////////////////////////////////////////////

    43 // The NavigationButton class implements a button control for use in

    44 // navigational contexts in menu-style UIs.

    45 

    46 // Constructor.

    47 function NavigationButton(id, image, text) {

    48     if (id != UI_NO_INIT_ID) {

    49         this.init(id, image, text);

    50     }

    51 }

    52 

    53 // NavigationButton inherits from ActionControl.

    54 NavigationButton.prototype = new ActionControl(UI_NO_INIT_ID);

    55 

    56 // Button table element.

    57 NavigationButton.prototype.tableElement = null;

    58 

    59 // Button table row element.

    60 NavigationButton.prototype.tableRowElement = null;

    61 

    62 // Button table left cell element.

    63 NavigationButton.prototype.tableLeftCellElement = null;

    64 

    65 // Button table right cell element.

    66 NavigationButton.prototype.tableRightCellElement = null;

    67 

    68 // Button image element.

    69 NavigationButton.prototype.imageElement = null;

    70 

    71 // Button link element.

    72 NavigationButton.prototype.linkElement = null;

    73 

    74 // Button text element.

    75 NavigationButton.prototype.textElement = null;

    76 

    77 // Initializer - called from constructor.

    78 NavigationButton.prototype.init = function(id, image, text) {

    79     uiLogger.debug("NavigationButton.init(" + id + ", " + image + ", " + text + ")");

    80     

    81     // call superclass initializer

    82     ActionControl.prototype.init.call(this, id, null);

    83     

    84     // remove caption element

    85     this.assemblyElement.removeChild(this.captionElement);

    86     

    87     // construct the button

    88     this.buttonElement = document.createElement("div");

    89     this.tableElement = document.createElement("table");

    90     this.tableRowElement = document.createElement("tr");

    91     this.tableLeftCellElement = document.createElement("td");

    92     this.tableRightCellElement = document.createElement("td");

    93     this.imageElement = null;

    94     this.linkElement = document.createElement("a");

    95     this.linkElement.href = "JavaScript:void(0)";

    96     this.textElement = document.createElement("span");

    97     this.tableElement.appendChild(this.tableRowElement);

    98     this.tableRowElement.appendChild(this.tableLeftCellElement);

    99     this.tableRowElement.appendChild(this.tableRightCellElement);

   100     this.tableRightCellElement.appendChild(this.linkElement);

   101     this.linkElement.appendChild(this.textElement);

   102     this.buttonElement.appendChild(this.tableElement);

   103     this.controlElement.appendChild(this.buttonElement);

   104     

   105     // set the image and text

   106     this.setImage(image);

   107     this.setText(text);

   108     

   109     // bind event listeners

   110     this.bindActionControlListeners();

   111     

   112     // update the style

   113     this.updateStyleFromState();

   114 }

   115 

   116 // Sets the enabled state.

   117 NavigationButton.prototype.setEnabled = function(enabled) {

   118     uiLogger.debug("NavigationButton.setEnabled(" + enabled + ")");

   119     

   120     // bail out early if there is no change in state

   121     if (this.enabled == enabled) {

   122         return;

   123     }

   124     

   125     // set the enabled state

   126     this.enabled = enabled;

   127     

   128     if (this.enabled) {

   129         // diabled -> enabled

   130         this.tableRightCellElement.removeChild(this.textElement);

   131         this.tableRightCellElement.appendChild(this.linkElement);

   132         this.linkElement.appendChild(this.textElement);

   133     } else {

   134         // enabled -> diabled

   135         this.linkElement.removeChild(this.textElement);

   136         this.tableRightCellElement.removeChild(this.linkElement);

   137         this.tableRightCellElement.appendChild(this.textElement);

   138     }

   139     

   140     // update the style

   141     this.updateStyleFromState();

   142 }

   143 

   144 // Returns the button image (URL); null if none.

   145 NavigationButton.prototype.getImage = function() {

   146     return (this.imageElement != null) ? this.imageElement.src : null;

   147 }

   148 

   149 // Sets the button image (URL); null if none.

   150 NavigationButton.prototype.setImage = function(image) {

   151     uiLogger.debug("NavigationButton.setImage(" + image + ")");

   152     

   153     if (image == null) {

   154         // remove image - if any

   155         if (this.imageElement != null) {

   156             this.tableLeftCellElement.removeChild(this.imageElement);

   157         }

   158     } else {

   159         // default to not append image element

   160         var append = false;

   161         

   162         // create image element if one doesn't exist

   163         if (this.imageElement == null) {

   164             this.imageElement = document.createElement("img");

   165             this.imageElement.setAttribute("alt", "");

   166             append = true;

   167         }

   168         

   169         // set image source URL

   170         this.imageElement.src = image;

   171         

   172         // append the image element to the left cell?

   173         if (append) {

   174             this.tableLeftCellElement.appendChild(this.imageElement);

   175         }

   176     }

   177 }

   178 

   179 // Returns the button text.

   180 NavigationButton.prototype.getText = function() {

   181     return this.textElement.innerHTML;

   182 }

   183 

   184 // Sets the button text.

   185 NavigationButton.prototype.setText = function(text) {

   186     uiLogger.debug("NavigationButton.setText(" + text + ")");

   187     this.textElement.innerHTML = (text == null) ? "" : text;;

   188 }

   189 

   190 // Updates the style of the control to reflects the state of the control.

   191 NavigationButton.prototype.updateStyleFromState = function() {

   192     uiLogger.debug("NavigationButton.updateStyleFromState()");

   193     

   194     // determine the state name

   195     var stateName = this.getStyleStateName();

   196     

   197     // set root element class name

   198     this.setClassName(this.rootElement, "Control");

   199     

   200     // set the control assembly class names

   201     this.setClassName(this.assemblyElement, "ControlAssembly ControlAssembly" + stateName);

   202     

   203     // control element

   204     this.setClassName(this.controlElement, "ControlElement NavigationButtonControlElement");

   205     

   206     // set the button table class names

   207     this.setClassName(this.buttonElement, "NavigationButton");

   208     this.setClassName(this.tableElement, "NavigationButtonTable");

   209     this.setClassName(this.tableRowElement, "NavigationButtonRow");

   210     this.setClassName(this.tableLeftCellElement, "NavigationButtonImageCell");

   211     this.setClassName(this.tableRightCellElement, "NavigationButtonTextCell");

   212     

   213     // set image class names

   214     if (this.imageElement) {

   215         this.setClassName(this.imageElement, "NavigationButtonImage");

   216     }

   217     

   218     // set the button text class name

   219     this.setClassName(this.textElement, "NavigationButtonText NavigationButtonText" + stateName);

   220 }