Assignment2

index.html

@@ -12,11 +12,6 @@ <h1>UF Directory App</h1>
       <div class="row" ng-controller="ListingsController">
         <div class="col-md-6">
           <div class="input-group" id="searchBar">
-            <!-- 
-
-                Implement a way to filter through listings using the search bar 
-
-              -->
             <span class="input-group-addon" id="sizing-addon1"><span class="glyphicon glyphicon-search"></span></span>
             <input type="text" class="form-control" placeholder="Search">
           </div>
@@ -27,28 +22,39 @@ <h1>UF Directory App</h1>
                 <th>Building Name</th>
                 <th></th>
               </tr>
-              <!-- 
-
-                  Fill in the rest of the table:
-                      * populate the rows with the code and name of each listing
-                      * include a way to remove individual listings
-
-                --> 
+              <<tr ng-repeat="listing in listings | filter:a ng-click="showDetails(listing)">
+                <td>{{listing.code}}</td>
+                <td>{{listing.name}}</td>
+                <td><button class="btn btn-danger" ng-click="deleteListing(listing)">Delete</button></td>
+                <td><button class="btn btn-info" ng-click="showDetails(listing)">Details</button>&nbsp;&nbsp;
+              </tr>
             </table>
           </div>
-          <!-- 
-
-              Write an HTML form that adds new listings to the directory 
-
-            -->
+          <h3>Add New Listing</h3> 
+            <form novalidate>
+              <h4>Code:</h4>
+              <input type="text" ng-model="listing.code" placeholder="Required..." required>
+              <br>
+              <h4>Building Name:</h4>
+              <input type="text" ng-model="listing.name" placeholder="Required..." required>
+              <br>
+              <h4>Coordinates:</h4>
+              <input type="text" ng-model="listing.coordinates.latitude" placeholder="Latitude...">
+              <br>
+              <input type="text" ng-model="listing.coordinates.longitude" placeholder="Longitude...">
+              <br>     
+              <h4>Address:</h4>
+              <input type="text" ng-model="listing.address" placeholder="Address...">
+              <br><br>
+              <button class="btn btn-success" ng-click="addListing()">Add</button>&nbsp;&nbsp;
+            </form>
         </div>
         <div class="col-md-6">
           <div class="jumbotron">
             <h2>Detailed Information</h2>
             <!-- 
 
-              Include a way to display detailed information about an individual listing:
-                   * consider how to use ng-click within the the table to implement this feature
+
 
              -->
           </div>
@@ -62,4 +68,4 @@ <h2>Detailed Information</h2>
     <script src="listingController.js"></script>
     <script src="listingFactory.js"></script>
   </body>
-</html>
+</html>

listingController.js

@@ -4,11 +4,25 @@ angular.module('listings').controller('ListingsController', ['$scope', 'Listings
     $scope.detailedInfo = undefined;
 
     /* 
-      Implement these functions in the controller to make your application function 
-      as described in the assignment spec. 
+
+
+
+
+
      */
-    $scope.addListing = function() {};
-    $scope.deleteListing = function(index) {};
-    $scope.showDetails = function(index) {};
+    $scope.addListing = function() {
+      if ($scope.listing.code && $scope.listing.name){
+          $scope.listing.code = $scope.listing.code.toUpperCase();
+          $scope.listings.push($scope.listing);
+          $scope.listing = "";
+        }
+    };
+    $scope.deleteListing = function(index) {
+        if($scope.listings[i].code == index.code) {
+            $scope.listings.splice(i, 1);
+        }
+    };
+    $scope.showDetails = function(index) {
+    };
   }
-]);
+]);