webapps/qooxdoo-0.6.3-sdk/frontend/framework/source/class/qx/ui/basic/Atom.js

   1 /* ************************************************************************
   2
   3    qooxdoo - the new era of web development
   4
   5    http://qooxdoo.org
   6
   7    Copyright:
   8      2004-2006 by 1&1 Internet AG, Germany, http://www.1and1.org
   9
  10    License:
  11      LGPL 2.1: http://www.gnu.org/licenses/lgpl.html
  12
  13    Authors:
  14      * Sebastian Werner (wpbasti)
  15      * Andreas Ecker (ecker)
  16
  17 ************************************************************************ */
  18
  19 /* ************************************************************************
  20
  21 #module(ui_basic)
  22 #optional(qx.ui.embed.Flash)
  23
  24 ************************************************************************ */
  25
  26 /*!
  27   A multi-prupose widget used by many more complex widgets.
  28
  29   The intended purpose of qx.ui.basic.Atom is to easily align the common icon-text combination in different ways.
  30   This is useful for all types of buttons, menuentires, tooltips, ...
  31 */
  32 qx.OO.defineClass("qx.ui.basic.Atom", qx.ui.layout.BoxLayout,
  33 function(vLabel, vIcon, vIconWidth, vIconHeight, vFlash)
  34 {
  35   qx.ui.layout.BoxLayout.call(this);
  36
  37   if (this.getOrientation() == null) {
  38     this.setOrientation("horizontal");
  39   }
  40
  41   // Prohibit selection
  42   this.setSelectable(false);
  43
  44   // Disable flex support
  45   this.getLayoutImpl().setEnableFlexSupport(false);
  46
  47   // Apply constructor arguments
  48   if (qx.util.Validation.isValidString(vLabel)) {
  49     this.setLabel(vLabel);
  50   } else {
  51     this.setLabel("");
  52   }
  53
  54   // Simple flash wrapper
  55   if (qx.OO.isAvailable("qx.ui.embed.Flash") && qx.util.Validation.isValidString(vFlash) && qx.util.Validation.isValidNumber(vIconWidth) && qx.util.Validation.isValidNumber(vIconHeight) && qx.ui.embed.Flash.getPlayerVersion().getMajor() > 0)
  56   {
  57     this._flashMode = true;
  58
  59     this.setIcon(vFlash);
  60
  61     // flash needs explicit dimensions!
  62     this.setIconWidth(vIconWidth);
  63     this.setIconHeight(vIconHeight);
  64   }
  65   else if (qx.util.Validation.isValidString(vIcon))
  66   {
  67     this.setIcon(vIcon);
  68
  69     if (qx.util.Validation.isValidNumber(vIconWidth)) {
  70       this.setIconWidth(vIconWidth);
  71     }
  72
  73     if (qx.util.Validation.isValidNumber(vIconHeight)) {
  74       this.setIconHeight(vIconHeight);
  75     }
  76   }
  77 });
  78
  79 qx.ui.basic.Atom.SHOW_LABEL = "label";
  80 qx.ui.basic.Atom.SHOW_ICON = "icon";
  81 qx.ui.basic.Atom.SHOW_BOTH = "both";
  82
  83
  84 /*
  85 ---------------------------------------------------------------------------
  86   PROPERTIES
  87 ---------------------------------------------------------------------------
  88 */
  89
  90 /*!
  91   The label/caption/text of the qx.ui.basic.Atom instance
  92 */
  93 qx.OO.addProperty({ name : "label", type : "string" });
  94
  95 /*!
  96   Any URI String supported by qx.ui.basic.Image to display a icon
  97 */
  98 qx.OO.addProperty({ name : "icon", type : "string" });
  99
 100 /**
 101  * Any URI String supported by qx.ui.basic.Image to display a disabled icon.
 102  * <p>
 103  * If not set the normal icon is shown transparently.
 104  */
 105 qx.OO.addProperty({ name : "disabledIcon", type : "string" });
 106
 107 /*!
 108   Configure the visibility of the sub elements/widgets.
 109   Possible values: both, text, icon, none
 110 */
 111 qx.OO.addProperty({ name : "show", type : "string", defaultValue : "both", possibleValues : [ "both", "label", "icon", "none", null ] });
 112
 113 /*!
 114   The position of the icon in relation to the text.
 115   Only useful/needed if text and icon is configured and 'show' is configured as 'both' (default)
 116 */
 117 qx.OO.addProperty({ name : "iconPosition", type : "string", defaultValue : "left", possibleValues : [ "top", "right", "bottom", "left" ] });
 118
 119 /*!
 120   The width of the icon.
 121   If configured, this makes qx.ui.basic.Atom a little bit faster as it does not need to wait until the image loading is finished.
 122 */
 123 qx.OO.addProperty({ name : "iconWidth", type : "number" });
 124
 125 /*!
 126   The height of the icon
 127   If configured, this makes qx.ui.basic.Atom a little bit faster as it does not need to wait until the image loading is finished.
 128 */
 129 qx.OO.addProperty({ name : "iconHeight", type : "number" });
 130
 131 qx.OO.changeProperty({ name : "appearance", type : "string", defaultValue : "atom" });
 132
 133
 134
 135
 136
 137 /*
 138 ---------------------------------------------------------------------------
 139   SUB WIDGETS
 140 ---------------------------------------------------------------------------
 141 */
 142
 143 qx.Proto._flashMode = false;
 144
 145 qx.Proto._labelObject = null;
 146 qx.Proto._iconObject = null;
 147
 148 qx.Proto._createLabel = function()
 149 {
 150   var l = this._labelObject = new qx.ui.basic.Label(this.getLabel());
 151
 152   l.setAnonymous(true);
 153   l.setEnabled(this.getEnabled());
 154   l.setSelectable(false);
 155
 156   this.addAt(l, this._iconObject ? 1 : 0);
 157 }
 158
 159 qx.Proto._createIcon = function()
 160 {
 161   if (this._flashMode && qx.OO.isAvailable("qx.ui.embed.Flash"))
 162   {
 163     var i = this._iconObject = new qx.ui.embed.Flash(this.getIcon());
 164   }
 165   else
 166   {
 167     var i = this._iconObject = new qx.ui.basic.Image();
 168   }
 169
 170   i.setAnonymous(true);
 171
 172   this._updateIcon();
 173
 174   this.addAt(i, 0);
 175 }
 176
 177 qx.Proto._updateIcon = function() {
 178   // NOTE: We have to check whether the properties "icon" and "disabledIcon"
 179   //       exist, because some child classes remove them.
 180   if (this._iconObject && this.getIcon && this.getDisabledIcon) {
 181     var disabledIcon = this.getDisabledIcon();
 182     if (disabledIcon) {
 183       if (this.getEnabled()) {
 184         this._iconObject.setSource(this.getIcon());
 185       } else {
 186         this._iconObject.setSource(disabledIcon);
 187       }
 188       this._iconObject.setEnabled(true);
 189     } else {
 190       this._iconObject.setSource(this.getIcon());
 191       this._iconObject.setEnabled(this.getEnabled());
 192     }
 193   }
 194 }
 195
 196 qx.Proto.getLabelObject = function() {
 197   return this._labelObject;
 198 }
 199
 200 qx.Proto.getIconObject = function() {
 201   return this._iconObject;
 202 }
 203
 204
 205
 206
 207
 208
 209 /*
 210 ---------------------------------------------------------------------------
 211   MODIFIERS
 212 ---------------------------------------------------------------------------
 213 */
 214
 215 qx.Proto._modifyEnabled = function(propValue, propOldValue, propData)
 216 {
 217   this._updateIcon();
 218
 219   if (this._labelObject) {
 220     this._labelObject.setEnabled(propValue);
 221   }
 222
 223   return qx.ui.layout.BoxLayout.prototype._modifyEnabled.call(this, propValue, propOldValue, propData);
 224 }
 225
 226 qx.Proto._modifyIconPosition = function(propValue, propOldValue, propData)
 227 {
 228   switch(propValue)
 229   {
 230     case "top":
 231     case "bottom":
 232       this.setOrientation("vertical");
 233       this.setReverseChildrenOrder(propValue == "bottom");
 234       break;
 235
 236     default:
 237       this.setOrientation("horizontal");
 238       this.setReverseChildrenOrder(propValue == "right");
 239       break;
 240   }
 241
 242   return true;
 243 }
 244
 245 qx.Proto._modifyShow = function(propValue, propOldValue, propData)
 246 {
 247   this._handleIcon();
 248   this._handleLabel();
 249
 250   return true;
 251 }
 252
 253 qx.Proto._modifyLabel = function(propValue, propOldValue, propData)
 254 {
 255   if (this._labelObject) {
 256     this._labelObject.setHtml(propValue);
 257   }
 258
 259   this._handleLabel();
 260
 261   return true;
 262 }
 263
 264 qx.Proto._modifyIcon = function(propValue, propOldValue, propData)
 265 {
 266   this._updateIcon();
 267   this._handleIcon();
 268
 269   return true;
 270 }
 271
 272 qx.Proto._modifyDisabledIcon = function(propValue, propOldValue, propData)
 273 {
 274   this._updateIcon();
 275   this._handleIcon();
 276
 277   return true;
 278 }
 279
 280 qx.Proto._modifyIconWidth = function(propValue, propOldValue, propData)
 281 {
 282   this._iconObject.setWidth(propValue);
 283   return true;
 284 }
 285
 286 qx.Proto._modifyIconHeight = function(propValue, propOldValue, propData)
 287 {
 288   this._iconObject.setHeight(propValue);
 289   return true;
 290 }
 291
 292
 293
 294
 295
 296
 297 /*
 298 ---------------------------------------------------------------------------
 299   HANDLER
 300 ---------------------------------------------------------------------------
 301 */
 302
 303 qx.Proto._iconIsVisible = false;
 304 qx.Proto._labelIsVisible = false;
 305
 306 qx.Proto._handleLabel = function()
 307 {
 308   switch(this.getShow())
 309   {
 310     case qx.ui.basic.Atom.SHOW_LABEL:
 311     case qx.ui.basic.Atom.SHOW_BOTH:
 312       this._labelIsVisible = qx.util.Validation.isValidString(this.getLabel());
 313       break;
 314
 315     default:
 316       this._labelIsVisible = false;
 317   }
 318
 319   if (this._labelIsVisible)
 320   {
 321     this._labelObject ? this._labelObject.setDisplay(true) : this._createLabel();
 322   }
 323   else if (this._labelObject)
 324   {
 325     this._labelObject.setDisplay(false);
 326   }
 327 }
 328
 329 qx.Proto._handleIcon = function()
 330 {
 331   switch(this.getShow())
 332   {
 333     case qx.ui.basic.Atom.SHOW_ICON:
 334     case qx.ui.basic.Atom.SHOW_BOTH:
 335       this._iconIsVisible = qx.util.Validation.isValidString(this.getIcon());
 336       break;
 337
 338     default:
 339       this._iconIsVisible = false;
 340   }
 341
 342   if (this._iconIsVisible)
 343   {
 344     this._iconObject ? this._iconObject.setDisplay(true) : this._createIcon();
 345   }
 346   else if (this._iconObject)
 347   {
 348     this._iconObject.setDisplay(false);
 349   }
 350 }
 351
 352
 353
 354
 355
 356
 357 /*
 358 ---------------------------------------------------------------------------
 359   CLONE
 360 ---------------------------------------------------------------------------
 361 */
 362
 363 // Omit recursive cloning
 364 qx.Proto._cloneRecursive = qx.util.Return.returnTrue;
 365
 366
 367
 368
 369
 370
 371
 372 /*
 373 ---------------------------------------------------------------------------
 374   DISPOSER
 375 ---------------------------------------------------------------------------
 376 */
 377
 378 qx.Proto.dispose = function()
 379 {
 380   if (this.getDisposed()) {
 381     return true;
 382   }
 383
 384   if (this._iconObject)
 385   {
 386     this._iconObject.dispose();
 387     this._iconObject = null;
 388   }
 389
 390   if (this._labelObject)
 391   {
 392     this._labelObject.dispose();
 393     this._labelObject = null;
 394   }
 395
 396   return qx.ui.layout.BoxLayout.prototype.dispose.call(this);
 397 }