CRUD finished for Schools on frontend

app/views/api/tournament.jbuilder

@@ -4,6 +4,7 @@ json.cache! ["api_tournament", @tournament] do
     json.(@tournament, :id, :name, :address, :director, :director_email, :tournament_type, :created_at, :updated_at, :user_id)
     
     json.schools @tournament.schools do |school|
+      json.id school.id
       json.name school.name
       json.score school.score
     end

frontend/app/js/controllers/tournament-controller.js

@@ -10,6 +10,14 @@ app.controller("tournamentController", function($scope, tournamentsService, $rou
       $scope.tournament = data;
     });
     
+    $scope.refreshTournamentData = function(){
+      tournamentsService.tournamentDetails($routeParams.id).then(function(data) {
+        //this will execute when the 
+        //AJAX call completes.
+        $scope.tournament = data;
+      });
+    };
+    
     // refresh tournament data every 10 seconds
     // setInterval(function(){ 
     //   tournamentsService.tournamentDetails($routeParams.id).then(function(data) {
@@ -33,6 +41,7 @@ app.controller("tournamentController", function($scope, tournamentsService, $rou
       $scope.showWeightSeeds = !$scope.showWeightSeeds;
     };
     
+    
     $scope.showBoutBoard = false;
     
     $scope.toggleBoutBoard = function(){
@@ -48,5 +57,30 @@ app.controller("tournamentController", function($scope, tournamentsService, $rou
       }
     };
     
+    
+    $scope.newSchool = null;
+    
+    $scope.saveNewSchool = function(){
+      $scope.newSchool.tournament_id = $scope.tournament.id;
+      tournamentsService.saveNewSchool($scope.newSchool).then(function(data) {
+        $scope.tournament.schools.push(data);
+      });
+      $scope.newSchool = null;
+      $('#NewSchool').modal('hide');
+    };
+    
+    $scope.deleteSchool = function(school){
+      if (confirm('Are you sure you want to delete ' + school.name + '?')) {
+        tournamentsService.deleteSchool(school).then(function(data) {
+          $scope.tournament.schools.splice( $scope.tournament.schools.indexOf(school), 1 );
+        });
+      }
+    };
+    
+    $scope.updateSchool = function(school){
+      tournamentsService.updateSchool(school);
+      $('#EditSchool' + school.id).modal('hide');
+    };
+    
   
 });

frontend/app/js/services/tournaments-service.js

@@ -1,7 +1,7 @@
 
 app.factory('tournamentsService', tournamentsService);
 
-function tournamentsService($http){
+function tournamentsService($http,$rootScope){
     var service = {};
     
     service.getMyTournaments = function(user){
@@ -34,16 +34,65 @@ function tournamentsService($http){
             method: "GET"
         }).then(successResponse, errorCallback);
     };
+    
+    service.saveNewSchool = function(newSchool){
+        return $http({
+            url: '/schools.json',
+            method: "POST",
+
+            data: {
+                school: {
+                    'name': newSchool.name,
+                    'tournament_id': newSchool.tournament_id
+                }
+            },
+            headers: {
+                "Content-Type": "application/json"
+            }
+        }).then(successResponse, errorCallback);
+    };
+    
+    service.deleteSchool = function(school){
+        return $http({
+            url: '/schools/' + school.id + '/',
+            method: "DELETE"
+        }).then(successResponse, errorCallback);
+    };
+    
+    service.updateSchool = function(schoolToEdit){
+        return $http({
+            url: '/schools/' + schoolToEdit.id,
+            method: "PATCH",
+            data: {
+                school: {
+                    'name': schoolToEdit.name,
+                    'tournament_id': schoolToEdit.tournament_id
+                }
+            },
+            headers: {
+                "Content-Type": "application/json"
+            }
+        }).then(successResponse, errorCallback);
+    };
 
     function successResponse(response){
         // console.log("success log below");
         // console.log(response);
+        if(response.config.method == "POST" || response.config.method == "DELETE" || response.config.method == "PATCH"){
+            $rootScope.alertClass = "alert alert-success";
+            $rootScope.alertMessage = response.statusText;
+        }
         return response.data;
     }
 
     function errorCallback(err){
         // console.log("error log below");
         // console.log(err);
+        if(err.status > 0){
+            $rootScope.alertClass = "alert alert-danger";
+            $rootScope.alertMessage = err.statusText;
+        }
+        
         return err;
     }
 

frontend/app/pages/tournaments/tournaments-show.html

@@ -27,7 +27,7 @@
               </a>
               <div id="Schools" ng-if="showSchools == true">
                   <div class="panel-body">
-                    <button ng-if="isTournamentOwner(user.id,tournament.user_id)" class="btn btn-success btn-sm">Create New School</button>
+                    <button ng-if="isTournamentOwner(user.id,tournament.user_id)" class="btn btn-success btn-sm" data-toggle="modal" data-target="#NewSchool">Create New School</button>
                     <table class="table">
                       <thead>
                         <tr>
@@ -42,7 +42,10 @@
                           <tr ng-repeat="school in tournament.schools | orderBy : 'score'">
                             <td>{{ school.name }}</td>
                             <td>{{ school.score }}</td>
-                            <td ng-if="isTournamentOwner(user.id,tournament.user_id)"><button class="btn btn-sm">Edit</button><button class="btn btn-danger btn-sm">Destroy</button></td>
+                            <td ng-if="isTournamentOwner(user.id,tournament.user_id)">
+                              <button class="btn btn-sm" data-toggle="modal" data-target="#EditSchool{{school.id}}">Edit</button>
+                              <button ng-click="deleteSchool(school)"class="btn btn-danger btn-sm">Destroy</button>
+                            </td>
                           </tr>
                        </tbody>
                       </table>
@@ -85,7 +88,8 @@
               </a>
               <div id="Mats" ng-if="showBoutBoard == true">
                   <div class="panel-body">
-                      <table class="table">
+                      <p ng-if="tournament.matches.length == 0">Matches have not been generated</p> 
+                      <table ng-if="tournament.matches.length > 0"  class="table">
                         <thead>
                           <tr>
                             <th>Name</th>
@@ -107,9 +111,9 @@
                         </tbody>
                       </table>
                       <br>
-                      <h3>Matches not assigned</h3>
+                      <h3 ng-if="tournament.matches.length > 0" >Matches not assigned</h3>
                       <br>
-                      <table class="table">
+                      <table ng-if="tournament.matches.length > 0"  class="table">
                         <thead>
                           <tr>
                             <th>Round</th>
@@ -132,7 +136,7 @@
             </div>
         </div>
         
-    <!--Hidden modals-->
+    <!--Hidden modals for weight seeds-->
     <div ng-repeat="weight in tournament.weights">
       <div class="modal fade bs-example-modal-lg" id="Weight{{weight.id}}" tabindex="-1" role="dialog" aria-labelledby="Weight{{weight.id}}">
           <div class="modal-dialog modal-lg">
@@ -169,6 +173,49 @@
           </div>
         </div>      
     </div>
+    
+    <!--Hidden model for new school-->
+    <div class="modal fade bs-example-modal-lg" id="NewSchool" tabindex="-1" role="dialog" aria-labelledby="NewSchool">
+          <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                    <h3 class="modal-title" id="gridSystemModalLabel">New School for {{tournament.name}}</h3>
+                </div>
+                <div class="modal-body">
+                     <form class="form" id="formNewSchool" name="form" ng-submit="saveNewSchool()"> 
+                                <div class="form-group">
+                                  <input name="school[name]" class="form-control" id="name" type="text" placeholder="School Name" ng-model="newSchool.name"><br>
+                                  <input type="submit" id="btnSaveNewSchool" class="btn btn-success" value="Save School">
+                                </div>
+                      </form> 
+                </div>
+            </div>
+          </div>
+        </div> 
+        
+        <!--Hidden modals for school edit forms-->
+    <div ng-repeat="school in tournament.schools">
+      <div class="modal fade bs-example-modal-lg" id="EditSchool{{school.id}}" tabindex="-1" role="dialog" aria-labelledby="EditSchool{{school.id}}">
+          <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                    <h3 class="modal-title" id="gridSystemModalLabel">Edit {{school.name}}</h3>
+                </div>
+                <div class="modal-body">
+                     <form class="form" id="formEditSchool{{school.id}}" name="form" ng-submit="updateSchool(school)"> 
+                                <div class="form-group">
+                                  <input name="school[name]" class="form-control" id="name" type="text" placeholder="School Name" ng-model="school.name"><br>
+                                  <input type="submit" id="btnSaveNewSchool" class="btn btn-success" value="Save School">
+                                </div>
+                      </form> 
+                </div>
+            </div>
+          </div>
+        </div>      
+    </div>
+