Skip to content

Commit d8ee8a3

Browse files
akashbanerjeeakashbanerjee
committed
Initial Commit
1 parent 322e74a commit d8ee8a3

File tree

8 files changed

+560
-0
lines changed

8 files changed

+560
-0
lines changed

‎menu-search-REST-API/foundItems.html‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<h3 ng-if="menu.isEmpty();" style="color: red;">Nothing found</h3>
2+
<div ng-show="menu.found.length">
3+
<h4 style="color: green;">Menu Retreived!</h4>
4+
<div class = "table-responsive" style="display:block;overflow:auto;max-height:248px;">
5+
<table class = "table table-hover table-bordered table-striped" >
6+
<thead>
7+
<tr>
8+
<td style="width:10px;">Short Name</td>
9+
<td style="width:20px;">Name</td>
10+
<td style="width:30px;">Description</td>
11+
<td style="width:15px;">Remove</td>
12+
</tr>
13+
</thead>
14+
<tbody>
15+
<tr ng-repeat="item in menu.found" >
16+
<td style="width:10px;">{{item.short_name}}</td>
17+
<td style="width:20px;">{{item.name}}</td>
18+
<td style="width:30px;">{{item.description}}</td>
19+
<td style="width:15px;"><button ng-click="menu.onRemove({index: $index});">Don't want this one!</button></td>
20+
</tr>
21+
</tbody>
22+
</table>
23+
</div>
24+
</div>

‎menu-search-REST-API/index.html‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<title>Narrow Down Your Menu Choice</title>
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<script src = "scripts/jquery-3.2.1.min.js"></script>
7+
<script src="scripts/angular.min.js"></script>
8+
<script src="scripts/app.js"></script>
9+
10+
<link rel="stylesheet" href="styles/bootstrap.min.css">
11+
<link rel="stylesheet" href="styles/styles.css">
12+
</head>
13+
<body ng-app="NarrowItDownApp">
14+
<div class="container" ng-controller="NarrowItDownController as menu">
15+
<h1>Narrow Down Your Chinese Menu Choice</h1>
16+
<form class="form-inline">
17+
18+
<div class="form-group">
19+
<input type="text" ng-model="menu.itemName" placeholder="search term" class="form-control">
20+
</div>
21+
<div class="form-group narrow-button">
22+
<button class="btn btn-primary" ng-click="menu.getMatchedMenuItems();">Narrow It Down For Me!</button>
23+
</div>
24+
25+
</form>
26+
<!-- Loader implemented -->
27+
<div ng-show="menu.searchButtonText === 'Searching'" class="loader"></div>
28+
<!-- found-items should be implemented as a component -->
29+
<found-items
30+
found="menu.found"
31+
on-remove="menu.removeItem(index)"></found-items>
32+
</div>
33+
34+
</body>
35+
</html>

‎menu-search-REST-API/loader/itemsloaderindicator.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<div class="loader"></div>

‎menu-search-REST-API/scripts/angular.min.js‎

Lines changed: 332 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎menu-search-REST-API/scripts/app.js‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
(function () {
2+
'use strict';
3+
4+
angular.module('NarrowItDownApp', [])
5+
.controller('NarrowItDownController', NarrowItDownController )
6+
.service('MenuSearchService', MenuSearchService)
7+
.constant('ApiBasePath', "https://davids-restaurant.herokuapp.com")
8+
.directive('foundItems', FoundItems );
9+
10+
function FoundItems() {
11+
var ddo = {
12+
templateUrl: 'foundItems.html',
13+
scope: {
14+
found: '<',
15+
onRemove: '&'
16+
},
17+
18+
controller: MenuSearchDirectiveController,
19+
controllerAs: 'menu',
20+
bindToController: true,
21+
22+
23+
};
24+
return ddo;
25+
}
26+
27+
function MenuSearchDirectiveController() {
28+
var menu = this;
29+
30+
menu.isEmpty = function() {
31+
return menu.found !== undefined && menu.found.length === 0;
32+
};
33+
}
34+
35+
36+
NarrowItDownController.$inject = ['MenuSearchService'];
37+
function NarrowItDownController (MenuSearchService) {
38+
var menu = this;
39+
menu.itemName = "";
40+
menu.searchButtonText = "";
41+
console.log("menu.searchButtonText", menu.searchButtonText);
42+
43+
menu.getMatchedMenuItems = function() {
44+
45+
menu.searchButtonText = "Searching";
46+
console.log("menu.searchButtonText", menu.searchButtonText);
47+
if(menu.itemName === "") {
48+
menu.found =[];
49+
return;
50+
}
51+
52+
var promise= MenuSearchService.getMatchedMenuItems(menu.itemName);
53+
promise.then(function(response){
54+
55+
menu.searchButtonText = "Searched";
56+
console.log("menu.searchButtonText", menu.searchButtonText);
57+
menu.found = response;
58+
})
59+
.catch(function(error) {
60+
console.log("Something went wrong", error);
61+
});
62+
};
63+
64+
menu.removeItem = function(itemIndex) {
65+
MenuSearchService.removeItem(itemIndex);
66+
};
67+
68+
}
69+
70+
71+
MenuSearchService.$inject = ['$http', 'ApiBasePath'];
72+
function MenuSearchService($http, ApiBasePath) {
73+
var service = this;
74+
var foundItems = [];
75+
76+
77+
service.getMatchedMenuItems = function(itemName) {
78+
79+
return $http({
80+
method: "GET",
81+
url: (ApiBasePath + "/menu_items.json")
82+
}).then(function (result) {
83+
84+
var items = result.data.menu_items;
85+
foundItems = [];
86+
87+
for (var i = 0; i < items.length; i++) {
88+
if (items[i].description.toLowerCase().indexOf(itemName.toLowerCase()) >= 0) {
89+
foundItems.push(items[i]);
90+
}
91+
}
92+
console.log("result: ", foundItems);
93+
return foundItems;
94+
});
95+
96+
97+
};
98+
99+
service.removeItem = function(itemIndex) {
100+
foundItems.splice(itemIndex,1);
101+
};
102+
}
103+
104+
105+
106+
})();

‎menu-search-REST-API/scripts/jquery-3.2.1.min.js‎

Lines changed: 4 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎menu-search-REST-API/styles/bootstrap.min.css‎

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎menu-search-REST-API/styles/styles.css‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
h1 {
2+
margin-bottom: 30px;
3+
}
4+
input[type="text"] {
5+
width: 200px;
6+
float: left;
7+
}
8+
.narrow-button {
9+
float: left;
10+
margin-left: 10px;
11+
}
12+
.loader {
13+
display: block;
14+
margin-left: 5px;
15+
font-size: 10px;
16+
float: left;
17+
border-top: 1.1em solid rgba(147, 147, 147, 0.2);
18+
border-right: 1.1em solid rgba(147, 147, 147, 0.2);
19+
border-bottom: 1.1em solid rgba(147, 147, 147, 0.2);
20+
border-left: 1.1em solid #676767;
21+
-webkit-transform: translateZ(0);
22+
-ms-transform: translateZ(0);
23+
transform: translateZ(0);
24+
-webkit-animation: load8 1.1s infinite linear;
25+
animation: load8 1.1s infinite linear;
26+
}
27+
.loader,
28+
.loader:after {
29+
border-radius: 50%;
30+
width: 3em;
31+
height: 3em;
32+
}
33+
@-webkit-keyframes load8 {
34+
0% {
35+
-webkit-transform: rotate(0deg);
36+
transform: rotate(0deg);
37+
}
38+
100% {
39+
-webkit-transform: rotate(360deg);
40+
transform: rotate(360deg);
41+
}
42+
}
43+
@keyframes load8 {
44+
0% {
45+
-webkit-transform: rotate(0deg);
46+
transform: rotate(0deg);
47+
}
48+
100% {
49+
-webkit-transform: rotate(360deg);
50+
transform: rotate(360deg);
51+
}
52+
}

0 commit comments

Comments
 (0)