Created basic viewing pages in angular

Can now search and view tournaments. Can now view team scores, weights and seeds, mats and bout board

frontend/app/js/app.js

@@ -7,4 +7,5 @@ var app =  angular.module("wrestlingdev", ["ngRoute"]).run(function($rootScope)
   $rootScope.alert = function(thing) {
     alert(thing);
   };
-});
+});
+

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

@@ -0,0 +1,12 @@
+'use strict';
+app.controller("tournamentController", function($scope, tournamentsService, $routeParams) {
+    $scope.message = "Test message in scope.";
+    
+    // $scope.tournamentData = "test";
+    tournamentsService.tournamentDetails($routeParams.id).then(function(data) {
+      //this will execute when the 
+      //AJAX call completes.
+      $scope.tournament = data;
+    });
+    
+});

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

@@ -1,5 +1,6 @@
+'use strict';
+
 app.controller("tournamentsController", function($scope, tournamentsService) {
-    $scope.message = "Test message in scope.";
 
     tournamentsService.getAllTournaments().then(function(data) {
        //this will execute when the 

frontend/app/js/directives/loading.js

@@ -0,0 +1,24 @@
+(function(){
+    app.directive('usSpinner',   ['$http', '$rootScope' ,function ($http, $rootScope){
+        return {
+            link: function (scope, elm, attrs)
+            {
+                $rootScope.spinnerActive = false;
+                scope.isLoading = function () {
+                    return $http.pendingRequests.length > 0;
+                };
+
+                scope.$watch(scope.isLoading, function (loading)
+                {
+                    $rootScope.spinnerActive = loading;
+                    if(loading){
+                        elm.removeClass('ng-hide');
+                    }else{
+                        elm.addClass('ng-hide');
+                    }
+                });
+            }
+        };
+
+    }]);
+}).call(this);

frontend/app/js/routes.js

@@ -13,18 +13,32 @@
 
 
 
-app.config(['$routeProvider',
-  function($routeProvider) {
-    $routeProvider.
-      when('/tournaments', {
-        templateUrl: 'tournaments.html',
-        controller: 'tournamentsController'
-      }).
-    //   when('/phones/:phoneId', {
-    //     templateUrl: 'partials/phone-detail.html',
-    //     controller: 'PhoneDetailCtrl'
-    //   }).
-      otherwise({
-        redirectTo: '/tournaments'
-      });
-  }]);
+app.config(['$routeProvider', '$locationProvider', function($routeProvider,$locationProvider) {
+  
+  $routeProvider.when('/', {
+    templateUrl: 'home.html',
+  });   
+
+  $routeProvider.when('/tournaments', {
+    templateUrl: 'tournaments-search.html',
+    controller: 'tournamentsController'
+  });
+  
+  $routeProvider.when('/tournaments/:id', {
+    templateUrl: 'tournaments-show.html',
+    controller: 'tournamentController'
+  });
+  
+  $routeProvider.when('/about', {
+    templateUrl: 'about.html',
+  });
+  
+  $routeProvider.when('/tutorials', {
+    templateUrl: 'tutorials.html',
+  });
+  
+  $routeProvider.otherwise({redirectTo: '/'});
+  
+  //this give me normal routes instead of /#/
+  $locationProvider.html5Mode(true);
+}]);

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

@@ -0,0 +1,47 @@
+
+app.factory('tournamentsService', tournamentsService);
+
+function tournamentsService($http){
+    var service = {};
+    
+
+
+    service.getAllTournaments = function(){
+        return $http({
+            url: '/api/tournaments/',
+            method: "GET"
+        }).then(successResponse, errorCallback);
+    };
+
+    service.searchTournaments = function(search){
+        return $http({
+          method: 'GET',
+          url: '/api/tournaments/',
+          params: {
+              search: search
+          }
+        }).then(successResponse, errorCallback);
+    };
+
+    service.tournamentDetails = function(tournamentId){
+        return $http({
+            url: '/api/tournaments/' + tournamentId,
+            method: "GET"
+        }).then(successResponse, errorCallback);
+    };
+
+    function successResponse(response){
+        console.log("success log below");
+        console.log(response);
+        return response.data;
+    }
+
+    function errorCallback(err){
+        console.log("error log below");
+        console.log(err);
+        return err;
+    }
+
+    return service;
+}
+

frontend/app/js/tournaments-service.js

@@ -1,35 +0,0 @@
-app.factory('tournamentsService', function($http){
-
-      
-   return {
-     getAllTournaments: function() {
-       //since $http.get returns a promise,
-       //and promise.then() also returns a promise
-       //that resolves to whatever value is returned in it's 
-       //callback argument, we can return that.
-       return $http.get('/api/tournaments/').then(function(result) {
-           return result.data;
-       });
-     },
-     
-     searchTournaments: function(search){
-        return $http({
-          method: 'GET',
-          url: '/api/tournaments/',
-          params: {
-              search: search
-          }
-        }).then(function successCallback(response) {
-            // this callback will be called asynchronously
-            // when the response is available
-            return response.data;
-          }, function errorCallback(response) {
-            // called asynchronously if an error occurs
-            // or server returns response with an error status.
-            return response;
-          }); 
-     }
-    };
-
-});
-