alahouze/accountant
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add authentication in frontend.

Browse Source
This commit is contained in:
Alexis Lahouze 2015-12-18 10:52:31 +01:00
parent d4472925ee
commit 8bcabee6dd
2 changed files with 111 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

123
accountant/frontend/static/js/app.js
View File

@ -19,28 +19,33 @@ var accountantApp = angular.module("accountantApp", [
"mgcrea.ngStrap",
"highcharts-ng",
"jlareau.pnotify",
"http-auth-interceptor",
"Storage.Service",
"xeditable"
])
.config(function($httpProvider, $routeProvider, $locationProvider) {
// Define interceptors.
$httpProvider.interceptors.push(function($q, notificationService) {
return {
"response": function(response) {
if(response.data.ok === false) {
return $q.reject(response);
}
// TODO Intercept validation error.
return response;
},
.factory("sessionInjector", ["$storage", function($storage) {
var sessionInjector = {
request : function(config) {
var token = $storage.get('token');
"responseError": function(response) {
// TODO Intercept Authentication Required error
notificationService.error(response.data.text);
return $q.reject(response);
if(token) {
var token_type = $storage.get('token_type');
var authorization = token_type + " " + token;
config.headers["Authorization"] = authorization;
}
return config;
}
};
});
return sessionInjector;
}])
.config(["$httpProvider", "$routeProvider", "$locationProvider", "$storageProvider",
function($httpProvider, $routeProvider, $locationProvider, $storageProvider) {
// Define interceptors.
$httpProvider.interceptors.push('sessionInjector');
// Defining template and controller in function of route.
$routeProvider.when('/account/:accountId/operations', {
@ -58,9 +63,93 @@ var accountantApp = angular.module("accountantApp", [
// Enable HTML5 mode.
$locationProvider.html5Mode(true);
})
// Configure storage
// Set global prefix for stored keys
$storageProvider.setPrefix("accountant");
// Change the default storage engine
// Defaults to "local"
$storageProvider.setDefaultStorageEngine("session");
// Change the enabled storage engines
// Defaults to ['memory', 'cookie', 'session', 'local']
$storageProvider.setEnabledStorageEngines(['local', 'session']);
}])
.run(function(editableOptions) {
editableOptions.theme = 'bs3'; // bootstrap3 theme. Can be also 'bs2', 'default'
})
.controller("MainController", [
"$scope", "$rootScope", "$http", "authService", "notify", "$storage",
function($scope, $rootScope, $http, authService, notify, $storage) {
$scope.dialogShown = false;
$scope.showLoginForm = function(e) {
// First, if there are registered credentials, use them
if($scope.dialogShown) {
return;
}
$scope.dialogShown = true;
bootbox.dialog({
title: "Authentification requise",
message: '<form class="form-horizontal">' +
' <div class="form-group">' +
' <label for="email" class="col-sm-4 control-label">Adresse email</label>' +
' <div class="col-sm-8">' +
' <input type="text" class="form-control" id="email" ng-model="email" placeholder="Nom d\'utilisateur">' +
' </div>' +
' </div>' +
' <div class="form-group">' +
' <label for="password" class="col-sm-4 control-label">Mot de passe</label>' +
' <div class="col-sm-8">' +
' <input type="password" class="form-control" id="password" ng-model="password" placeholder="Mot de passe">' +
' </div>' +
' </div>' +
' </div>' +
'</form>',
buttons: {
login: {
label: "Login",
className: "btn-primary",
callback: function(result) {
$scope.dialogShown = false;
var email = $('#email').val();
var password = $('#password').val();
$http.post(
"/api/users/login",
{
"email": email,
"password": password
}
).success(function(result) {
// TODO Alexis Lahouze 2015-08-28 Handle callback.
// Call to /api/login to retrieve the token
$storage.set('token_type', result.token_type);
$storage.set('token', result.token);
$storage.set('expiration_date', result.expiration_date);
authService.loginConfirmed();
});
}
},
cancel: {
label: "Annuler",
className: "btn-default",
callback: function(result) {
authService.loginCancelled(null, "Login cancelled by user action.");
$scope.dialogShown = false;
}
}
}
});
};
$rootScope.$on("event:auth-loginRequired", $scope.showLoginForm);
}])
;

6
accountant/frontend/templates/layout.html
View File

@ -75,6 +75,8 @@
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-strap/dist/angular-strap.tpl.js') }}"></script>
<script type="text/javascript" src="{{ url_for('bower.static', filename='highcharts-ng/dist/highcharts-ng.js') }}"></script>
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-pnotify/src/angular-pnotify.js') }}"></script>
<script type="text/javascript" src="{{ url_for('bower.static', filename='angular-http-auth/src/http-auth-interceptor.js') }}"></script>
<script type="text/javascript" src="{{ url_for('bower.static', filename='meanie-angular-storage/release/meanie-angular-storage.js') }}"></script>
<!-- xeditable -->
<link href="{{ url_for('bower.static', filename='angular-xeditable/dist/css/xeditable.css') }}" rel="stylesheet">
@ -83,7 +85,7 @@
<body style="padding-bottom: 50px; padding-top: 70px">
<!-- Navbar -->
<nav class="navbar navbar-fixed-top navbar-inverse" ng-controller="AccountController">
<nav class="navbar navbar-fixed-top navbar-inverse">
<div class="container-fluid">
<!-- Brand -->
<div class="navbar-header">
@ -92,7 +94,7 @@
</div>
</nav>
<div class="container-fluid">
<div class="container-fluid" ng-controller="MainController">
<div ng-view></div>
</div>