AngularJS App

innermind.controllers.js

/*global angular $*/

(function () {
    'use strict';

    angular.module('innermind.controllers', [])
        .controller('MainCtrl', [
            '$scope',
            '$state',
            '$http',

            function ($scope, $state, $http) {

                console.log($state);

                $http.get('/api/').then(function (response) {
                    console.log(response);
                    $scope.data = response.data;
                });
            }
        ])
        .controller('LoginCtrl', [
            '$scope',
            '$state',
            '$http',
            '$location',
            'Auth',

            function ($scope, $state, $http, $location, Auth) {
                $scope.error = Object.create(null);
                $scope.user = Object.create(null);

                $http.get('/api/auth/login').then(function (response) {
                    console.log(response);
                    $scope.data = response.data;
                });
                $scope.login = function () {

                    $scope.loading = true;

                    Auth.login($scope.user.username, $scope.user.password, function (result) {
                        console.log(result);
                        $scope.test = result;
                        if (result === true) {
                            $http.get('/')
                                .success(function (response) {
                                    $scope.data = response.data;
                                });

                            $state.go('app/auth/');
                        } else {
                            $scope.error = {
                                message: 'Incorrect Username or Password.'
                            };
                            $scope.loading = false;
                        }
                    });
                };

                $scope.logout = function () {
                    $http.get('/api/auth/logout')
                        .success(function (response) {
                            $scope.data = response.data;

                            $state.go('/auth/login');
                            $state.reload();
                        });
                    $location.path('/auth/login');
                };
            }
        ])
        .controller('UserCtrl', [
            '$scope',
            '$state',

            function ($scope, $state) {

                $scope.user = {};
                console.log($state);
            }
        ]);

}());

innermind.js

/*global angular $*/

(function () {
    'use strict';

    angular.module('innermind', ['ui.router', 'ngStorage', 'innermind.controllers', 'innermind.services'])
        .config([
            '$qProvider',
            '$stateProvider',
            '$urlRouterProvider',
            '$locationProvider',

            function ($qProvider, $stateProvider, $urlRouterProvider, $locationProvider) {

                $qProvider.errorOnUnhandledRejections(false);

                $stateProvider
                    .state('app', {
                        abstract: true,
                        url: '/',
                        template: '<div ui-view></div>'
                    })
                    .state('app/', {
                        url: '/',
                        templateUrl: 'innermind/components/main/templates/index.html',
                        controller: 'MainCtrl',
                        resolve: {
                            data: function ($http) {
                                return $http.get('/api/');
                            }
                        }
                    })

                    .state('app/auth', {
                        abstract: true,
                        url: '/auth'

                    })
                    .state('app/auth/login', {
                        url: '/auth/login',
                        templateUrl: 'innermind/components/auth/templates/login.html',
                        controller: 'LoginCtrl',
                        resolve: {
                            data: function ($http) {
                                return $http.get('/api/auth/login');
                            }
                        }
                    })
                    .state('app/auth/logout', {
                        url: '/auth/logout',
                        templateUrl: 'innermind/components/auth/templates/login.html',
                        controller: 'LoginCtrl',
                        resolve: {
                            data: function ($http) {
                                return $http.get('/api/auth/logout');
                            }
                        }
                    })
                    .state('app/auth/register', {
                        url: '/auth/register',
                        templateUrl: 'innermind/components/auth/templates/register.html'
                    })
                    .state('app/auth/', {
                        url: '/dashboard',
                        templateUrl: 'innermind/components/main/templates/index.html',
                        controller: 'MainCtrl',
                        resolve: {
                            data: function ($http) {
                                return $http.get('/api/');
                            }
                        }
                    });

                $urlRouterProvider.otherwise('/dashboard');

                $locationProvider.html5Mode(true);
                //$locationProvider.hashPrefix('!');
            }
        ])

        .run([
            '$rootScope',
            '$state',
            '$stateParams',

            function ($rootScope, $state, $stateParams) {

                var on$stateChangeStateStart = function (event, toState, toParams, fromState, fromParams, options) {
                    /*console.log('event: ', event);
                    console.log('toState: ', toState);
                    console.log('toParams: ', toParams);
                    console.log('fromState: ', fromState);
                    console.log('fromParams: ', fromParams);
                    console.log('options: ', options);*/
                };

                var on$stateChangeStateSuccess = function (event, toState, toParams, fromState, fromParams) {
                    /*console.log('event: ', event);
                    console.log('toState: ', toState);
                    console.log('toParams: ', toParams);
                    console.log('fromState: ', fromState);
                    console.log('fromParams: ', fromParams);*/

                    $('.sidebar').find('[ui-sref="' + toState.name + '"]').addClass('selected');
                    $('.sidebar').find('[ui-sref="' + fromState.name + '"]').removeClass('selected');
                };

                /*
                  * It's very handy to add references to $state and $stateParams to the $rootScope
                  * so that you can access them from any scope within your applications.For example,
                  * <li ng-class="{ active: $state.includes('contacts.list') }"> will set the <li>
                  * to active whenever 'contacts.list' or one of its decendents is active.
                 */

                $rootScope.$state = $state;
                $rootScope.$stateParams = $stateParams;

                $rootScope.$on('$stateChangeStart', on$stateChangeStateStart);
                $rootScope.$on('$stateChangeSuccess', on$stateChangeStateSuccess);

            }
        ]);
}());

innermind.services.js

/*global angular $*/

(function () {
    'use strict';

    angular.module('innermind.services', [])
        .factory('Auth', function AuthenticationService($rootScope, $http, $localStorage) {

            var services = Object.create(null);

            services.login = function (username, password, callback) {
                $http.post('/auth/login', $scope.user)
                    .success(function (response) {
                        $scope.data = response.data;
                        if (response.token) {
                            console.log($localStorage);
                            $localStorage.currentUser = {username: username, token: response.token};

                            $http.defaults.headers.common.Authorization = 'Bearer ' + response.token;

                            callback(true);
                        } else {
                            callback(false);
                        }
                    });
            };

            services.logout = function () {
                delete $localStorage.currentUser;
                $http.defaults.headers.common.Authorization = '';
            };

            return services;
        })
        .factory('User', function ($http) {

            return {
                getAll: function () {
                    return $http.get('/api/users');
                }
            };
        });

}());