roojs-bootstrap.js

roojs-bootstrap-debug.js

diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js
index caa966a..a4b139d 100644 (file)
--- a/roojs-bootstrap-debug.js
+++ b/roojs-bootstrap-debug.js
@@ -7968,6 +7968,8 @@ Roo.apply(Roo.bootstrap.Form, {
     
     popover : {
         
+        padding : 5,
+        
         isApplied : false,
         
         isMasked : false,
@@ -7976,18 +7978,30 @@ Roo.apply(Roo.bootstrap.Form, {
         
         target : false,
         
-        oIndex : false,
-        
         toolTip : false,
         
         intervalID : false,
-    
+        
+        maskEl : false,
+        
         apply : function()
         {
             if(this.isApplied){
                 return;
             }
             
+            this.maskEl = {
+                top : Roo.DomHelper.append(Roo.get(document.body), { tag: "div", cls:"x-dlg-mask roo-form-top-mask" }, true),
+                left : Roo.DomHelper.append(Roo.get(document.body), { tag: "div", cls:"x-dlg-mask roo-form-left-mask" }, true),
+                bottom : Roo.DomHelper.append(Roo.get(document.body), { tag: "div", cls:"x-dlg-mask roo-form-bottom-mask" }, true),
+                right : Roo.DomHelper.append(Roo.get(document.body), { tag: "div", cls:"x-dlg-mask roo-form-right-mask" }, true)
+            };
+            
+            this.maskEl.top.enableDisplayMode("block");
+            this.maskEl.left.enableDisplayMode("block");
+            this.maskEl.bottom.enableDisplayMode("block");
+            this.maskEl.right.enableDisplayMode("block");
+            
             this.toolTip = new Roo.bootstrap.Tooltip({
                 cls : 'roo-form-error-popover',
                 alignment : {
@@ -8000,7 +8014,7 @@ Roo.apply(Roo.bootstrap.Form, {
             
             this.toolTip.render(Roo.get(document.body));
 
-            this.toolTip.el.setVisibilityMode(Roo.Element.DISPLAY);
+            this.toolTip.el.enableDisplayMode("block");
             
             Roo.get(document.body).on('click', function(){
                 this.unmask();
@@ -8019,12 +8033,6 @@ Roo.apply(Roo.bootstrap.Form, {
                 return;
             }
             
-            this.oIndex = target.el.getStyle('z-index');
-            
-            this.target.el.setStyle('z-index', Roo.bootstrap.Modal.zIndex++);
-        
-            this.target.el.addClass('roo-invalid-outline');
-            
             var scrollable = this.target.el.findScrollableParent() || this.target.el.findParent('div.modal', 100, true) || Roo.get(document.body);
             
             var scrolled = scrollable.getScroll();
@@ -8041,6 +8049,25 @@ Roo.apply(Roo.bootstrap.Form, {
             
             scrollable.scrollTo('top', scrollTo);
             
+            var box = this.target.el.getBox();
+            
+            this.maskEl.top.setSize(Roo.lib.Dom.getDocumentWidth(), box.y - this.padding);
+            this.maskEl.top.setXY([0, 0]);
+            this.maskEl.top.show();
+            
+            this.maskEl.left.setSize(Roo.lib.Dom.getDocumentWidth() - box.right - this.padding, box.height + this.padding * 2);
+            this.maskEl.left.setXY([box.right + this.padding, box.y - this.padding]);
+            this.maskEl.left.show();
+            
+            this.maskEl.bottom.setSize(Roo.lib.Dom.getDocumentWidth(), Roo.lib.Dom.getDocumentHeight() - box.bottom - this.padding);
+            this.maskEl.bottom.setXY([0, box.bottom + this.padding]);
+            this.maskEl.bottom.show();
+            
+            this.maskEl.right.setSize(box.x - this.padding, box.height + this.padding * 2);
+            this.maskEl.right.setXY([0, box.y - this.padding]);
+            this.maskEl.right.show();
+            
+            
             this.toolTip.bindEl = this.target.el;
         
             this.toolTip.el.setStyle('z-index', Roo.bootstrap.Modal.zIndex++);
@@ -8055,7 +8082,7 @@ Roo.apply(Roo.bootstrap.Form, {
             
             this.intervalID = window.setInterval(function() {
                 Roo.bootstrap.Form.popover.unmask();
-            }, 100000);
+            }, 10000);
 
             window.onwheel = function(){ return false;};
             
@@ -8069,11 +8096,10 @@ Roo.apply(Roo.bootstrap.Form, {
                 return;
             }
             
-            if(this.oIndex){
-                this.target.el.setStyle('z-index', this.oIndex);
-            }
-            
-            this.target.el.removeClass('roo-invalid-outline');
+            this.maskEl.top.setSize(0, 0).setXY([0, 0]).hide();
+            this.maskEl.left.setSize(0, 0).setXY([0, 0]).hide();
+            this.maskEl.bottom.setSize(0, 0).setXY([0, 0]).hide();
+            this.maskEl.right.setSize(0, 0).setXY([0, 0]).hide();
             
             this.toolTip.hide();
             

diff --git a/roojs-bootstrap.js b/roojs-bootstrap.js
index c76dc61..89d5cf9 100644 (file)
--- a/roojs-bootstrap.js
+++ b/roojs-bootstrap.js
@@ -314,14 +314,18 @@ sd[C.displayField]=typeof(A[C.name])=='undefined'?'':A[C.name];C.setFromData(sd)
 }return Roo.urlDecode(fs);},getFieldValues:function(A){var B=this.getItems();var C={};B.each(function(f){if(!f.getName()){return;}var v=f.getValue();if(f.inputType=='radio'){if(typeof(C[f.getName()])=='undefined'){C[f.getName()]='';}if(!f.el.dom.checked){return;
 }v=f.el.dom.value;}if((typeof(v)=='object')&&f.getRawValue){v=f.getRawValue();}if(f.name!==false&&f.name!=''&&f.name!=f.getName()){C[f.name]=f.getRawValue();}C[f.getName()]=v;});return C;},clearInvalid:function(){var A=this.getItems();A.each(function(f){f.clearInvalid();
 });return this;},reset:function(){var A=this.getItems();A.each(function(f){f.reset();});Roo.each(this.childForms||[],function(f){f.reset();});return this;},getItems:function(){var r=new Roo.util.MixedCollection(false,function(o){return o.id||(o.id=Roo.id());
-});var A=function(el){if(el.inputEl){r.add(el);}if(!el.items){return;}Roo.each(el.items,function(e){A(e);});};A(this);return r;}});Roo.apply(Roo.bootstrap.Form,{popover:{isApplied:false,isMasked:false,form:false,target:false,oIndex:false,toolTip:false,intervalID:false,apply:function(){if(this.isApplied){return;
-}this.toolTip=new Roo.bootstrap.Tooltip({cls:'roo-form-error-popover',alignment:{'left':['r-l',[-2,0],'right'],'right':['l-r',[2,0],'left'],'bottom':['tl-bl',[0,2],'top'],'top':['bl-tl',[0,-2],'bottom']}});this.toolTip.render(Roo.get(document.body));this.toolTip.el.setVisibilityMode(Roo.Element.DISPLAY);
-Roo.get(document.body).on('click',function(){this.unmask();},this);this.isApplied=true},mask:function(A,B){this.form=A;this.target=B;if(!this.form.errorMask||!B.el){return;}this.oIndex=B.el.getStyle('z-index');this.target.el.setStyle('z-index',Roo.bootstrap.Modal.zIndex++);
-this.target.el.addClass('roo-invalid-outline');var C=this.target.el.findScrollableParent()||this.target.el.findParent('div.modal',100,true)||Roo.get(document.body);var D=C.getScroll();var ot=this.target.el.calcOffsetsTo(C);var E=0;if(ot[1]<=D.top){E=ot[1]-100;
-}else{E=ot[1]+Roo.lib.Dom.getViewHeight()-100;}C.scrollTo('top',E);this.toolTip.bindEl=this.target.el;this.toolTip.el.setStyle('z-index',Roo.bootstrap.Modal.zIndex++);var F=this.target.blankText;if(this.target.getValue()!==''&&this.target.regexText.length){F=this.target.regexText;
-}this.toolTip.show(F);this.intervalID=window.setInterval(function(){Roo.bootstrap.Form.popover.unmask();},100000);window.onwheel=function(){return false;};(function(){this.isMasked=true;}).defer(500,this);},unmask:function(){if(!this.isApplied||!this.isMasked||!this.form||!this.target||!this.form.errorMask){return;
-}if(this.oIndex){this.target.el.setStyle('z-index',this.oIndex);}this.target.el.removeClass('roo-invalid-outline');this.toolTip.hide();this.toolTip.el.hide();window.onwheel=function(){return true;};if(this.intervalID){window.clearInterval(this.intervalID);
-this.intervalID=false;}this.isMasked=false;}}});
+});var A=function(el){if(el.inputEl){r.add(el);}if(!el.items){return;}Roo.each(el.items,function(e){A(e);});};A(this);return r;}});Roo.apply(Roo.bootstrap.Form,{popover:{padding:5,isApplied:false,isMasked:false,form:false,target:false,toolTip:false,intervalID:false,maskEl:false,apply:function(){if(this.isApplied){return;
+}this.maskEl={top:Roo.DomHelper.append(Roo.get(document.body),{tag:"div",cls:"x-dlg-mask roo-form-top-mask"},true),left:Roo.DomHelper.append(Roo.get(document.body),{tag:"div",cls:"x-dlg-mask roo-form-left-mask"},true),bottom:Roo.DomHelper.append(Roo.get(document.body),{tag:"div",cls:"x-dlg-mask roo-form-bottom-mask"}
+,true),right:Roo.DomHelper.append(Roo.get(document.body),{tag:"div",cls:"x-dlg-mask roo-form-right-mask"},true)};this.maskEl.top.enableDisplayMode("block");this.maskEl.left.enableDisplayMode("block");this.maskEl.bottom.enableDisplayMode("block");this.maskEl.right.enableDisplayMode("block");
+this.toolTip=new Roo.bootstrap.Tooltip({cls:'roo-form-error-popover',alignment:{'left':['r-l',[-2,0],'right'],'right':['l-r',[2,0],'left'],'bottom':['tl-bl',[0,2],'top'],'top':['bl-tl',[0,-2],'bottom']}});this.toolTip.render(Roo.get(document.body));this.toolTip.el.enableDisplayMode("block");
+Roo.get(document.body).on('click',function(){this.unmask();},this);this.isApplied=true},mask:function(A,B){this.form=A;this.target=B;if(!this.form.errorMask||!B.el){return;}var C=this.target.el.findScrollableParent()||this.target.el.findParent('div.modal',100,true)||Roo.get(document.body);
+var D=C.getScroll();var ot=this.target.el.calcOffsetsTo(C);var E=0;if(ot[1]<=D.top){E=ot[1]-100;}else{E=ot[1]+Roo.lib.Dom.getViewHeight()-100;}C.scrollTo('top',E);var F=this.target.el.getBox();this.maskEl.top.setSize(Roo.lib.Dom.getDocumentWidth(),F.y-this.padding);
+this.maskEl.top.setXY([0,0]);this.maskEl.top.show();this.maskEl.left.setSize(Roo.lib.Dom.getDocumentWidth()-F.right-this.padding,F.height+this.padding*2);this.maskEl.left.setXY([F.right+this.padding,F.y-this.padding]);this.maskEl.left.show();this.maskEl.bottom.setSize(Roo.lib.Dom.getDocumentWidth(),Roo.lib.Dom.getDocumentHeight()-F.bottom-this.padding);
+this.maskEl.bottom.setXY([0,F.bottom+this.padding]);this.maskEl.bottom.show();this.maskEl.right.setSize(F.x-this.padding,F.height+this.padding*2);this.maskEl.right.setXY([0,F.y-this.padding]);this.maskEl.right.show();this.toolTip.bindEl=this.target.el;this.toolTip.el.setStyle('z-index',Roo.bootstrap.Modal.zIndex++);
+var G=this.target.blankText;if(this.target.getValue()!==''&&this.target.regexText.length){G=this.target.regexText;}this.toolTip.show(G);this.intervalID=window.setInterval(function(){Roo.bootstrap.Form.popover.unmask();},10000);window.onwheel=function(){return false;
+};(function(){this.isMasked=true;}).defer(500,this);},unmask:function(){if(!this.isApplied||!this.isMasked||!this.form||!this.target||!this.form.errorMask){return;}this.maskEl.top.setSize(0,0).setXY([0,0]).hide();this.maskEl.left.setSize(0,0).setXY([0,0]).hide();
+this.maskEl.bottom.setSize(0,0).setXY([0,0]).hide();this.maskEl.right.setSize(0,0).setXY([0,0]).hide();this.toolTip.hide();this.toolTip.el.hide();window.onwheel=function(){return true;};if(this.intervalID){window.clearInterval(this.intervalID);this.intervalID=false;
+}this.isMasked=false;}}});
 // Roo/form/VTypes.js
 Roo.form.VTypes=function(){var A=/^[a-zA-Z_]+$/;var B=/^[a-zA-Z0-9_]+$/;var C=/^([\w]+)(.[\w]+)*@([\w-]+\.){1,5}([A-Za-z]){2,24}$/;var D=/(((https?)|(ftp)):\/\/([\-\w]+\.)+\w{2,3}(\/[%\-\w]+(\.\w{2,})?)*(([\w\-\.\?\\\/+@&#;`~=%!]*)(\.\w{2,})?)*\/?)/i;return {'email':function(v){return C.test(v);
 },'emailText':'This field should be an e-mail address in the format "user@domain.com"','emailMask':/[a-z0-9_\.\-@]/i,'url':function(v){return D.test(v);},'urlText':'This field should be a URL in the format "http:/'+'/www.domain.com"','alpha':function(v){return A.test(v);