-
jquery ctrl
+
+
+
+
{{foodCRUD.name || "Add New Food"}}
-
+
diff --git a/app/sandbox/scrap.html b/app/sandbox/scrap.html
index 0f5f52a..a46ffc0 100644
--- a/app/sandbox/scrap.html
+++ b/app/sandbox/scrap.html
@@ -1,3 +1,21 @@
+
+
+
+
Grade
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/assets/css/main.css b/assets/css/main.css
index 6af37ad..57b92aa 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -24,6 +24,9 @@ a {
width: 100%;
position: absolute;
}
+select.no-materialize {
+ display: block;
+}
ul.tabs {
background: none;
}
@@ -98,6 +101,7 @@ ul.tabs .tab a:hover {
flex-wrap: wrap;
}
.foods .card-panel {
+ background: #f5f5f5;
flex-grow: 1;
display: flex;
padding: 0;
@@ -110,7 +114,6 @@ ul.tabs .tab a:hover {
transform: scale(0.95);
}
.foods .card-panel .health {
- background-color: #7ae076;
width: 3em;
min-width: 3em;
min-height: 3em;
@@ -118,6 +121,16 @@ ul.tabs .tab a:hover {
display: flex;
align-items: center;
justify-content: center;
+ background-color: #808080;
+}
+.foods .card-panel .health.rank-1 {
+ background-color: #7ae076;
+}
+.foods .card-panel .health.rank-2 {
+ background-color: #fddf7b;
+}
+.foods .card-panel .health.rank-3 {
+ background-color: #fd7b7b;
}
.foods .card-panel .health i {
color: #fff;
@@ -141,66 +154,60 @@ ul.tabs .tab a:hover {
.foods .card-panel.add .health {
background-color: rgba(0,0,0,0.27);
}
-.food-crud {
+.foodModal {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: fixed; /* Stay in place */
+ z-index: 1; /* Sit on top */
+ left: 0;
+ top: 0;
+ width: 100%; /* Full width */
+ height: 100%; /* Full height */
+ overflow: auto; /* Enable scroll if needed */
+ background-color: #000; /* Fallback color */
+ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+}
+.foodModal .CRUD {
font-size: 1.1em;
padding: 1em;
border: 1px solid #f0f0f0;
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
background: #fff;
}
-.food-crud [type="radio"]:not(:checked)+label,
-.food-crud [type="radio"]:checked+label {
+.foodModal .CRUD [type="radio"]:not(:checked)+label,
+.foodModal .CRUD [type="radio"]:checked+label {
padding-left: 1.7em;
padding-right: 1em;
}
-.food-crud .grade {
+.foodModal .CRUD .grade {
margin-bottom: 2em;
}
-.food-crud h4 {
+.foodModal .CRUD h4 {
margin: 5px 0 25px 0;
}
-.food-crud p {
+.foodModal .CRUD p {
font-size: 1.1em;
font-weight: 500;
color: #bbb;
margin-bottom: 5px;
}
-.food-crud a.btn {
+.foodModal .CRUD a.btn {
width: 48%;
}
-.food-crud .orange {
+.foodModal .CRUD .orange {
float: right;
}
-.food-crud .nutrition {
+.foodModal .CRUD .nutrition {
margin-bottom: 1.5em;
}
-.food-crud .nutrition td {
+.foodModal .CRUD .nutrition td {
padding: 0.5em 5px;
}
-.food-crud .nutrition td:first-child {
+.foodModal .CRUD .nutrition td:first-child {
font-weight: 500;
width: 50%;
}
-.modal_ .editContent {
- display: none;
-}
-.modal_.editMode .editContent {
- display: inline;
-}
-.modal_ {
- align-items: center;
- justify-content: center;
- display: none; /* Hidden by default */
- position: fixed; /* Stay in place */
- z-index: 1; /* Sit on top */
- left: 0;
- top: 0;
- width: 100%; /* Full width */
- height: 100%; /* Full height */
- overflow: auto; /* Enable scroll if needed */
- background-color: #000; /* Fallback color */
- background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
-}
.spacer {
height: 80px;
}
diff --git a/assets/js/bundle.js b/assets/js/bundle.js
index 9aa9625..cca9a93 100644
--- a/assets/js/bundle.js
+++ b/assets/js/bundle.js
@@ -52,25 +52,6 @@ app.config( function ($routeProvider, $locationProvider) {
// $locationProvider.html5Mode(true);
});
-app.controller('root', ['$scope', '$location', function ($scope, $location) {
-
- $scope.$watch('page', function () {
- $scope.title = $scope.page.title + ' | F2E';
- }, true);
-
- $scope.page = {
- 'title' : 'Root',
- 'id' : 'root',
- 'blackNav' : false
- };
-
- $scope.loop = ['Apple Pie','Bananas','Peas','Newman\'s Own Oil and Vinegar Dressing','Cucumber Salad','Kraft Macaroni and Cheese','Some food','Some more food','Some junk food','Some healthy food'];
-
- $scope.go = function ( path ) {
- $location.path( path );
- };
-}]);
-
app.controller('NewsCtrl', ['$scope', function ($scope) {
$scope.page.title = 'News';
$scope.page.id = 'news';
@@ -99,6 +80,25 @@ app.controller('EmailController', ['$scope', function ($scope) {
$scope.email = "rogangabe@gmail.com";
}]);
+app.controller('root', ['$scope', '$location', function ($scope, $location) {
+
+ $scope.$watch('page', function () {
+ $scope.title = $scope.page.title + ' | F2E';
+ }, true);
+
+ $scope.page = {
+ 'title' : 'Root',
+ 'id' : 'root',
+ 'blackNav' : false
+ };
+
+ $scope.loop = ['Apple Pie','Bananas','Peas','Newman\'s Own Oil and Vinegar Dressing','Cucumber Salad','Kraft Macaroni and Cheese','Some food','Some more food','Some junk food','Some healthy food'];
+
+ $scope.go = function ( path ) {
+ $location.path( path );
+ };
+}]);
+
app.controller('404Ctrl', ['$scope', function ($scope) {
$scope.page.title = '404';
$scope.page.id = '404';
@@ -108,6 +108,39 @@ app.controller('404Ctrl', ['$scope', function ($scope) {
}]);
+app.controller('FoodCtrl', ['$scope', '$http', function ($scope, $http) {
+ $http.get("assets/json/data.json")
+ .then(function(response) {
+ $scope.foods = response.data.data;
+ });
+
+ $scope.page.title = 'Food';
+ $scope.page.id = 'food';
+
+ $scope.editMode = false;
+ $scope.createMode = false;
+
+ $scope.foodCRUD = {}
+
+ $scope.edit = function (foodToEdit) {
+ $scope.editMode = true;
+ $scope.foodCRUD = foodToEdit;
+ $scope.foodCRUD.rank_mode = "0"; //TODO: remove this when API implements it
+ };
+
+ $scope.create = function () {
+ $scope.createMode = true;
+ $scope.foodCRUD = {}
+ $scope.foodCRUD.rank_mode = "0";
+ };
+
+ $scope.cancel = function () {
+ $scope.editMode = false;
+ $scope.createMode = false;
+ };
+}]);
+
+
app.controller('CategoryCtrl', ['$scope', function ($scope) {
$scope.page.title = 'Categories';
$scope.page.id = 'cat';
@@ -117,15 +150,6 @@ app.controller('CategoryCtrl', ['$scope', function ($scope) {
}]);
-app.controller('FoodCtrl', ['$scope', function ($scope) {
- $scope.page.title = 'Food';
- $scope.page.id = 'food';
- $scope.page.yourVar = "globalStuff";
-
- $scope.var2 = "localStuff";
-}]);
-
-
app.controller('LoginCtrl', ['$scope', function ($scope) {
$scope.page.title = 'Login';
$scope.page.id = 'login';
diff --git a/assets/json/data.json b/assets/json/data.json
new file mode 100644
index 0000000..e028ef2
--- /dev/null
+++ b/assets/json/data.json
@@ -0,0 +1,27 @@
+{
+ "status": "ok",
+ "code": "200",
+ "data": [
+ {
+ "id": "1",
+ "name": "banana",
+ "barcode": "2342342342",
+ "rank_id": "1",
+ "category_id": "3"
+ },
+ {
+ "id": "2",
+ "name": "pop tarts",
+ "barcode": "2342342342",
+ "rank_id": "3",
+ "category_id": "2"
+ },
+ {
+ "id": "3",
+ "name": "cinnamon",
+ "barcode": "2342342342",
+ "rank_id": "2",
+ "category_id": "1"
+ }
+ ]
+}
diff --git a/assets/styl/reset.styl b/assets/styl/reset.styl
index 1b9926f..c7d1efe 100644
--- a/assets/styl/reset.styl
+++ b/assets/styl/reset.styl
@@ -20,6 +20,9 @@ a
width: 100%
position: absolute
+select.no-materialize
+ display: block
+
ul.tabs
background: none
.tab a