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