Introduce tabbed mode

hackerspace-bootstrap · Nov 30, 2016 · b244f50 · b244f50
1 parent 74f52eb
commit b244f50
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 5 deletions.
diff --git a/settings.js b/settings.js
@@ -22,6 +22,10 @@ var settings = {
         transaction: 'cash-register.ogg'
     },
 
+    index: {
+        tabbed: false
+    },
+
     /////////////////////////////////////////////////////////////////////////
     // payments
 

diff --git a/src/script/lib/controllers/index/index.html b/src/script/lib/controllers/index/index.html
@@ -3,9 +3,22 @@
         <alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{alert.msg}}</alert>
     </div>
 </div>
+
 <div class="row">
     <div class="col-xs-12">
-        <h3 translate>indexActiveUser</h3>
+        <ul class="nav nav-tabs" ng-if="mode.tabbed">
+            <li ng-class="{ 'active': mode.currentTab == 'active' }" ng-click="mode.currentTab = 'active'" >
+                <a translate>indexActiveUser</a>
+            </li>
+            <li ng-class="{ 'active': mode.currentTab == 'inactive' }" ng-click="mode.currentTab = 'inactive'">
+                <a translate>indexInactiveUser</a>
+            </li>
+        </ul>
+    </div>
+
+    <div class="col-xs-12" ng-if="mode.currentTab == 'active' || !mode.tabbed">
+        <h3 ng-hide="mode.tabbed" translate>indexActiveUser</h3>
+
         <ul class="user-list clearfix">
             <li ng-repeat="user in users | filter:isActiveUser | orderBy:'name' track by user.id"
                 ng-click="userClick(user.id)"
@@ -17,10 +30,10 @@ <h3 translate>indexActiveUser</h3>
             <li class="col-xs-2 panel panel-default create-user" ng-click="createUserClick()">+</li>
         </ul>
     </div>
-</div>
-<div class="row">
-    <div class="col-xs-12">
-        <h3 translate>indexInactiveUser</h3>
+
+    <div class="col-xs-12" ng-if="mode.currentTab == 'inactive' || !mode.tabbed">
+        <h3 ng-hide="mode.tabbed" translate>indexInactiveUser</h3>
+
         <ul class="user-list clearfix">
             <li ng-repeat="user in users | filter:isInactiveUser | orderBy:'name' track by user.id"
                 ng-click="userClick(user.id)"
@@ -32,4 +45,5 @@ <h3 translate>indexInactiveUser</h3>
             <li class="col-xs-2 panel panel-default create-user" ng-click="createUserClick()">+</li>
         </ul>
     </div>
+
 </div>
diff --git a/src/script/lib/controllers/index/index.js b/src/script/lib/controllers/index/index.js
@@ -27,6 +27,13 @@ angular
 
     .controller('IndexController', function ($scope, Location, User, Message) {
 
+        if (settings.index && settings.index.tabbed) {
+            $scope.mode = {
+                tabbed: true,
+                currentTab: 'active'
+            };
+        }
+
         $scope.userClick = function (userId) {
             Location.gotoUser(userId);
         };