Temp

mtlynch · Oct 8, 2017 · f84bd98 · f84bd98
1 parent e52fe5c
commit f84bd98
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 35 deletions.
diff --git a/app/app.js b/app/app.js
@@ -1,19 +1,21 @@
 'use strict';
 
-var ketoHubApp = angular.module('ketoHubApp', ['firebase']);
+var ketoHubApp = angular.module('ketoHubApp', ['firebase', 'ui.bootstrap']);
 
 ketoHubApp
 .constant('buttonActiveClass', 'btn-primary')
 .constant('recipesPerPage', 10)
+.constant('maxPageButtons', 6)
 .constant('recipeCategories',
     ['breakfast', 'entree', 'side', 'dessert', 'snack', 'beverage',
     'condiment'])
 .controller('ketoHubCtrl',
   function($scope, $firebaseArray, $window, buttonActiveClass, recipesPerPage,
-    recipeCategories) {
+    maxPageButtons, recipeCategories) {
     $scope.currentPage = 1;
     $scope.pageSize = recipesPerPage;
     $scope.categories = recipeCategories;
+    $scope.maxPageButtons = maxPageButtons;
 
     var ref = $window.firebase.database().ref();
     $scope.recipes =  $firebaseArray(ref.child('recipes'));
@@ -29,14 +31,6 @@ ketoHubApp
       }
     });
 
-    $scope.selectPage = function(newPage) {
-      $scope.currentPage = newPage;
-    };
-
-    $scope.getPageClass = function(page) {
-      return $scope.currentPage == page ? buttonActiveClass : '';
-    };
-
     var currentCategory = null;
     $scope.selectCategory = function(newCategory) {
       $scope.currentPage = 1;
@@ -109,19 +103,6 @@ ketoHubApp
     return result;
   };
 })
-.filter('pageCount', function() {
-  return function(data, size) {
-    if (angular.isArray(data)) {
-      var result = [];
-      for (var i = 0; i < Math.ceil(data.length / size); i++) {
-        result.push(i);
-      }
-      return result;
-    } else {
-      return data;
-    }
-  };
-})
 .filter('capitalize', function() {
   return function(word) {
     return word.charAt(0).toUpperCase() + word.substr(1);

diff --git a/app/index.html b/app/index.html
@@ -60,6 +60,7 @@
   </div>
   <script src="https://www.gstatic.com/firebasejs/4.2.0/firebase.js"></script>
   <script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>
+  <script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
   <script>
     var config = {
       apiKey: "AIzaSyCglK8ZkZfL6QWWyEZf26z1BMPYFQM6wTw",

diff --git a/app/views/pagination.html b/app/views/pagination.html
diff --git a/app/views/recipeList.html b/app/views/recipeList.html
@@ -11,10 +11,14 @@
       </button>
     </div>
   </div>
-  <p>&nbsp;</p>
-  <ng-include src="'views/pagination.html'"></ng-include>
-  <p>&nbsp;</p>
-  <p>&nbsp;</p>
+  <pagination
+    ng-model="currentPage"
+    total-items="recipes.length"
+    class="pagination-sm"
+    items-per-page="pageSize"
+    max-size="maxPageButtons"
+    boundary-links="true">
+  </pagination>
   <div class="container recipes">
     <div
       class="well"
@@ -38,5 +42,12 @@ <h2>
       </div>
     </div>
   </div>
-  <ng-include src="'views/pagination.html'"></ng-include>
+  <pagination
+    ng-model="currentPage"
+    total-items="recipes.length"
+    class="pagination-sm"
+    items-per-page="pageSize"
+    max-size="maxPageButtons"
+    boundary-links="true">
+  </pagination>
 </div>