Basic authentication is done.(need refactor)

src/directives/side-nav.js

@@ -0,0 +1,41 @@
+angular.module('codexen.directives')
+  .directive('sideNav', function(){
+    return {
+      templateUrl:'directives/side-nav.tpl.html',
+      controller:'SideNavController as vm'
+    }
+  })
+  .controller('SideNavController', function($auth, User, $rootScope, $scope){
+    var vm = this
+
+    vm.isAuthenticated = $auth.isAuthenticated()
+
+    var reloadUser = function(){
+      if(vm.isAuthenticated){
+        User.me().success(function (data){
+          console.log('currentUser', data)
+          vm.currentUser = data.user
+        })
+      }
+    }
+    reloadUser()
+
+    vm.signOut = function () {
+      $auth.logout()
+        .then(function () {
+          console.log('Sign Out')
+          $rootScope.$broadcast('userSignOut')
+        })
+    }
+
+    $scope.$on('userSignIn', function () {
+      vm.isAuthenticated = true
+      reloadUser()
+    })
+
+    $scope.$on('userSignOut', function () {
+      vm.isAuthenticated = false
+      vm.currentUser = null
+
+    })
+  })

src/directives/side-nav.tpl.html

@@ -0,0 +1,26 @@
+
+<div class="current-user">
+  <div ng-if="vm.currentUser">
+    <img width="30" ng-src="http://www.gravatar.com/avatar/{{ vm.currentUser.email | gravatar }}">
+    <span ng-bind="vm.currentUser.name"></span>
+    <span class="dropdown" dropdown is-open>
+      <button type="button" name="button" dropdown-toggle class="btn btn-default dropdown-toggle"><i class="fa fa-caret-down"></i></button>
+      <ul class="dropdown-menu">
+        <li>
+          <a ng-click="vm.signOut()"><i class="fa fa-signout"></i> Sign Out</a>
+        </li>
+      </ul>
+    </span>
+
+  </div>
+  <div ng-if="!vm.currentUser">
+    <span>Guest</span>
+  </div>
+</div>
+
+<p>Side Nav</p>
+<ul class="nav nav-pills nav-stacked">
+  <li>
+    <a href="">My Page</a>
+  </li>
+</ul>