diff --git a/hacking/TabBar.js b/hacking/TabBar.js index 999eed0c6f..b50545f9a5 100644 --- a/hacking/TabBar.js +++ b/hacking/TabBar.js @@ -91,8 +91,19 @@ TabBar.prototype = { // Add an item to the tab bar addItem: function(item) { // Create a new TabItem - this.items.push(item); - this._bindEventsOnItem(item); + var tabItem = TabBarItem.prototype.create(item); + + this.appendItemElement(tabItem); + + this.items.push(tabItem); + this._bindEventsOnItem(tabItem); + }, + + appendItemElement: function(item) { + if(!this.el) { + return; + } + this.el.appendChild(item.el); }, // Remove an item from the tab bar diff --git a/hacking/TabBarController.js b/hacking/TabBarController.js index d1b3371017..4d16eea3de 100644 --- a/hacking/TabBarController.js +++ b/hacking/TabBarController.js @@ -5,7 +5,13 @@ TabBarController = function(options) { this._bindEvents(); - this.controllers = options.controllers || []; + this.controllers = []; + + var controllers = options.controllers || []; + + for(var i = 0; i < controllers.length; i++) { + this.addController(controllers[i]); + } // Bind or set our tabWillChange callback this.controllerWillChange = options.controllerWillChange || function(controller) {}; @@ -110,7 +116,7 @@ TabBarController.prototype = { this.controllers = controllers; this._clearSelected(); this.selectController(0); - } + }, } })(this, document, ion = this.ionic || {}); diff --git a/hacking/tabs.html b/hacking/tabs.html index 1eb838befc..0b2c4a448e 100644 --- a/hacking/tabs.html +++ b/hacking/tabs.html @@ -42,21 +42,7 @@
- + @@ -76,8 +62,8 @@ this.el = opts.el; } controller.prototype = { - setVisible: function(isVisible) { - if(isVisible) { + visibilityChanged: function() { + if(this.isVisible) { //this.el.style.display = 'block'; if(this._lastNodeSpot) { this._lastNodeParent.insertBefore(this.el, this._lastNodeSpot); @@ -100,18 +86,22 @@ el: tab1 }); c1.title = 'Mice'; + c1.icon = 'icon-home'; var c2 = new controller({ el: tab2 }); c2.title = 'Dogs'; + c2.icon = 'icon-gear'; var c3 = new controller({ el: tab3 }); c3.title = 'Cats'; + c3.icon = 'icon-plus'; var c4 = new controller({ el: tab4 }); c4.title = 'Cats'; + c4.icon = 'icon-minus'; var c = new TabBarController({ tabBar: new TabBar({ el: tab }),