X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=Roo%2FElement.js;h=36d6dce660e9483ee4afc968f7e306e4ad2eaa27;hb=242e8cb7d4eb31741bfb8d282303ac36f54dd00e;hp=d736cd453d4162996cc090334c2cb6930b18c8f7;hpb=c48ce820aa4e215a5e32a75363014aa3cf01cb55;p=roojs1 diff --git a/Roo/Element.js b/Roo/Element.js index d736cd453d..36d6dce660 100644 --- a/Roo/Element.js +++ b/Roo/Element.js @@ -113,12 +113,14 @@ if(opt.anim.isAnimated()){ El.prototype = { /** - * The element's default display mode (defaults to "") + * The element's default display mode (defaults to "") * @type String */ originalDisplay : "", - visibilityMode : 1, + + // note this is overridden in BS version.. + visibilityMode : 1, /** * The default unit to append to CSS values where a unit isn't provided (defaults to px). * @type String @@ -188,42 +190,32 @@ if(opt.anim.isAnimated()){ /** * Looks at the scrollable parent element */ - findScrollableParent : function(){ + findScrollableParent : function() + { + var overflowRegex = /(auto|scroll)/; - var el = Roo.get(this.dom.parentNode); -// Roo.log('D: '+JSON.stringify(D, null, 4)); - Roo.log(el); - while ( - el && - ( - !el.isScrollable() || - ( - el.isScrollable() && - ( - D.getViewHeight() - el.dom.clientHeight > 15 || - D.getViewWidth() - el.dom.clientWidth > 15 - ) - ) - ) && - el.dom.nodeName.toLowerCase() != 'body' - ){ - el = Roo.get(el.dom.parentNode); -// Roo.log( -// 'findparent:'+ JSON.stringify(el, null, 4)+ -// ' | scrollable: '+el.isScrollable()+ -// ' | D height: '+D.getViewHeight() + -// ' | D width: '+D.getViewWidth() + -// ' | el height: '+el.dom.clientHeight+ -// ' | el width: '+el.dom.clientWidth+ -// ' | id: '+el.id -// ); + if(this.getStyle('position') === 'fixed'){ + return Roo.isAndroid ? Roo.get(document.documentElement) : Roo.get(document.body); } - if(!el.isScrollable()){ - return null; + var excludeStaticParent = this.getStyle('position') === "absolute"; + + for (var parent = this; (parent = Roo.get(parent.dom.parentNode));){ + + if (excludeStaticParent && parent.getStyle('position') === "static") { + continue; + } + + if (overflowRegex.test(parent.getStyle('overflow') + parent.getStyle('overflow-x') + parent.getStyle('overflow-y'))){ + return parent; + } + + if(parent.dom.nodeName.toLowerCase() == 'body'){ + return Roo.isAndroid ? Roo.get(document.documentElement) : Roo.get(document.body); + } } - return el; + return Roo.isAndroid ? Roo.get(document.documentElement) : Roo.get(document.body); }, /** @@ -622,7 +614,11 @@ if(opt.anim.isAnimated()){ } }else{ if(className && !this.hasClass(className)){ - this.dom.className = this.dom.className + " " + className; + if (this.dom instanceof SVGElement) { + this.dom.className.baseVal =this.dom.className.baseVal + " " + className; + } else { + this.dom.className = this.dom.className + " " + className; + } } } return this; @@ -651,7 +647,9 @@ if(opt.anim.isAnimated()){ * @return {Roo.Element} this */ removeClass : function(className){ - if(!className || !this.dom.className){ + + var cn = this.dom instanceof SVGElement ? this.dom.className.baseVal : this.dom.className; + if(!className || !cn){ return this; } if(className instanceof Array){ @@ -665,8 +663,11 @@ if(opt.anim.isAnimated()){ re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)', "g"); this.classReCache[className] = re; } - this.dom.className = - this.dom.className.replace(re, " "); + if (this.dom instanceof SVGElement) { + this.dom.className.baseVal = cn.replace(re, " "); + } else { + this.dom.className = cn.replace(re, " "); + } } } return this; @@ -695,6 +696,9 @@ if(opt.anim.isAnimated()){ * @return {Boolean} True if the class exists, else false */ hasClass : function(className){ + if (this.dom instanceof SVGElement) { + return className && (' '+this.dom.className.baseVal +' ').indexOf(' '+className+' ') != -1; + } return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1; }, @@ -1180,7 +1184,32 @@ if(opt.anim.isAnimated()){ if (this.dom) { Roo.EventManager.on(this.dom, eventName, fn, scope || this, options); } + if (eventName == 'dblclick') { + this.addListener('touchstart', this.onTapHandler, this); + } }, + tapedTwice : false, + onTapHandler : function(event) + { + if(!this.tapedTwice) { + this.tapedTwice = true; + var s = this; + setTimeout( function() { + s.tapedTwice = false; + }, 300 ); + return; + } + event.preventDefault(); + var revent = new MouseEvent('dblclick', { + view: window, + bubbles: true, + cancelable: true + }); + + this.dom.dispatchEvent(revent); + //action on double tap goes below + + }, /** * Removes an event handler from this element @@ -1556,7 +1585,8 @@ if(opt.anim.isAnimated()){ * @param {Array} offsets (optional) Offset the positioning by [x, y] * @return {Array} [x, y] */ - getAlignToXY : function(el, p, o){ + getAlignToXY : function(el, p, o) + { el = Roo.get(el); var d = this.dom; if(!el.dom){ @@ -1597,7 +1627,7 @@ if(opt.anim.isAnimated()){ //otherwise swap the aligned el to the opposite border of the target. var p1y = p1.charAt(0), p1x = p1.charAt(p1.length-1); var p2y = p2.charAt(0), p2x = p2.charAt(p2.length-1); - var swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t")); + var swapY = ((p1y=="t" && p2y=="b") || (p1y=="b" && p2y=="t") ); var swapX = ((p1x=="r" && p2x=="l") || (p1x=="l" && p2x=="r")); var doc = document; @@ -2122,6 +2152,7 @@ if(opt.anim.isAnimated()){ if(!this._mask){ this._mask = Roo.DomHelper.append(this.dom, {cls:"roo-el-mask"}, true); } + this.addClass("x-masked"); this._mask.setDisplayed(true); @@ -2143,12 +2174,23 @@ if(opt.anim.isAnimated()){ if(typeof msg == 'string'){ if(!this._maskMsg){ - this._maskMsg = Roo.DomHelper.append(this.dom, {cls:"roo-el-mask-msg", cn:{tag:'div'}}, true); + this._maskMsg = Roo.DomHelper.append(this.dom, { + cls: "roo-el-mask-msg", + cn: [ + { + tag: 'i', + cls: 'fa fa-spinner fa-spin' + }, + { + tag: 'div' + } + ] + }, true); } var mm = this._maskMsg; mm.dom.className = msgCls ? "roo-el-mask-msg " + msgCls : "roo-el-mask-msg"; - if (mm.dom.firstChild) { // weird IE issue? - mm.dom.firstChild.innerHTML = msg; + if (mm.dom.lastChild) { // weird IE issue? + mm.dom.lastChild.innerHTML = msg; } mm.setDisplayed(true); mm.center(this); @@ -2299,7 +2341,7 @@ if(opt.anim.isAnimated()){ /** * @private */ - fitToParentDelegate : Roo.emptyFn, // keep a reference to the fitToParent delegate + fitToParentDelegate : Roo.emptyFn, // keep a reference to the fitToParent delegate /** * Sizes this element to its parent element's dimensions performing