Upgrade to ExtJS 3.1.0 - Released 12/16/2009
[extjs.git] / examples / ux / GroupTabPanel.js
index 8033b7e..060fc81 100644 (file)
@@ -1,5 +1,5 @@
 /*!
 /*!
- * Ext JS Library 3.0.3
+ * Ext JS Library 3.1.0
  * Copyright(c) 2006-2009 Ext JS, LLC
  * licensing@extjs.com
  * http://www.extjs.com/license
  * Copyright(c) 2006-2009 Ext JS, LLC
  * licensing@extjs.com
  * http://www.extjs.com/license
@@ -43,7 +43,7 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
         \r
         this.on('beforeadd', function(gtp, item, index){\r
             this.initGroup(item, index);\r
         \r
         this.on('beforeadd', function(gtp, item, index){\r
             this.initGroup(item, index);\r
-        });          \r
+        });                 \r
     },\r
     \r
     initEvents : function() {\r
     },\r
     \r
     initEvents : function() {\r
@@ -65,8 +65,8 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
         var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);\r
         this.strip = new Ext.Element(this.stripWrap.dom.firstChild);\r
 \r
         var beforeEl = (this.tabPosition=='bottom' ? this.stripWrap : null);\r
         this.strip = new Ext.Element(this.stripWrap.dom.firstChild);\r
 \r
-        this.header.addClass('x-grouptabs-panel-header');\r
-        this.bwrap.addClass('x-grouptabs-bwrap');\r
+               this.header.addClass('x-grouptabs-panel-header');\r
+               this.bwrap.addClass('x-grouptabs-bwrap');\r
         this.body.addClass('x-tab-panel-body-'+this.tabPosition + ' x-grouptabs-panel-body');\r
 \r
         if (!this.groupTpl) {\r
         this.body.addClass('x-tab-panel-body-'+this.tabPosition + ' x-grouptabs-panel-body');\r
 \r
         if (!this.groupTpl) {\r
@@ -151,6 +151,7 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
             groupEl = this.getGroupEl(groupEl);\r
         }\r
         Ext.fly(groupEl).addClass('x-grouptabs-expanded');\r
             groupEl = this.getGroupEl(groupEl);\r
         }\r
         Ext.fly(groupEl).addClass('x-grouptabs-expanded');\r
+               this.syncTabJoint();\r
     },\r
     \r
     toggleGroup: function(groupEl){\r
     },\r
     \r
     toggleGroup: function(groupEl){\r
@@ -158,9 +159,17 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
             groupEl = this.getGroupEl(groupEl);\r
         }        \r
         Ext.fly(groupEl).toggleClass('x-grouptabs-expanded');\r
             groupEl = this.getGroupEl(groupEl);\r
         }        \r
         Ext.fly(groupEl).toggleClass('x-grouptabs-expanded');\r
-        this.syncTabJoint();\r
+               this.syncTabJoint();\r
     },    \r
     },    \r
-    \r
+\r
+    collapseGroup: function(groupEl){\r
+        if(groupEl.isXType) {\r
+            groupEl = this.getGroupEl(groupEl);\r
+        }\r
+        Ext.fly(groupEl).removeClass('x-grouptabs-expanded');\r
+               this.syncTabJoint();\r
+    },\r
+        \r
     syncTabJoint: function(groupEl){\r
         if (!this.tabJoint) {\r
             return;\r
     syncTabJoint: function(groupEl){\r
         if (!this.tabJoint) {\r
             return;\r
@@ -169,7 +178,7 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
         groupEl = groupEl || this.getGroupEl(this.activeGroup);\r
         if(groupEl) {\r
             this.tabJoint.setHeight(Ext.fly(groupEl).getHeight() - 2); \r
         groupEl = groupEl || this.getGroupEl(this.activeGroup);\r
         if(groupEl) {\r
             this.tabJoint.setHeight(Ext.fly(groupEl).getHeight() - 2); \r
-            \r
+                       \r
             var y = Ext.isGecko2 ? 0 : 1;\r
             if (this.tabPosition == 'left'){\r
                 this.tabJoint.alignTo(groupEl, 'tl-tr', [-2,y]);\r
             var y = Ext.isGecko2 ? 0 : 1;\r
             if (this.tabPosition == 'left'){\r
                 this.tabJoint.alignTo(groupEl, 'tl-tr', [-2,y]);\r
@@ -212,6 +221,7 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
             tl = this.createCorner(el, 'top-' + this.tabPosition),\r
             bl = this.createCorner(el, 'bottom-' + this.tabPosition);\r
 \r
             tl = this.createCorner(el, 'top-' + this.tabPosition),\r
             bl = this.createCorner(el, 'bottom-' + this.tabPosition);\r
 \r
+        group.tabEl = el;\r
         if (group.expanded) {\r
             this.expandGroup(el);\r
         }\r
         if (group.expanded) {\r
             this.expandGroup(el);\r
         }\r
@@ -232,20 +242,19 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
     \r
     setActiveGroup : function(group) {\r
         group = this.getComponent(group);\r
     \r
     setActiveGroup : function(group) {\r
         group = this.getComponent(group);\r
-        if(!group || this.fireEvent('beforegroupchange', this, group, this.activeGroup) === false){\r
-            return;\r
+        if(!group){\r
+            return false;\r
         }\r
         if(!this.rendered){\r
             this.activeGroup = group;\r
         }\r
         if(!this.rendered){\r
             this.activeGroup = group;\r
-            return;\r
+            return true;\r
         }\r
         }\r
-        if(this.activeGroup != group){\r
+        if(this.activeGroup != group && this.fireEvent('beforegroupchange', this, group, this.activeGroup) !== false){\r
             if(this.activeGroup){\r
                 var oldEl = this.getGroupEl(this.activeGroup);\r
                 if(oldEl){\r
                     Ext.fly(oldEl).removeClass('x-grouptabs-strip-active');\r
                 }\r
             if(this.activeGroup){\r
                 var oldEl = this.getGroupEl(this.activeGroup);\r
                 if(oldEl){\r
                     Ext.fly(oldEl).removeClass('x-grouptabs-strip-active');\r
                 }\r
-                this.activeGroup.fireEvent('deactivate', this.activeGroup);\r
             }\r
 \r
             var groupEl = this.getGroupEl(group);\r
             }\r
 \r
             var groupEl = this.getGroupEl(group);\r
@@ -257,18 +266,20 @@ Ext.ux.GroupTabPanel = Ext.extend(Ext.TabPanel, {
             this.layout.setActiveItem(group);\r
             this.syncTabJoint(groupEl);\r
 \r
             this.layout.setActiveItem(group);\r
             this.syncTabJoint(groupEl);\r
 \r
-            group.fireEvent('activate', group);\r
             this.fireEvent('groupchange', this, group);\r
             this.fireEvent('groupchange', this, group);\r
-        }        \r
+            return true;\r
+        }\r
+        return false; \r
     },\r
     \r
     onGroupBeforeTabChange: function(group, newTab, oldTab){\r
         if(group !== this.activeGroup || newTab !== oldTab) {\r
             this.strip.select('.x-grouptabs-sub > li.x-grouptabs-strip-active', true).removeClass('x-grouptabs-strip-active');\r
         } \r
     },\r
     \r
     onGroupBeforeTabChange: function(group, newTab, oldTab){\r
         if(group !== this.activeGroup || newTab !== oldTab) {\r
             this.strip.select('.x-grouptabs-sub > li.x-grouptabs-strip-active', true).removeClass('x-grouptabs-strip-active');\r
         } \r
-        \r
         this.expandGroup(this.getGroupEl(group));\r
         this.expandGroup(this.getGroupEl(group));\r
-        this.setActiveGroup(group);\r
+        if(group !== this.activeGroup) {\r
+            return this.setActiveGroup(group);\r
+        }        \r
     },\r
     \r
     getFrameHeight: function(){\r
     },\r
     \r
     getFrameHeight: function(){\r