roojs-bootstrap.js

[roojs1] / roojs-bootstrap-debug.js

diff --git a/roojs-bootstrap-debug.js b/roojs-bootstrap-debug.js
index c687b71..1606bdf 100644 (file)
--- a/roojs-bootstrap-debug.js
+++ b/roojs-bootstrap-debug.js
@@ -413,7 +413,7 @@ Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent,  {
             return;
         }
          
-        this.getVisibilityEl().removeClass('hidden');
+        this.getVisibilityEl().removeClass(['hidden','d-none']);
         
         this.fireEvent('show', this);
         
@@ -428,7 +428,7 @@ Roo.extend(Roo.bootstrap.Component, Roo.BoxComponent,  {
             return;
         }
         
-        this.getVisibilityEl().addClass('hidden');
+        this.getVisibilityEl().addClass(['hidden','d-none']);
         
         this.fireEvent('hide', this);
         
@@ -2410,7 +2410,7 @@ Roo.extend(Roo.bootstrap.Menu, Roo.bootstrap.Component,  {
             this.hide();
         } else {
             Roo.log('show');
-            this.show(this.triggerEl, false, false);
+            this.show(this.triggerEl, '?', false);
         }
         
         if(this.stopEvent || e.getTarget().nodeName.toLowerCase() === 'i'){
@@ -3324,10 +3324,11 @@ Roo.bootstrap.MessageBox = function(){
             buttons["cancel"].hide();
             buttons["yes"].hide();
             buttons["no"].hide();
-            //dlg.footer.dom.style.display = 'none';
+            dlg.footerEl.hide();
+            
             return width;
         }
-        dlg.footerEl.dom.style.display = '';
+        dlg.footerEl.show();
         for(var k in buttons){
             if(typeof buttons[k] != "function"){
                 if(b[k]){
@@ -3604,6 +3605,9 @@ Roo.Msg.show({
                 textareaEl.hide();
             }
             progressEl.setDisplayed(opt.progress === true);
+            if (opt.progress) {
+                d.animate = false; // do not animate progress, as it may not have finished animating before we close it..
+            }
             this.updateProgress(0);
             activeTextEl.dom.value = opt.value || "";
             if(opt.prompt){
@@ -4023,7 +4027,16 @@ Roo.extend(Roo.bootstrap.NavSimplebar, Roo.bootstrap.Navbar,  {
        }
        cfg.cls += ' bg-' + this.weight;
        
-         
+       if (this.inverse) {
+            cfg.cls += ' navbar-inverse';
+            
+        }
+       
+       // i'm not actually sure these are really used - normally we add a navGroup to a navbar
+       
+       if (Roo.bootstrap.version == 4) {
+           return cfg;
+       }
        
         cfg.cn = [
             {
@@ -4057,10 +4070,7 @@ Roo.extend(Roo.bootstrap.NavSimplebar, Roo.bootstrap.Navbar,  {
             cfg.cn[0].cls += ' navbar-right';
         }
         
-        if (this.inverse) {
-            cfg.cls += ' navbar-inverse';
-            
-        }
+        
         
         
         return cfg;
@@ -4354,15 +4364,20 @@ Roo.extend(Roo.bootstrap.NavGroup, Roo.bootstrap.Component,  {
             tag : 'ul',
             cls: 'nav' 
         };
-        
-        if (['tabs','pills'].indexOf(this.type)!==-1) {
-            cfg.cls += ' nav-' + this.type
-        } else {
-            if (this.type!=='nav') {
-                Roo.log('nav type must be nav/tabs/pills')
-            }
-            cfg.cls += ' navbar-nav'
-        }
+        if (Roo.bootstrap.version == 4) {
+           if (this.type == 'pills') {
+               cfg.cls = ' nav-pills';
+           }
+       } else {
+           if (['tabs','pills'].indexOf(this.type)!==-1) {
+               cfg.cls += ' nav-' + this.type
+           } else {
+               if (this.type !== 'nav') {
+                   Roo.log('nav type must be nav/tabs/pills')
+               }
+               cfg.cls += ' navbar-nav'
+           }
+       }
         
         if (this.parent() && this.parent().sidebar) {
             cfg = {
@@ -4376,7 +4391,7 @@ Roo.extend(Roo.bootstrap.NavGroup, Roo.bootstrap.Component,  {
         if (this.form === true) {
             cfg = {
                 tag: 'form',
-                cls: 'navbar-form'
+                cls: 'navbar-form form-inline'
             };
             
             if (this.align === 'right') {
@@ -4463,7 +4478,10 @@ Roo.extend(Roo.bootstrap.NavGroup, Roo.bootstrap.Component,  {
     */
     addItem : function(cfg)
     {
-        var cn = new Roo.bootstrap.NavItem(cfg);
+        if (this.form && Roo.bootstrap.version == 4) {
+           cfg.tag = 'div';
+       }
+       var cn = new Roo.bootstrap.NavItem(cfg);
         this.register(cn);
         cn.parentId = this.id;
         cn.onRender(this.el, null);
@@ -4650,6 +4668,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
     preventDefault : false,
     tabId : false,
     tagtype : 'a',
+    tag: 'li',
     disabled : false,
     animateRef : false,
     was_active : false,
@@ -4657,7 +4676,7 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
     getAutoCreate : function(){
          
         var cfg = {
-            tag: 'li',
+            tag: this.tag,
             cls: 'nav-item'
             
         };
@@ -4706,6 +4725,17 @@ Roo.extend(Roo.bootstrap.NavItem, Roo.bootstrap.Component,  {
         
         return cfg;
     },
+    onRender : function(ct, position)
+    {
+       // Roo.log("Call onRender: " + this.xtype);
+        if (Roo.bootstrap.version == 4 && ct.dom.type != 'ul') {
+           this.tag = 'div';
+       }
+       
+        return Roo.bootstrap.NavItem.superclass.onRender.call(this, ct, position);
+    },
+      
+    
     initEvents: function() 
     {
         if (typeof (this.menu) != 'undefined') {
@@ -9379,9 +9409,10 @@ Roo.extend(Roo.bootstrap.Input, Roo.bootstrap.Component,  {
            cfg.cls += ' navbar-form';
         }
         
-        if (this.parentType === 'NavGroup') {
-           cfg.cls += ' navbar-form';
-           cfg.tag = 'li';
+        if (this.parentType === 'NavGroup' && !(Roo.bootstrap.version == 4 && this.parent().form)) {
+            // on BS4 we do this only if not form 
+            cfg.cls += ' navbar-form';
+            cfg.tag = 'li';
         }
         
         return cfg;
@@ -37924,6 +37955,7 @@ Roo.bootstrap.panel.Tabs = function(config){
     }
     this.stripWrap = Roo.get(this.createStrip(this.el.dom), true);
     this.stripEl = Roo.get(this.createStripList(this.stripWrap.dom), true);
+    this.stripEl.setVisibilityMode(Roo.Element.DISPLAY);
     this.stripBody = Roo.get(this.stripWrap.dom.firstChild.firstChild, true);
     if(Roo.isIE){
         Roo.fly(this.stripWrap.dom.firstChild).setStyle("overflow-x", "hidden");
@@ -38083,9 +38115,11 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
      * Adds an existing {@link Roo.TabPanelItem}.
      * @param {Roo.TabPanelItem} item The TabPanelItem to add
      */
-    addTabItem : function(item){
+    addTabItem : function(item)
+    {
         this.items[item.id] = item;
         this.items.push(item);
+        this.autoSizeTabs();
       //  if(this.resizeTabs){
     //       item.setWidth(this.currentTabWidth || this.preferredTabWidth);
   //         this.autoSizeTabs();
@@ -38167,7 +38201,8 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
      * @param {String/Number} id The id or index of the TabPanelItem to activate.
      * @return {Roo.TabPanelItem} The TabPanelItem.
      */
-    activate : function(id){
+    activate : function(id)
+    {
         var tab = this.items[id];
         if(!tab){
             return null;
@@ -38233,12 +38268,22 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
     /**
      * Manual call to resize the tabs (if {@link #resizeTabs} is false this does nothing)
      */
-    autoSizeTabs : function(){
+    autoSizeTabs : function()
+    {
         var count = this.items.length;
         var vcount = count - this.hiddenCount;
+        
+        if (vcount < 2) {
+            this.stripEl.hide();
+        } else {
+            this.stripEl.show();
+        }
+        
         if(!this.resizeTabs || count < 1 || vcount < 1 || this.updating) {
             return;
         }
+        
+        
         var w = Math.max(this.el.getWidth() - this.cpad, 10);
         var availWidth = Math.floor(w / vcount);
         var b = this.stripBody;
@@ -38460,7 +38505,7 @@ Roo.bootstrap.panel.TabItem = function(config){
      this.textEl = Roo.bootstrap.version == 4 ?
         this.el : Roo.get(this.el.dom.firstChild, true);
 
-    this.linode = Roo.get(els.el.parentNode, true);
+    this.pnode = this.linode = Roo.get(els.el.parentNode, true);
     this.status_node = Roo.bootstrap.version == 4 ? this.el : this.linode;