Roo/bootstrap/Table.js
[roojs1] / roojs-bootstrap-debug.js
index e54a328..3e0ecd1 100644 (file)
@@ -401,6 +401,8 @@ Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent,  {
          
         this.getVisibilityEl().removeClass('hidden');
         
+        this.fireEvent('show', this);
+        
         
     },
     /**
@@ -414,6 +416,8 @@ Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent,  {
         
         this.getVisibilityEl().addClass('hidden');
         
+        this.fireEvent('hide', this);
+        
     }
 });
 
@@ -913,15 +917,7 @@ Roo.extend(Roo.bootstrap.Button, Roo.bootstrap.Component,  {
     {
         return this.el.select('.roo-button-text',true).first().dom.innerHTML;
     },
-    hide: function() {
-       
-     
-        this.el.hide();   
-    },
-    show: function() {
-       
-        this.el.show();   
-    },
+    
     setWeight : function(str)
     {
        this.el.removeClass(this.weightClass);
@@ -2574,6 +2570,7 @@ Roo.extend(Roo.bootstrap.MenuSeparator, Roo.bootstrap.Component,  {
  * @cfg {Boolean} allow_close default true
  * @cfg {Boolean} fitwindow default false
  * @cfg {String} size (sm|lg) default empty
+ * @cfg {Number} max_width set the max width of modal
  *
  *
  * @constructor
@@ -2628,8 +2625,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
     animate : true,
 
     fitwindow: false,
-
-
+    
      // private
     dialogEl: false,
     bodyEl:  false,
@@ -2638,7 +2634,12 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
     closeEl:  false,
 
     size: '',
-
+    
+    max_width: 0,
+    
+    max_height: 0,
+    
+    fit_content: false,
 
     onRender : function(ct, position)
     {
@@ -2716,9 +2717,8 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
 
     },
 
-    getAutoCreate : function(){
-
-
+    getAutoCreate : function()
+    {
         var bdy = {
                 cls : 'modal-body',
                 html : this.html || ''
@@ -2815,12 +2815,51 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
 
     resize : function()
     {
-        this.maskEl.setSize(Roo.lib.Dom.getViewWidth(true),  Roo.lib.Dom.getViewHeight(true));
+        this.maskEl.setSize(
+            Roo.lib.Dom.getViewWidth(true),
+            Roo.lib.Dom.getViewHeight(true)
+        );
+        
         if (this.fitwindow) {
-            var w = this.width || Roo.lib.Dom.getViewportWidth(true) - 30;
-            var h = this.height || Roo.lib.Dom.getViewportHeight(true) - 60;
-            this.setSize(w,h);
+            this.setSize(
+                this.width || Roo.lib.Dom.getViewportWidth(true) - 30,
+                this.height || Roo.lib.Dom.getViewportHeight(true) - 60
+            );
+            return;
         }
+        
+        if(this.max_width !== 0) {
+            
+            var w = Math.min(this.max_width, Roo.lib.Dom.getViewportWidth(true) - 30);
+            
+            if(this.height) {
+                this.setSize(w, this.height);
+                return;
+            }
+            
+            if(this.max_height) {
+                this.setSize(w,Math.min(
+                    this.max_height,
+                    Roo.lib.Dom.getViewportHeight(true) - 60
+                ));
+                
+                return;
+            }
+            
+            if(!this.fit_content) {
+                this.setSize(w, Roo.lib.Dom.getViewportHeight(true) - 60);
+                return;
+            }
+            
+            this.setSize(w, Math.min(
+                60 +
+                this.headerEl.getHeight() + 
+                this.footerEl.getHeight() + 
+                this.getChildHeight(this.bodyEl.dom.childNodes),
+                Roo.lib.Dom.getViewportHeight(true) - 60)
+            );
+        }
+        
     },
 
     setSize : function(w,h)
@@ -2828,6 +2867,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
         if (!w && !h) {
             return;
         }
+        
         this.resizeTo(w,h);
     },
 
@@ -2848,7 +2888,6 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
             }).defer(50, this);
         }else{
             this.el.addClass('in');
-
         }
 
         // not sure how we can show data in here..
@@ -2942,7 +2981,7 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
             this.diff = this.dialogEl.getHeight() - this.bodyEl.getHeight();
         }
 
-        this.bodyEl.setHeight(h-this.diff);
+        this.bodyEl.setHeight(h - this.diff);
 
         this.fireEvent('resize', this);
 
@@ -2981,6 +3020,67 @@ Roo.extend(Roo.bootstrap.Modal, Roo.bootstrap.Component,  {
             //code
         }
         this.tmpl.overwrite(this.bodyEl, obj);
+    },
+    
+    getChildHeight : function(child_nodes)
+    {
+        if(
+            !child_nodes ||
+            child_nodes.length == 0
+        ) {
+            return;
+        }
+        
+        var child_height = 0;
+        
+        for(var i = 0; i < child_nodes.length; i++) {
+            
+            /*
+            * for modal with tabs...
+            if(child_nodes[i].classList.contains('roo-layout-panel')) {
+                
+                var layout_childs = child_nodes[i].childNodes;
+                
+                for(var j = 0; j < layout_childs.length; j++) {
+                    
+                    if(layout_childs[j].classList.contains('roo-layout-panel-body')) {
+                        
+                        var layout_body_childs = layout_childs[j].childNodes;
+                        
+                        for(var k = 0; k < layout_body_childs.length; k++) {
+                            
+                            if(layout_body_childs[k].classList.contains('navbar')) {
+                                child_height += layout_body_childs[k].offsetHeight;
+                                continue;
+                            }
+                            
+                            if(layout_body_childs[k].classList.contains('roo-layout-tabs-body')) {
+                                
+                                var layout_body_tab_childs = layout_body_childs[k].childNodes;
+                                
+                                for(var m = 0; m < layout_body_tab_childs.length; m++) {
+                                    
+                                    if(layout_body_tab_childs[m].classList.contains('roo-layout-active-content')) {
+                                        child_height += this.getChildHeight(layout_body_tab_childs[m].childNodes);
+                                        continue;
+                                    }
+                                    
+                                }
+                                
+                            }
+                            
+                        }
+                    }
+                }
+                continue;
+            }
+            */
+            
+            child_height += child_nodes[i].offsetHeight;
+            // Roo.log(child_nodes[i].offsetHeight);
+        }
+        
+        return child_height;
     }
 
 });
@@ -5879,6 +5979,7 @@ Roo.LoadMask.prototype = {
  * @cfg {Boolean} scrollBody (true|false) default false - body scrolled / fixed header
  * @cfg {Roo.bootstrap.PagingToolbar} footer  a paging toolbar
  * @cfg {Boolean} lazyLoad  auto load data while scrolling to the end (default false)
+ * @cfg {Boolean} auto_hide_footer  auto hide footer if only one page (default false)
  
  * 
  * @constructor
@@ -6069,6 +6170,8 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component,  {
     
     CSS : Roo.util.CSS,
     
+    auto_hide_footer : false,
+    
     getAutoCreate : function()
     {
         var cfg = Roo.apply({}, Roo.bootstrap.Table.superclass.getAutoCreate.call(this));
@@ -6157,7 +6260,7 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component,  {
         
         this.mainBody = this.el.select('tbody', true).first();
         this.mainHead = this.el.select('thead', true).first();
-        
+        this.mainFoot = this.el.select('tfoot', true).first();
         
         
         
@@ -6593,6 +6696,19 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component,  {
             }, this);
         }
         
+        var tfoot = this.el.select('tfoot', true).first();
+        
+        if(this.footerShow && this.auto_hide_footer && this.mainFoot){
+            
+            this.mainFoot.setVisibilityMode(Roo.Element.DISPLAY).hide();
+            
+            var total = this.ds.getTotalCount();
+            
+            if(this.footer.pageSize < total){
+                this.mainFoot.show();
+            }
+        }
+        
         Roo.each(this.el.select('tbody td', true).elements, function(e){
             e.on('mouseover', _this.onMouseover, _this);
         });
@@ -6983,9 +7099,77 @@ Roo.extend(Roo.bootstrap.Table, Roo.bootstrap.Component,  {
         
         this.onHeaderChange();
         this.onLoad();
+    },
+    
+    setColumnWidth: function(col_index, width)
+    {
+        // width = "md-2 xs-2..."
+        if(!this.colModel.config[col_index]) {
+            return;
+        }
+        
+        var w = width.split(" ");
+        
+        var rows = this.el.dom.getElementsByClassName("x-col-"+col_index);
+        
+        var h_row = this.el.dom.getElementsByClassName("x-hcol-"+col_index);
+        
+        
+        for(var j = 0; j < w.length; j++) {
+            
+            if(!w[j]) {
+                continue;
+            }
+            
+            var size_cls = w[j].split("-");
+            
+            if(!Number.isInteger(size_cls[1] * 1)) {
+                continue;
+            }
+            
+            if(!this.colModel.config[col_index][size_cls[0]]) {
+                continue;
+            }
+            
+            if(!h_row[0].classList.contains("col-"+size_cls[0]+"-"+this.colModel.config[col_index][size_cls[0]])) {
+                continue;
+            }
+            
+            h_row[0].classList.replace(
+                "col-"+size_cls[0]+"-"+this.colModel.config[col_index][size_cls[0]],
+                "col-"+size_cls[0]+"-"+size_cls[1]
+            );
+            
+            this.colModel.config[col_index][size_cls[0]] = size_cls[1];
+        }
         
+        for(var i = 0; i < rows.length; i++) {
+            
+            for(var j = 0; j < w.length; j++) {
+                
+                var size_cls = w[j].split("-");
+                
+                if(!Number.isInteger(size_cls[1] * 1)) {
+                    continue;
+                }
+                
+                if(!this.colModel.config[col_index][size_cls[0]]) {
+                    continue;
+                }
+                
+                Roo.log('returning..');
+                
+                if(!rows[i].classList.contains("col-"+size_cls[0]+"-"+this.colModel.config[col_index][size_cls[0]])) {
+                    continue;
+                }
+                
+                rows[i].classList.replace(
+                    "col-"+size_cls[0]+"-"+this.colModel.config[col_index][size_cls[0]],
+                    "col-"+size_cls[0]+"-"+size_cls[1]
+                );
+            }
+        }
     }
-    
 });
 
  
@@ -7793,6 +7977,8 @@ Roo.extend(Roo.bootstrap.Form, Roo.bootstrap.Component,  {
                 return;
             }
             
+            Roo.log('invalid field: ' + f.name);
+            
             valid = false;
 
             if(!target && f.el.isVisible(true)){
@@ -8197,11 +8383,6 @@ clientValidation  Boolean          Applies to submit only.  Pass true to call fo
                 return;
             }
             
-            if(f.xtype == 'DateField'){
-                f.setVisible(false);
-                return;
-            }
-            
             f.hide();
             
         }, this);
@@ -8217,11 +8398,6 @@ clientValidation  Boolean          Applies to submit only.  Pass true to call fo
                 return;
             }
             
-            if(f.xtype == 'DateField'){
-                f.setVisible(true);
-                return;
-            }
-            
             f.show();
             
         }, this);
@@ -9390,6 +9566,11 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component,  {
             
         }
         
+        if(this.indicator){
+            this.indicator.removeClass('visible');
+            this.indicator.addClass(this.indicatorpos == 'right' ? 'hidden' : 'invisible');
+        }
+        
         this.fireEvent('valid', this);
     },
     
@@ -12934,6 +13115,11 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
      */
     useNativeIOS : false,
     
+    /**
+     * @cfg {Boolean} mobile_restrict_height (true|false) restrict height for touch view
+     */
+    mobile_restrict_height : false,
+    
     ios_options : false,
     
     //private
@@ -13575,11 +13761,16 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
         this.list.on('scroll', this.onViewScroll, this);
         
         if(!this.tpl){
-            this.tpl = '<li class="roo-select2-result"><div class="checkbox"><input id="{roo-id}" type="checkbox" {roo-data-checked}><label for="{roo-id}"><b>{' + this.displayField + '}</b></label></div></li>';
+            this.tpl = '<li class="roo-select2-result"><div class="checkbox"><input id="{roo-id}"' + 
+                'type="checkbox" {roo-data-checked}><label for="{roo-id}"><b>{' + this.displayField + '}</b></label></div></li>';
         }
 
         this.view = new Roo.View(this.list, this.tpl, {
-            singleSelect:true, tickable:true, parent:this, store: this.store, selectedClass: this.selectedClass
+            singleSelect:true,
+            tickable:true,
+            parent:this,
+            store: this.store,
+            selectedClass: this.selectedClass
         });
         
         //this.view.wrapEl.setDisplayed(false);
@@ -15146,6 +15337,8 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
             document.activeElement.blur();
         }, this);
         
+        this._touchViewMask = Roo.DomHelper.append(document.body, {tag: "div", cls:"x-dlg-mask"}, true);
+        
         return;
         
         
@@ -15206,7 +15399,14 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
         }else{
             this.touchViewEl.addClass('in');
         }
-
+        
+        if(this._touchViewMask){
+            Roo.get(document.body).addClass("x-body-masked");
+            this._touchViewMask.setSize(Roo.lib.Dom.getViewWidth(true),   Roo.lib.Dom.getViewHeight(true));
+            this._touchViewMask.setStyle('z-index', 10000);
+            this._touchViewMask.addClass('show');
+        }
+        
         this.doTouchViewQuery();
         
     },
@@ -15222,6 +15422,10 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
             this.touchViewEl.setStyle('display', 'none');
         }
         
+        if(this._touchViewMask){
+            this._touchViewMask.removeClass('show');
+            Roo.get(document.body).removeClass("x-body-masked");
+        }
     },
     
     setTouchViewValue : function()
@@ -15328,7 +15532,11 @@ Roo.extend(Roo.bootstrap.ComboBox, Roo.bootstrap.TriggerField, {
             bodyHeight = bodyHeight - this.touchViewHeaderEl.getHeight();
         }
 
-        var listHeight = this.touchViewListGroup.getHeight();
+        var listHeight = this.touchViewListGroup.getHeight() + this.touchViewBodyEl.getPadding('tb') * 2;
+        
+        if(this.mobile_restrict_height && listHeight < bodyHeight){
+            this.touchViewBodyEl.setHeight(listHeight);
+        }
         
         var _this = this;
         
@@ -18521,7 +18729,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
         this.showMode();
         
         if(this.isInline) {
-            this.show();
+            this.showPopup();
         }
     },
     
@@ -18804,7 +19012,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
     onFocus : function()
     {
         Roo.bootstrap.DateField.superclass.onFocus.call(this);
-        this.show();
+        this.showPopup();
     },
     
     onBlur : function()
@@ -18815,19 +19023,19 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
         
         this.setValue(d);
                 
-        this.hide();
+        this.hidePopup();
     },
     
-    show : function()
+    showPopup : function()
     {
         this.picker().show();
         this.update();
         this.place();
         
-        this.fireEvent('show', this, this.date);
+        this.fireEvent('showpopup', this, this.date);
     },
     
-    hide : function()
+    hidePopup : function()
     {
         if(this.isInline) {
             return;
@@ -18836,7 +19044,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
         this.viewMode = this.startViewMode;
         this.showMode();
         
-        this.fireEvent('hide', this, this.date);
+        this.fireEvent('hidepopup', this, this.date);
         
     },
     
@@ -18884,7 +19092,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
     {
         if (!this.picker().isVisible()){
             if (e.keyCode == 27) { // allow escape to hide and re-show picker
-                this.show();
+                this.showPopup();
             }
             return;
         }
@@ -18895,7 +19103,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
         
         switch(e.keyCode){
             case 27: // escape
-                this.hide();
+                this.hidePopup();
                 e.preventDefault();
                 break;
             case 37: // left
@@ -18955,12 +19163,12 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
                 break;
             case 13: // enter
                 this.setValue(this.formatDate(this.date));
-                this.hide();
+                this.hidePopup();
                 e.preventDefault();
                 break;
             case 9: // tab
                 this.setValue(this.formatDate(this.date));
-                this.hide();
+                this.hidePopup();
                 break;
             case 16: // shift
             case 17: // ctrl
@@ -19015,7 +19223,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
 //                        this.fill()
                         this.setValue(this.formatDate(this.date));
                         
-                        this.hide();
+                        this.hidePopup();
                         break;
                 }
                 break;
@@ -19032,7 +19240,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
                     
                     if(this.singleMode){
                         this.setValue(this.formatDate(this.viewDate));
-                        this.hide();
+                        this.hidePopup();
                         return;
                     }
                     
@@ -19069,7 +19277,7 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
 //                    this.fill();
                     //Roo.log(this.formatDate(this.date));
                     this.setValue(this.formatDate(this.date));
-                    this.hide();
+                    this.hidePopup();
                 }
                 break;
         }
@@ -19279,21 +19487,6 @@ Roo.extend(Roo.bootstrap.DateField, Roo.bootstrap.Input,  {
         this.date = this.viewDate = '';
         
         Roo.bootstrap.DateField.superclass.setValue.call(this, '');
-    },
-    
-    setVisible : function(visible)
-    {
-        if(!this.getEl()){
-            return;
-        }
-        
-        this.getEl().removeClass('hidden');
-        
-        if(visible){
-            return;
-        }
-        
-        this.getEl().addClass('hidden');
     }
    
 });
@@ -26186,6 +26379,7 @@ Roo.extend(Roo.bootstrap.Tooltip, Roo.bootstrap.Component,  {
                 placement = 'top';
             }
             
+            align = this.alignment[placement];
         }
         
         this.el.alignTo(this.bindEl, align[0],align[1]);
@@ -28687,7 +28881,10 @@ Roo.bootstrap.DocumentManager = function(config){
          * @param {Roo.bootstrap.DocumentManager} this
          * @param {Object} file
          */
-        "previewrendered" : true
+        "previewrendered" : true,
+        /**
+         */
+        "previewResize" : true
         
     });
 };
@@ -29290,6 +29487,10 @@ Roo.extend(Roo.bootstrap.DocumentManager, Roo.bootstrap.Component,  {
         var width = image.dom.naturalWidth || image.dom.width;
         var height = image.dom.naturalHeight || image.dom.height;
         
+        if(!this.previewResize) {
+            return;
+        }
+        
         if(width > height){
             file.target.addClass('wide');
             return;
@@ -31847,7 +32048,7 @@ Roo.extend(Roo.bootstrap.LayoutMasonry, Roo.bootstrap.Component,  {
         var cn = new Roo.bootstrap.MasonryBrick(cfg);
         //this.register(cn);
         cn.parentId = this.id;
-        cn.onRender(this.el, null);
+        cn.render(this.el);
         return cn;
     },