menu-search-REST-API/index.html

<!doctype html>
<html lang="en">
  <head>
    <title>Narrow Down Your Menu Choice</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src = "scripts/jquery-3.2.1.min.js"></script>
    <script src="scripts/angular.min.js"></script>
    <script src="scripts/app.js"></script>

    <link rel="stylesheet" href="styles/bootstrap.min.css">
    <link rel="stylesheet" href="styles/styles.css">
  </head>
  <body ng-app="NarrowItDownApp">
    <div class="container" ng-controller="NarrowItDownController as menu">
      <h1>Narrow Down Your Chinese Menu Choice</h1>
      <form class="form-inline">

        <div class="form-group">
          <input type="text" ng-model="menu.itemName" placeholder="search term" class="form-control">
        </div>
        <div class="form-group narrow-button">
          <button class="btn btn-primary" ng-click="menu.getMatchedMenuItems();">Narrow It Down For Me!</button>
        </div>

      </form>
      <!-- Loader implemented -->
      <div ng-show="menu.searchButtonText === 'Searching'" class="loader"></div>
      <!-- found-items should be implemented as a component -->
      <found-items 
        found="menu.found" 
        on-remove="menu.removeItem(index)"></found-items>
    </div>

  </body>
</html>