Add ionicTabs#showBar() method to set/get whether the tabs bar is shown

ionic-team · Nov 9, 2015 · 7dd620d · 7dd620d · mintzhao · Dec 11, 2015
1 parent 3adb7fc
commit 7dd620d
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 3 deletions.
diff --git a/js/angular/controller/tabsController.js b/js/angular/controller/tabsController.js
@@ -8,6 +8,7 @@ function($scope, $element, $ionicHistory) {
   var selectedTab = null;
   var previousSelectedTab = null;
   var selectedTabIndex;
+  var isVisible = true;
   self.tabs = [];
 
   self.selectedIndex = function() {
@@ -114,4 +115,15 @@ function($scope, $element, $ionicHistory) {
     return false;
   };
 
+  self.showBar = function (show) {
+    if (arguments.length) {
+      if (show) {
+        $element.removeClass('tabs-item-hide');
+      } else {
+        $element.addClass('tabs-item-hide');
+      }
+      isVisible = !!show;
+    }
+    return isVisible;
+  };
 }]);
diff --git a/js/angular/service/tabsDelegate.js b/js/angular/service/tabsDelegate.js
@@ -48,7 +48,16 @@ IonicModule
    * @name $ionicTabsDelegate#selectedIndex
    * @returns `number` The index of the selected tab, or -1.
    */
-  'selectedIndex'
+  'selectedIndex',
+  /**
+   * @ngdoc method
+   * @name $ionicTabsDelegate#showBar
+   * @description
+   * Set/get whether the {@link ionic.directive:ionTabs} is shown
+   * @param {boolean} show Whether to show the bar.
+   * @returns {boolean} Whether the bar is shown.
+   */
+  'showBar',
   /**
    * @ngdoc method
    * @name $ionicTabsDelegate#$getByHandle

diff --git a/test/unit/angular/directive/tabs.unit.js b/test/unit/angular/directive/tabs.unit.js
@@ -2,12 +2,13 @@ describe('tabs', function() {
 
   describe('$ionicTabs controller', function() {
     beforeEach(module('ionic'));
-    var ctrl, scope;
+    var ctrl, scope, $element;
     beforeEach(inject(function($rootScope, $controller) {
       scope = $rootScope.$new();
+      $element = angular.element('<div>');
       ctrl = $controller('$ionicTabs', {
         $scope: scope,
-        $element: angular.element('<div>')
+        $element: $element
       });
     }));
 
@@ -184,6 +185,17 @@ describe('tabs', function() {
         uiSref: tab3.uiSref
       });
     });
+
+    it('.showBar with true/false should remove/add a tabs-item-hide class', function() {
+      var visible = ctrl.showBar();
+      expect(visible).toBe(true);
+      visible = ctrl.showBar(false);
+      expect(visible).toBe(false);
+      expect($element.hasClass('tabs-item-hide')).toBe(true);
+      visible = ctrl.showBar(true);
+      expect(visible).toBe(true);
+      expect($element.hasClass('tabs-item-hide')).toBe(false);
+    });
   });
 
   describe('ionTabs directive', function() {