docs/source/Element.fx-more.html

   1 <html>\r
   2 <head>\r
   3   <title>The source code</title>\r
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   6 </head>\r
   7 <body  onload="prettyPrint();">\r
   8     <pre class="prettyprint lang-js">/**\r
   9  * @class Ext.Element\r
  10  */\r
  11 Ext.Element.addMethods(\r
  12 function(){\r
  13     var VISIBILITY = "visibility",\r
  14         DISPLAY = "display",\r
  15         HIDDEN = "hidden",\r
  16         NONE = "none",\r
  17             XMASKED = "x-masked",\r
  18                 XMASKEDRELATIVE = "x-masked-relative",\r
  19         data = Ext.Element.data;\r
  20                 \r
  21         return {\r
  22                 <div id="method-Ext.Element-isVisible"></div>/**\r
  23              * Checks whether the element is currently visible using both visibility and display properties.\r
  24              * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)\r
  25              * @return {Boolean} True if the element is currently visible, else false\r
  26              */\r
  27             isVisible : function(deep) {\r
  28                 var vis = !this.isStyle(VISIBILITY,HIDDEN) && !this.isStyle(DISPLAY,NONE),\r
  29                         p = this.dom.parentNode;\r
  30                 if(deep !== true || !vis){\r
  31                     return vis;\r
  32                 }               \r
  33                 while(p && !/body/i.test(p.tagName)){\r
  34                     if(!Ext.fly(p, '_isVisible').isVisible()){\r
  35                         return false;\r
  36                     }\r
  37                     p = p.parentNode;\r
  38                 }\r
  39                 return true;\r
  40             },\r
  41             \r
  42             <div id="method-Ext.Element-isDisplayed"></div>/**\r
  43              * Returns true if display is not "none"\r
  44              * @return {Boolean}\r
  45              */\r
  46             isDisplayed : function() {\r
  47                 return !this.isStyle(DISPLAY, NONE);\r
  48             },\r
  49             \r
  50                 <div id="method-Ext.Element-enableDisplayMode"></div>/**\r
  51              * Convenience method for setVisibilityMode(Element.DISPLAY)\r
  52              * @param {String} display (optional) What to set display to when visible\r
  53              * @return {Ext.Element} this\r
  54              */\r
  55             enableDisplayMode : function(display){          \r
  56                 this.setVisibilityMode(Ext.Element.DISPLAY);\r
  57                 if(!Ext.isEmpty(display)){\r
  58                 data(this.dom, 'originalDisplay', display);\r
  59             }\r
  60                 return this;\r
  61             },\r
  62             \r
  63                 <div id="method-Ext.Element-mask"></div>/**\r
  64              * Puts a mask over this element to disable user interaction. Requires core.css.\r
  65              * This method can only be applied to elements which accept child nodes.\r
  66              * @param {String} msg (optional) A message to display in the mask\r
  67              * @param {String} msgCls (optional) A css class to apply to the msg element\r
  68              * @return {Element} The mask element\r
  69              */\r
  70             mask : function(msg, msgCls){\r
  71                     var me = this,\r
  72                         dom = me.dom,\r
  73                         dh = Ext.DomHelper,\r
  74                         EXTELMASKMSG = "ext-el-mask-msg",\r
  75                 el, \r
  76                 mask;\r
  77                         \r
  78                 if(me.getStyle("position") == "static"){\r
  79                     me.addClass(XMASKEDRELATIVE);\r
  80                 }\r
  81                 if((el = data(dom, 'maskMsg'))){\r
  82                     el.remove();\r
  83                 }\r
  84                 if((el = data(dom, 'mask'))){\r
  85                     el.remove();\r
  86                 }\r
  87         \r
  88             mask = dh.append(dom, {cls : "ext-el-mask"}, true);\r
  89                 data(dom, 'mask', mask);\r
  90         \r
  91                 me.addClass(XMASKED);\r
  92                 mask.setDisplayed(true);\r
  93                 if(typeof msg == 'string'){\r
  94                 var mm = dh.append(dom, {cls : EXTELMASKMSG, cn:{tag:'div'}}, true);\r
  95                 data(dom, 'maskMsg', mm);\r
  96                     mm.dom.className = msgCls ? EXTELMASKMSG + " " + msgCls : EXTELMASKMSG;\r
  97                     mm.dom.firstChild.innerHTML = msg;\r
  98                     mm.setDisplayed(true);\r
  99                     mm.center(me);\r
 100                 }\r
 101                 if(Ext.isIE && !(Ext.isIE7 && Ext.isStrict) && me.getStyle('height') == 'auto'){ // ie will not expand full height automatically\r
 102                     mask.setSize(undefined, me.getHeight());\r
 103                 }\r
 104                 return mask;\r
 105             },\r
 106         \r
 107             <div id="method-Ext.Element-unmask"></div>/**\r
 108              * Removes a previously applied mask.\r
 109              */\r
 110             unmask : function(){\r
 111                     var me = this,\r
 112                 dom = me.dom,\r
 113                         mask = data(dom, 'mask'),\r
 114                         maskMsg = data(dom, 'maskMsg');\r
 115                 if(mask){\r
 116                     if(maskMsg){\r
 117                         maskMsg.remove();\r
 118                     data(dom, 'maskMsg', undefined);\r
 119                     }\r
 120                     mask.remove();\r
 121                 data(dom, 'mask', undefined);\r
 122                 }\r
 123                 me.removeClass([XMASKED, XMASKEDRELATIVE]);\r
 124             },\r
 125         \r
 126             <div id="method-Ext.Element-isMasked"></div>/**\r
 127              * Returns true if this element is masked\r
 128              * @return {Boolean}\r
 129              */\r
 130             isMasked : function(){\r
 131             var m = data(this.dom, 'mask');\r
 132                 return m && m.isVisible();\r
 133             },\r
 134             \r
 135             <div id="method-Ext.Element-createShim"></div>/**\r
 136              * Creates an iframe shim for this element to keep selects and other windowed objects from\r
 137              * showing through.\r
 138              * @return {Ext.Element} The new shim element\r
 139              */\r
 140             createShim : function(){\r
 141                 var el = document.createElement('iframe'),              \r
 142                         shim;\r
 143                 el.frameBorder = '0';\r
 144                 el.className = 'ext-shim';\r
 145                 if(Ext.isIE && Ext.isSecure){\r
 146                     el.src = Ext.SSL_SECURE_URL;\r
 147                 }\r
 148                 shim = Ext.get(this.dom.parentNode.insertBefore(el, this.dom));\r
 149                 shim.autoBoxAdjust = false;\r
 150                 return shim;\r
 151             }\r
 152     };\r
 153 }());</pre>    \r
 154 </body>\r
 155 </html>