added nav controller, added Authenicated to , added properties to resolve, etc

Author: jacksonhoose

client/app/src/js/app.js

@@ -32,8 +32,7 @@ function config($urlRouterProvider, $stateProvider, $locationProvider, $httpProv
             });
         }
       },
-      views:  {
-
+      views: {
 
         // main view
         '': {
@@ -78,7 +77,17 @@ function config($urlRouterProvider, $stateProvider, $locationProvider, $httpProv
       url: '/screenshot/:screenshotId',
       templateUrl: '/views/screenshot.html',
       controller: 'ScreenshotController',
-      controllerAs: 'screenshotCtrl'
+      controllerAs: 'screenshotCtrl',
+      resolve: {
+        screenshot: function($stateParams, $window, Screenshot) {
+          return Screenshot.getScreenshot($stateParams.username, $stateParams.screenshotId)
+            .then(function(response){
+              return response;
+            }).catch(function(err){
+              return err;
+            });
+        }
+      }
     })
 
     /**
@@ -134,6 +143,16 @@ function AttachTokens($window) {
   };
 }
 
+function run($rootScope, $location, Auth) {
+  $rootScope.Authenticated = Auth.isAuth();
+
+  $rootScope.$on('$stateChangeStart', function(event) {
+    $rootScope.Authenticated = Auth.isAuth();
+  }.bind(this));
+
+}
+run.$inject = ['$rootScope', '$location', 'Auth'];
+
 angular
   .module('Archivr', [
     'Archivr.auth',
@@ -142,10 +161,12 @@ angular
     'Archivr.screenshots',
     'Archivr.screenshot',
     'Archivr.services.Auth',
+    'Archivr.nav',
     'Archivr.services.User',
     'Archivr.services.Screenshot',
     'Archivr.userPage',
     'ui.router'
   ])
   .config(config)
+  .run(run)
   .factory('AttachTokens', AttachTokens);

client/app/src/js/controllers/auth.js

@@ -23,18 +23,15 @@ function AuthController($window, $location, Auth, User) {
     Auth.signup({
       username: user,
       password: pass
-    })
-    .then(function(response) {
+    }).then(function(response) {
       console.log(response);
       // $window.localStorage.setItem('com.archivr', token);
       // $location.path('/screenshots');
-    })
-    .catch(function(error) {
+    }).catch(function(error) {
       console.error(error);
     });
   };
 
-
   this.logout = function(){
     console.log('Signed out');
     Auth.signout();

client/app/src/js/controllers/nav.js

@@ -0,0 +1,27 @@
+/**
+ * NavController
+ * ====================
+ * Handles control across the navigation bar
+ */
+
+function NavController($rootScope, Auth) {
+
+  this.loggedIn = $rootScope.Authenticated;
+
+  $rootScope.$watch('Authenticated', function(authenticated) {
+    this.loggedIn = authenticated;
+  }.bind(this));
+
+  // ng-click function for header logout
+  this.logout = function() {
+    Auth.signout();
+  };
+
+}
+NavController.$inject = ['$rootScope', 'Auth'];
+
+angular.module('Archivr.nav', [
+  'Archivr.services.User',
+  'Archivr.services.Auth'
+]).controller('NavController', NavController);
+

client/app/src/js/controllers/profileBar.js

@@ -6,7 +6,7 @@
 
 function ProfileBarController(User) {
 
-  this.user = User.user;
+  this.user = User.getUser();
 
 }
 ProfileBarController.$inject = ['User'];

client/app/src/js/controllers/screenshot.js

@@ -4,7 +4,7 @@
  * Handles display of a single screenshot.
  */
 
-function ScreenshotController(Screenshot, User) {
+function ScreenshotController(Screenshot, User, screenshot) {
 
   this.screenshot = {};
 
@@ -15,9 +15,11 @@ function ScreenshotController(Screenshot, User) {
         this.screenshot = data;
       });
   };
+
   this.getScreenshot();
+
 }
-ScreenshotController.$inject = ['Screenshot', 'User'];
+ScreenshotController.$inject = ['Screenshot', 'User', 'screenshot'];
 
 angular.module('Archivr.screenshot', [
   'Archivr.services.Screenshot',

client/app/src/js/controllers/screenshots.js

@@ -4,9 +4,12 @@
  * Handles display of a user screenshots.
  */
 
-function ScreenshotsController($location, screenshots, Screenshot) {
+function ScreenshotsController($stateParams, $location, screenshots, Screenshot, User) {
+
   this.screenshots = screenshots;
   this.url = '';
+  this.isUser = User.getUser() !== null && User.getUser().username === $stateParams.username;
+
   this.addScreenshot = function(url){
     Screenshot.addScreenshot(url)
       .success(function(data){
@@ -26,9 +29,11 @@ function ScreenshotsController($location, screenshots, Screenshot) {
 }
 
 ScreenshotsController.$inject = [
+  '$stateParams',
   '$location',
   'screenshots',
-  'Screenshot'
+  'Screenshot',
+  'User'
 ];
 
 angular.module('Archivr.screenshots', [

client/app/src/js/controllers/userPage.js

@@ -5,7 +5,6 @@
  */
 
 function UserPageController($stateParams, User) {
-
   // Get User object for reference
   // this.user = new User($stateParams.username);
 

client/app/src/js/services/Auth.js

@@ -4,7 +4,7 @@
  * Responsible for authenticating user. Handles JWT from server which contains
  * user model data. JWT is stored in localStorage as 'com.archivr'.
  */
-function Auth($http, $location, $window) {
+function Auth($http, $location, $window, User) {
   // sign a user in
   var signin = function(user) {
     return $http({
@@ -32,23 +32,21 @@ function Auth($http, $location, $window) {
   };
 
   var signout = function() {
-    console.log('in services... signout!!!');
+    console.log('Logging user out, destroying JWT');
     $window.localStorage.removeItem('com.archivr');
+    User.setUser(null);
     $location.path('/login');
-    console.log('hello');
   };
 
-
   return {
     signin: signin,
     signup: signup,
     isAuth: isAuth,
     signout: signout
   };
 }
-Auth.$inject = ['$http', '$location', '$window'];
-
+Auth.$inject = ['$http', '$location', '$window', 'User'];
 
 angular.module('Archivr.services.Auth', [
+  'Archivr.services.User'
 ]).factory('Auth', Auth);
-

client/app/src/js/services/Screenshot.js

@@ -17,15 +17,13 @@ function Screenshot($http, User) {
 
   var addScreenshot = function (url) {
     var user = User.getUser();
-    console.log(user);
     return $http.post('/api/user/' + user.username + '/screenshot', {
       url: url
     });
   };
 
-  var getScreenshot = function(id){
-    var user = User.getUser();
-    return $http.get('/api/user/' + user.username + '/screenshot/' + id)
+  var getScreenshot = function(user, id){
+    return $http.get('/api/user/' + user + '/screenshot/' + id)
       .then(function(response) {
         return response;
       });

client/app/src/js/services/User.js

@@ -1,13 +1,12 @@
 function User() {
-
-  var user = {};
+  var user = null;
 
   var getUser = function () {
     return user;
   };
 
-  var setUser = function(user){
-    user = user;
+  var setUser = function(newUser){
+    user = newUser;
   };
 
   return {
@@ -16,5 +15,5 @@ function User() {
   };
 }
 
-angular.module('Archivr.services.User', [
-]).factory('User', User);
+angular.module('Archivr.services.User', [])
+  .factory('User', User);

client/app/src/views/login.html

@@ -1,7 +1,6 @@
 <!-- inside signup -->
 
 <div id='login'>
-
   <h1>Login</h1>
   <form name="signupForm" ng-submit='authCtrl.login(username, password)'>
     <label for="username">Enter username:</label>

client/app/src/views/profileBar.html

@@ -4,6 +4,7 @@
   </div>
   <div class="row">
     <h1>{{ userPageCtrl.user.username }}</h1>
+    <a href="/edit">Edit profile</a>
     <p>Screenshots: {{ userPageCtrl.user.images.length }}</p>
     <p>Galleries: {{ userPageCtrl.user.galleries.length }}</p>
   </div>

client/app/src/views/screenshot.html

@@ -1,4 +1,4 @@
-<div class="col-xs-11 col-md-11" ng-controller='ScreenshotController'>
+<div class="col-xs-12 col-md-12" ng-controller='ScreenshotController'>
   <a href="#">
     <img src="{{ screenshot.url }}" alt="{{ screenshot.description }}">
   </a>

client/app/src/views/userScreenshots.html

@@ -1,17 +1,19 @@
 <!-- Template for UserScreenshots -->
 
-  <form name="newScreenshot" class="form-inline" id="newScreenshot" novalidate ng-submit="newScreenshot.$valid && screenshotsCtrl.addScreenshot(url)">
+  <form ng-if="screenshotsCtrl.isUser" name="newScreenshot" class="form-inline" id="newScreenshot" novalidate ng-submit="newScreenshot.$valid && screenshotsCtrl.addScreenshot(url)">
     <!-- <label for="newUrl">Enter URL:</label> -->
     <input placeholder="Enter URL here..." id="newUrl" type="url" name="url" ng-model="url" class="form-control">
     <button class="btn" type="submit">Get Screenshot</button>
   </form>
 
-  <div class="container">
-      <ul class="row" >
+  <div class="row">
+    <div class="col-md-12">
+      <ul class="list-unstyled">
         <li class="col-xs-6 col-md-3" ng-repeat="screenshot in screenshotsCtrl.screenshots">
           <a href="#" class="thumbnail">
             <img ng-click="screenshotCtrl.changeView(screenshot._id)" src="{{ screenshot.sizes.small.url }}" alt="{{ screenshot.sizes.small.description }}">
           </a>
         </li>
       </ul>
+    </div>
   </div>

server/views/_partials/header.jade

@@ -1,5 +1,5 @@
 //- partial for the header bar
-header(role="header" id="header")
+header(role="header" id="header" ng-controller="NavController as NavCtrl")
   nav.navbar.navbar-inverse.navbar-fixed-top
     .container-fluid
       .navbar-header
@@ -9,11 +9,11 @@ header(role="header" id="header")
           span.icon-bar
         a(class="navbar-brand" href="/") Archivr
       ul(class="nav navbar-nav navbar-right")
-        li
+        li(ng-hide="NavCtrl.loggedIn")
           a(href="/login") Login
-        li
+        li(ng-hide="NavCtrl.loggedIn")
           a(href="/signup") Signup
-        li
-          a(href="/logout") Logout
+        li(ng-show="NavCtrl.loggedIn")
+          a(href="#" ng-click="NavCtrl.logout()") Logout