TESTS!!

hacking/TabBar.dataApi.unit.js

@@ -0,0 +1,5 @@
+describe('TabBar Data API', function() {
+  it('Should detect tabs', function() {
+
+  });
+});

hacking/TabBar.js

@@ -1,3 +1,5 @@
+(function(window, document, ionic) {
+
 TabBarItem = function(el) {
   this.el = el;
 
@@ -5,7 +7,7 @@ TabBarItem = function(el) {
 };
 TabBarItem.prototype = {
   _buildItem: function() {
-    var child, children = Array.prototype.slice.call(this.el.children);
+    var _this = this, child, children = Array.prototype.slice.call(this.el.children);
 
     for(var i = 0, j = children.length; i < j; i++) {
       child = children[i];
@@ -21,6 +23,22 @@ TabBarItem.prototype = {
 
     // Set the title to the text content of the tab.
     this.title = this.el.innerText.trim();
+
+    this._tapHandler = function(e) {
+      console.log('TAP', e);
+      _this.onTap();
+    };
+
+    ionic.on('click', this._tapHandler, this.el);
+    ionic.on('tap', this._tapHandler, this.el);
+  },
+
+  onTap: function() {},
+
+  // Remove the event listeners from this object
+  destroy: function() {
+    ionic.off('click', this._tapHandler, this.el);
+    ionic.off('tap', this._tapHandler, this.el);
   },
 
   getIcon: function() {
@@ -43,10 +61,36 @@ TabBarItem.prototype = {
 
 TabBar = function(opts) {
   this.el = opts.el;
+   
+  this.items = [];
+
   this._buildItems();
 };
 
 TabBar.prototype = {
+  addItem: function(item) {
+    this.items.push(item);
+    this._bindEventsOnItem(item);
+  },
+
+  removeItem: function(index) {
+    var item = this.items[index];
+    if(!item) {
+      return;
+    }
+    item.onSelect = undefined;
+    item.destroy();
+  },
+
+  _itemActivateHandler: function(e) {
+  },
+
+  _bindEventsOnItem: function(item) {
+    item.onSelect = function() {
+      console.log(item.title + ' selected!');
+    }
+  },
+
   getSelectedItem: function() {
     return this.selectedItem;
   },
@@ -67,17 +111,20 @@ TabBar.prototype = {
   },
 
   _buildItems: function() {
-    this.items = [];
 
-    var items = Array.prototype.slice.call(this.el.children);
+    var item, items = Array.prototype.slice.call(this.el.children);
 
     for(var i = 0, j = items.length; i < j; i += 1) {
-      this.items[i] = new TabBarItem(items[i]);
+      item =  new TabBarItem(items[i]);
+      this.items[i] = item;
+      this._bindEventsOnItem(item);
     }
   
     if(this.items.length > 0) {
       this.selectedItem = this.items[0];
     }
+
   }
 };
 
+})(this, document, ion = this.ionic || {});

hacking/TabBar.unit.js

@@ -53,10 +53,46 @@ describe('TabBar view', function() {
     expect(items[2].el.classList.contains('active')).toEqual(false);
   });
 
-  it('Should set icon', function() {
+  it('Should set item icon', function() {
     items = tabBar.getItems();
 
     var item = items[0];
     expect(item.getIcon()).toBe(undefined);
   });
+
+  it('Should handle item click event', function() {
+    var item = items[0];
+    spyOn(item, 'onTap');
+
+    var event = new CustomEvent('tap', {
+      target: item.el
+    });
+    item.el.dispatchEvent(event);
+
+    expect(item.onTap).toHaveBeenCalled();
+  });
+
+  it('Should unbind item on destroy', function() {
+    var item = items[0];
+    spyOn(item, 'onTap');
+
+    var event = new CustomEvent('tap', {
+      target: item.el
+    });
+    item.el.dispatchEvent(event);
+
+    expect(item.onTap).toHaveBeenCalled();
+
+    item.onTap.isSpy = false;
+    spyOn(item, 'onTap');
+
+    item.destroy();
+
+    var event = new CustomEvent('tap', {
+      target: item.el
+    });
+    item.el.dispatchEvent(event);
+
+    expect(item.onTap).not.toHaveBeenCalled();
+  });
 });

hacking/TabBarController.js

@@ -1,6 +1,8 @@
 TabBarController = function(options) {
   this.tabBar = options.tabBar;
 
+  this._bindEvents();
+
   this.controllers = [];
 
   // Bind or set our tabWillChange callback
@@ -9,6 +11,12 @@ TabBarController = function(options) {
 };
 
 TabBarController.prototype = {
+  // Start listening for events on our tab bar
+  _bindEvents: function() {
+    this.tabBar.onTabSelected = function(e) {
+    };
+  },
+
   selectController: function(index) {
     var shouldChange = true;