git.maemo.org Git - ptas/blob - zouba/wrt/WRTKit/UI/NavigationButton.js

   1 /*\r
   2 � Copyright 2008 Nokia Corporation. All rights reserved.\r
   3 \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
   8 Widget files.\r
   9 \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
  14 Widgets.\r
  15 \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
  18 \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
  25 \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
  31 \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
  39 \r
  40 */\r
  41 \r
  42 ///////////////////////////////////////////////////////////////////////////////\r
  43 // The NavigationButton class implements a button control for use in\r
  44 // navigational contexts in menu-style UIs.\r
  45 \r
  46 // Constructor.\r
  47 function NavigationButton(id, image, text) {\r
  48     if (id != UI_NO_INIT_ID) {\r
  49         this.init(id, image, text);\r
  50     }\r
  51 }\r
  52 \r
  53 // NavigationButton inherits from ActionControl.\r
  54 NavigationButton.prototype = new ActionControl(UI_NO_INIT_ID);\r
  55 \r
  56 // Button table element.\r
  57 NavigationButton.prototype.tableElement = null;\r
  58 \r
  59 // Button table row element.\r
  60 NavigationButton.prototype.tableRowElement = null;\r
  61 \r
  62 // Button table left cell element.\r
  63 NavigationButton.prototype.tableLeftCellElement = null;\r
  64 \r
  65 // Button table right cell element.\r
  66 NavigationButton.prototype.tableRightCellElement = null;\r
  67 \r
  68 // Button image element.\r
  69 NavigationButton.prototype.imageElement = null;\r
  70 \r
  71 // Button link element.\r
  72 NavigationButton.prototype.linkElement = null;\r
  73 \r
  74 // Button text element.\r
  75 NavigationButton.prototype.textElement = null;\r
  76 \r
  77 // Initializer - called from constructor.\r
  78 NavigationButton.prototype.init = function(id, image, text) {\r
  79     uiLogger.debug("NavigationButton.init(" + id + ", " + image + ", " + text + ")");\r
  80     \r
  81     // call superclass initializer\r
  82     ActionControl.prototype.init.call(this, id, null);\r
  83     \r
  84     // remove caption element\r
  85     this.assemblyElement.removeChild(this.captionElement);\r
  86     \r
  87     // construct the button\r
  88     this.buttonElement = document.createElement("div");\r
  89     this.tableElement = document.createElement("table");\r
  90     this.tableRowElement = document.createElement("tr");\r
  91     this.tableLeftCellElement = document.createElement("td");\r
  92     this.tableRightCellElement = document.createElement("td");\r
  93     this.imageElement = null;\r
  94     this.linkElement = document.createElement("a");\r
  95     this.linkElement.href = "JavaScript:void(0)";\r
  96     this.textElement = document.createElement("span");\r
  97     this.tableElement.appendChild(this.tableRowElement);\r
  98     this.tableRowElement.appendChild(this.tableLeftCellElement);\r
  99     this.tableRowElement.appendChild(this.tableRightCellElement);\r
 100     this.tableRightCellElement.appendChild(this.linkElement);\r
 101     this.linkElement.appendChild(this.textElement);\r
 102     this.buttonElement.appendChild(this.tableElement);\r
 103     this.controlElement.appendChild(this.buttonElement);\r
 104     \r
 105     // set the image and text\r
 106     this.setImage(image);\r
 107     this.setText(text);\r
 108     \r
 109     // bind event listeners\r
 110     this.bindActionControlListeners();\r
 111     \r
 112     // update the style\r
 113     this.updateStyleFromState();\r
 114 }\r
 115 \r
 116 // Sets the enabled state.\r
 117 NavigationButton.prototype.setEnabled = function(enabled) {\r
 118     uiLogger.debug("NavigationButton.setEnabled(" + enabled + ")");\r
 119     \r
 120     // bail out early if there is no change in state\r
 121     if (this.enabled == enabled) {\r
 122         return;\r
 123     }\r
 124     \r
 125     // set the enabled state\r
 126     this.enabled = enabled;\r
 127     \r
 128     if (this.enabled) {\r
 129         // diabled -> enabled\r
 130         this.tableRightCellElement.removeChild(this.textElement);\r
 131         this.tableRightCellElement.appendChild(this.linkElement);\r
 132         this.linkElement.appendChild(this.textElement);\r
 133     } else {\r
 134         // enabled -> diabled\r
 135         this.linkElement.removeChild(this.textElement);\r
 136         this.tableRightCellElement.removeChild(this.linkElement);\r
 137         this.tableRightCellElement.appendChild(this.textElement);\r
 138     }\r
 139     \r
 140     // update the style\r
 141     this.updateStyleFromState();\r
 142 }\r
 143 \r
 144 // Returns the button image (URL); null if none.\r
 145 NavigationButton.prototype.getImage = function() {\r
 146     return (this.imageElement != null) ? this.imageElement.src : null;\r
 147 }\r
 148 \r
 149 // Sets the button image (URL); null if none.\r
 150 NavigationButton.prototype.setImage = function(image) {\r
 151     uiLogger.debug("NavigationButton.setImage(" + image + ")");\r
 152     \r
 153     if (image == null) {\r
 154         // remove image - if any\r
 155         if (this.imageElement != null) {\r
 156             this.tableLeftCellElement.removeChild(this.imageElement);\r
 157         }\r
 158     } else {\r
 159         // default to not append image element\r
 160         var append = false;\r
 161         \r
 162         // create image element if one doesn't exist\r
 163         if (this.imageElement == null) {\r
 164             this.imageElement = document.createElement("img");\r
 165             this.imageElement.setAttribute("alt", "");\r
 166             append = true;\r
 167         }\r
 168         \r
 169         // set image source URL\r
 170         this.imageElement.src = image;\r
 171         \r
 172         // append the image element to the left cell?\r
 173         if (append) {\r
 174             this.tableLeftCellElement.appendChild(this.imageElement);\r
 175         }\r
 176     }\r
 177 }\r
 178 \r
 179 // Returns the button text.\r
 180 NavigationButton.prototype.getText = function() {\r
 181     return this.textElement.innerHTML;\r
 182 }\r
 183 \r
 184 // Sets the button text.\r
 185 NavigationButton.prototype.setText = function(text) {\r
 186     uiLogger.debug("NavigationButton.setText(" + text + ")");\r
 187     this.textElement.innerHTML = (text == null) ? "" : text;;\r
 188 }\r
 189 \r
 190 // Updates the style of the control to reflects the state of the control.\r
 191 NavigationButton.prototype.updateStyleFromState = function() {\r
 192     uiLogger.debug("NavigationButton.updateStyleFromState()");\r
 193     \r
 194     // determine the state name\r
 195     var stateName = this.getStyleStateName();\r
 196     \r
 197     // set root element class name\r
 198     this.setClassName(this.rootElement, "Control");\r
 199     \r
 200     // set the control assembly class names\r
 201     this.setClassName(this.assemblyElement, "ControlAssembly ControlAssembly" + stateName);\r
 202     \r
 203     // control element\r
 204     this.setClassName(this.controlElement, "ControlElement NavigationButtonControlElement");\r
 205     \r
 206     // set the button table class names\r
 207     this.setClassName(this.buttonElement, "NavigationButton");\r
 208     this.setClassName(this.tableElement, "NavigationButtonTable");\r
 209     this.setClassName(this.tableRowElement, "NavigationButtonRow");\r
 210     this.setClassName(this.tableLeftCellElement, "NavigationButtonImageCell");\r
 211     this.setClassName(this.tableRightCellElement, "NavigationButtonTextCell");\r
 212     \r
 213     // set image class names\r
 214     if (this.imageElement) {\r
 215         this.setClassName(this.imageElement, "NavigationButtonImage");\r
 216     }\r
 217     \r
 218     // set the button text class name\r
 219     this.setClassName(this.textElement, "NavigationButtonText NavigationButtonText" + stateName);\r
 220 }\r