Uncommited changes synced
[roojs1] / roojs-bootstrap-debug.js
index 2c3d4a6..c687b71 100644 (file)
@@ -38298,7 +38298,9 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
     createStrip : function(container)
     {
         var strip = document.createElement("nav");
-        strip.className = "navbar navbar-default"; //"x-tabs-wrap";
+        strip.className = Roo.bootstrap.version == 4 ?
+            "navbar-light bg-light" : 
+            "navbar navbar-default"; //"x-tabs-wrap";
         container.appendChild(strip);
         return strip;
     },
@@ -38337,7 +38339,7 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
     createStripElements :  function(stripEl, text, closable, tpl)
     {
         var td = document.createElement("li"); // was td..
-        
+        td.className = 'nav-item';
         
         //stripEl.insertBefore(td, stripEl.childNodes[stripEl.childNodes.length-1]);
         
@@ -38377,12 +38379,18 @@ Roo.extend(Roo.bootstrap.panel.Tabs, Roo.util.Observable, {
             var template = tpl || this.tabTpl || false;
             
             if(!template){
-                
-                template = new Roo.Template(
-                   '<a href="#">' +
-                   '<span unselectable="on"' +
-                            (this.disableTooltips ? '' : ' title="{text}"') +
-                            ' >{text}</span></a>'
+                template =  new Roo.Template(
+                        Roo.bootstrap.version == 4 ? 
+                            (
+                                '<a class="nav-link" href="#" unselectable="on"' +
+                                     (this.disableTooltips ? '' : ' title="{text}"') +
+                                     ' >{text}</a>'
+                            ) : (
+                                '<a class="nav-link" href="#">' +
+                                '<span unselectable="on"' +
+                                         (this.disableTooltips ? '' : ' title="{text}"') +
+                                    ' >{text}</span></a>'
+                            )
                 );
             }
             
@@ -38449,8 +38457,13 @@ Roo.bootstrap.panel.TabItem = function(config){
     /** @private */
     this.el = Roo.get(els.el);
     this.inner = Roo.get(els.inner, true);
-    this.textEl = Roo.get(this.el.dom.firstChild, true);
-    this.pnode = Roo.get(els.el.parentNode, true);
+     this.textEl = Roo.bootstrap.version == 4 ?
+        this.el : Roo.get(this.el.dom.firstChild, true);
+
+    this.linode = Roo.get(els.el.parentNode, true);
+    this.status_node = Roo.bootstrap.version == 4 ? this.el : this.linode;
+
+    
 //    this.el.on("mousedown", this.onTabMouseDown, this);
     this.el.on("click", this.onTabClick, this);
     /** @private */
@@ -38505,7 +38518,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
      * Shows this TabPanelItem -- this <b>does not</b> deactivate the currently active TabPanelItem.
      */
     show : function(){
-        this.pnode.addClass("active");
+        this.status_node.addClass("active");
         this.showAction();
         if(Roo.isOpera){
             this.tabPanel.stripWrap.repaint();
@@ -38525,7 +38538,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
      * Hides this TabPanelItem -- if you don't activate another TabPanelItem this could look odd.
      */
     hide : function(){
-        this.pnode.removeClass("active");
+        this.status_node.removeClass("active");
         this.hideAction();
         this.fireEvent("deactivate", this.tabPanel, this);
     },
@@ -38572,10 +38585,10 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
     },
 
     setWidth : function(width){
-        var iwidth = width - this.pnode.getPadding("lr");
+        var iwidth = width - this.linode.getPadding("lr");
         this.inner.setWidth(iwidth);
         this.textEl.setWidth(iwidth-this.inner.getPadding("lr"));
-        this.pnode.setWidth(width);
+        this.linode.setWidth(width);
     },
 */
     /**
@@ -38584,7 +38597,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
      */
     setHidden : function(hidden){
         this.hidden = hidden;
-        this.pnode.setStyle("display", hidden ? "none" : "");
+        this.linode.setStyle("display", hidden ? "none" : "");
     },
 
     /**
@@ -38610,7 +38623,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
          *  #2804 [new] Tabs in Roojs
          *  increase the width by 2-4 pixels to prevent the ellipssis showing in chrome
          */
-        //this.setWidth(this.textEl.dom.scrollWidth+this.pnode.getPadding("lr")+this.inner.getPadding("lr") + 2);
+        //this.setWidth(this.textEl.dom.scrollWidth+this.linode.getPadding("lr")+this.inner.getPadding("lr") + 2);
         //this.el.endMeasure();
     //},
 
@@ -38639,7 +38652,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
     disable : function(){
         if(this.tabPanel.active != this){
             this.disabled = true;
-            this.pnode.addClass("disabled");
+            this.status_node.addClass("disabled");
         }
     },
 
@@ -38648,7 +38661,7 @@ Roo.extend(Roo.bootstrap.panel.TabItem, Roo.util.Observable,
      */
     enable : function(){
         this.disabled = false;
-        this.pnode.removeClass("disabled");
+        this.status_node.removeClass("disabled");
     },
 
     /**