Merge branch 'develop' of https://github.uconn.edu/dmd-web-and-mobile…

…/foodbank into rules-endpoints
dmd-web-and-mobile · Feb 27, 2017 · 6c40a8d · 6c40a8d
2 parents 295b3a2 + c0820eb
commit 6c40a8d
Show file tree

Hide file tree

Showing 13 changed files with 411 additions and 206 deletions.
diff --git a/app/app.js b/app/app.js
@@ -1,36 +1,40 @@
-var app = angular.module('app', ['ngRoute', 'ngResource']);
+var app = angular.module('app', ['ngRoute', 'ngResource', 'ngCookies']);
 
 // Root controllers in /root/ folder
 // Page controllers in /pages/[your-page] folder
 
 // Factories
 
-// TODO: 'Foods' factory TEMPORARY
 app.factory('Foods', function($resource) {
   return $resource('assets/json/foods.json');
 });
 
-// Just does a PUT request when u call Food.update
-app.factory('Food', function ($resource) {
-  // {food: '@id'} means replace :food with $scope.foodCRUD.id
-  var data = $resource('http://foodbank.develop.digitalmediauconn.org/api/food/:food', {food: '@id'}, {
-    update:{ method:'PUT' }
-  });
-  return data;
+app.factory('FoodDetail', function($resource) {
+  // http://foodbank.develop.digitalmediauconn.org/api/getProductInfo/049000031249
+  // return $resource('https://example.com/api/food/:barcode', {barcode: '@barcode'});
+  return $resource('assets/json/foodDetail.json');
 });
 
 app.factory('Categories', function($resource) {
   return $resource('assets/json/categories.json');
 });
 
-// TODO: 'Nutrients' factory TEMPORARY
 app.factory('Nutrients', function($resource) {
   return $resource('assets/json/nutrients.json');
 });
 
-app.factory('Nutrient', function ($resource) {
-  var data = $resource('http://foodbank.develop.digitalmediauconn.org/api/nutrients/:nutrient', {nutrient: '@id'}, {
-    update:{ method:'PUT' }
-  });
-  return data;
-});
+// Just does a PUT request when u call Food.update
+// app.factory('Food', function ($resource) {
+//   // {food: '@id'} means replace :food with $scope.foodCRUD.id
+//   var data = $resource('http://foodbank.develop.digitalmediauconn.org/api/food/:food', {food: '@id'}, {
+//     update:{ method:'PUT' }
+//   });
+//   return data;
+// });
+
+// app.factory('Nutrient', function ($resource) {
+//   var data = $resource('http://foodbank.develop.digitalmediauconn.org/api/nutrients/:nutrient', {nutrient: '@id'}, {
+//     update:{ method:'PUT' }
+//   });
+//   return data;
+// });
diff --git a/app/pages/food/ctrl.js b/app/pages/food/ctrl.js
@@ -1,27 +1,28 @@
-app.controller('FoodCtrl', ['$scope', '$http', 'Foods', 'Food', 'Categories', function ($scope, $http, Foods, Food, Categories) {
+app.controller('FoodCtrl', ['$scope', '$http', 'Foods', 'FoodDetail', 'Categories', '$cookies', function ($scope, $http, Foods, FoodDetail, Categories, $cookies) {
   $scope.page.title = 'Food';
   $scope.page.id = 'food';
 
+  // Cookie for Table/Card view prefence
+  $scope.tableView = $cookies.get('showTable') === 'true';
+  $scope.$watch('tableView', function () {
+    $cookies.put('showTable', $scope.tableView ? 'true' : 'false');
+  });
+
   // Initialize Filters
   $scope.foods = [];
   $scope.categories = [];
   $scope.rankSelection = {
-    "green": true,
-    "yellow": true,
-    "red": true,
-    "gray": true
+    "1": true,
+    "2": true,
+    "3": true,
+    "4": true
   };
   $scope.categorySelection = { "all": true };
   $scope.searchTerm = "";
 
-
-
-  // Initialize CRUD modes
-  $scope.editMode = false;
-  $scope.createMode = false;
-
   // Initialize CRUD form
   $scope.foodCRUD = {};
+  $scope.nutrientDetail = [];
 
   // GET foods
   Foods.get({}, function (data) {
@@ -42,7 +43,6 @@ app.controller('FoodCtrl', ['$scope', '$http', 'Foods', 'Food', 'Categories', fu
   });
 
 
-
   // Set category filters to false
   $scope.resetCategorySelection = function () {
     $scope.categories.forEach(function(c){
@@ -51,43 +51,66 @@ app.controller('FoodCtrl', ['$scope', '$http', 'Foods', 'Food', 'Categories', fu
   }
   // Category filter function
   $scope.categoryFilter = function (food) {
-    return ( $scope.categorySelection[food.category_id] | $scope.categorySelection["all"] );
+    return ( $scope.categorySelection[food.category.id] | $scope.categorySelection["all"] );
   }
   // Rank filter function
   $scope.rankFilter = function (food) {
-    return ( $scope.rankSelection[food.rank_id] );
+    return ( $scope.rankSelection[food.rank.id] );
   }
 
 
-
-  // CRUD: edit food
-  $scope.edit = function (foodToEdit) {
-    $scope.editMode = true;
-    $scope.foodCRUD = foodToEdit;
-    $scope.foodCRUD.action = "update";
-    // console.log($scope.foodCRUD);
-  };
-
-  // CRUD: create food
-  $scope.create = function () {
-    $scope.createMode = true;
-    $scope.foodCRUD = {};
-    $scope.foodCRUD.rank_mode = "auto";
-    $scope.foodCRUD.action = "create";
-    // console.log($scope.foodCRUD);
+  // Modal : View Food
+  $scope.view = function (foodToView) {
+    $scope.showModal = true;
+    $scope.foodCRUD = foodToView;
+    FoodDetail.get({barcode: foodToView.barcode}, function (data) {
+      $scope.nutrientDetail = data.data.nutrients;
+    });
   };
 
-  // CRUD: cancel
+  // Modal : Cancel
   $scope.cancel = function () {
-    $scope.editMode = false;
-    $scope.createMode = false;
+    $scope.showModal = false;
   };
 
-  // CRUD: POST
-  $scope.submit = function () {
-    $scope.cancel(); // hide modal
-    Food.update($scope.foodCRUD);
-  };
+  // NOTE: End of code for now
+
+
+
+
+
+  // Initialize CRUD modes
+  // $scope.editMode = false;
+  // $scope.createMode = false;
+
+  // CRUD: edit food
+  // $scope.edit = function (foodToEdit) {
+  //   $scope.editMode = true;
+  //   $scope.foodCRUD = foodToEdit;
+  //   $scope.foodCRUD.action = "update";
+  //   console.log($scope.foodCRUD);
+  // };
+  //
+  // // CRUD: create food
+  // $scope.create = function () {
+  //   $scope.createMode = true;
+  //   $scope.foodCRUD = {};
+  //   $scope.foodCRUD.rank_mode = "auto";
+  //   $scope.foodCRUD.action = "create";
+  //   // console.log($scope.foodCRUD);
+  // };
+  //
+  // // CRUD: cancel
+  // $scope.cancel = function () {
+  //   $scope.editMode = false;
+  //   $scope.createMode = false;
+  // };
+  //
+  // // CRUD: POST
+  // $scope.submit = function () {
+  //   $scope.cancel(); // hide modal
+  //   Food.update($scope.foodCRUD);
+  // };
 
 
 }]);
diff --git a/app/pages/food/style.styl b/app/pages/food/style.styl
@@ -67,10 +67,6 @@
 
 
 
-// Table view
-
-
-
 
 .foods
   display: flex
@@ -113,13 +109,13 @@
     background-color: purple
     i
       color: white
-  .rank-green
+  .rank-1
     background-color: green
-  .rank-yellow
+  .rank-2
     background-color: yellow
-  .rank-red
+  .rank-3
     background-color: red
-  .rank-gray
+  .rank-4
     background-color: gray
 
 
@@ -157,6 +153,7 @@
     font-size: 1.1em
     padding: 1em
     border: 1px solid lightgray
+    min-width 300px
     my-box-shadow()
     background: white
     [type="radio"]:not(:checked)+label, [type="radio"]:checked+label
@@ -171,6 +168,9 @@
       font-weight: 500
       color: #BBB
       margin-bottom: 5px
+      span
+        color initial
+        font-weight normal
     a.btn
       width: 48%
     .orange
@@ -183,3 +183,48 @@
       td:first-child
         font-weight: 500
         width: 50%
+
+
+
+// Table view
+.foodTable
+  display flex
+  flex-flow: row wrap;
+  align-content: stretch;
+  width 100%
+
+.foodTableItem
+  display inline-flex
+  flex 1 430px
+  margin-bottom 12px
+  font-size 1.2em
+  align-items center
+  margin-right 1em
+  padding-right 1em
+  background #f5f5f5
+  +above(760px)
+    max-width calc(50% - 1em)
+  transition: all .2s
+  cursor: pointer
+  my-box-shadow()
+  &:hover
+    transform: scale(.95)
+  span
+    flex-basis 100px
+    margin-right 1em
+  .name
+    flex-basis 140px
+  .barcode
+    color #888
+    font-size 1rem
+    text-align right
+    margin-right 0
+  .health
+    height 35px
+    width @height
+    min-height @height
+    min-width @height
+    max-height @height
+    max-width @height
+    i
+      font-size 21px