@@ -1,31 +1,31 @@ | |||||
var angular = require('angular'); | var angular = require('angular'); | ||||
angular.module('AuthSvc', []).service('AuthService', ['$http', '$window', function($http, $window) { | |||||
this.login = (displayname, password) => { | |||||
return $http({ | |||||
angular.module('AuthSvc', []).service('AuthService', ['$http', '$window', function($http) { | |||||
this.login = async (displayname, password) => | |||||
$http({ | |||||
method: 'POST', | method: 'POST', | ||||
url: '/api/auth/login', | url: '/api/auth/login', | ||||
data: { | data: { | ||||
displayname: displayname, | displayname: displayname, | ||||
password: password | password: password | ||||
} | } | ||||
}).then(res => { | |||||
if (res.status === 200) | |||||
$window.location.href = '/home'; | |||||
}) | |||||
}; | |||||
}).catch(err => { | |||||
if (err.status === 401) | |||||
throw 'unauthorized'; | |||||
else if (err.status === 429) | |||||
throw 'ratelimited'; | |||||
else | |||||
throw 'unknown'; | |||||
}); | |||||
this.logout = () => { | |||||
this.logout = async () => | |||||
$http({ | $http({ | ||||
method: 'GET', | |||||
method: 'POST', | |||||
url: '/api/auth/logout' | url: '/api/auth/logout' | ||||
}).then(() => { | |||||
$window.location.href = '/'; | |||||
}); | }); | ||||
}; | |||||
this.register = (displayname, password, invite) => { | |||||
return $http({ | |||||
this.register = async (displayname, password, invite) => | |||||
$http({ | |||||
method: 'POST', | method: 'POST', | ||||
url: '/api/auth/register', | url: '/api/auth/register', | ||||
data: { | data: { | ||||
@@ -33,18 +33,15 @@ angular.module('AuthSvc', []).service('AuthService', ['$http', '$window', functi | |||||
password: password, | password: password, | ||||
invite: invite | invite: invite | ||||
} | } | ||||
}).then(function(res) { | |||||
if (res.status === 200) | |||||
$window.location.href = '/home'; | |||||
}).catch(err => { | |||||
throw err; | |||||
}); | }); | ||||
}; | |||||
this.whoami = function(cb) { | |||||
return $http({ | |||||
this.whoami = async () => | |||||
$http({ | |||||
method: 'GET', | method: 'GET', | ||||
url: '/api/auth/whoami' | url: '/api/auth/whoami' | ||||
}).then(function(res) { | |||||
cb(res.data); | |||||
}).catch(err => { | |||||
throw err; | |||||
}); | }); | ||||
} | |||||
}]); | }]); |
@@ -1,15 +1,26 @@ | |||||
var angular = require('angular'); | |||||
const angular = require('angular'); | |||||
angular.module('LoginComp', ['AuthSvc']).component('loginComponent', { | angular.module('LoginComp', ['AuthSvc']).component('loginComponent', { | ||||
templateUrl: '/views/shimapan/login-form.html', | templateUrl: '/views/shimapan/login-form.html', | ||||
controller: ['$scope', '$timeout', 'AuthService', function($scope, $timeout, AuthService) { | |||||
$scope.login = function() { | |||||
AuthService.login($scope.username, $scope.password).catch(function() { | |||||
$scope.error = true; | |||||
$timeout(function() { | |||||
$scope.error = false; | |||||
}, 820); | |||||
}); | |||||
controller: ['$scope', '$window', '$timeout', 'AuthService', function($scope, $window, $timeout, AuthService) { | |||||
$scope.flash = classname => { | |||||
$scope.$apply(() => $scope[classname] = true); | |||||
$timeout(() => $scope[classname] = false, 820); | |||||
}; | |||||
$scope.error = false; | |||||
$scope.login = async () => { | |||||
try { | |||||
await AuthService.login($scope.username, $scope.password); | |||||
$window.location.href = '/home'; | |||||
} catch(err) { | |||||
if (err === 'limited') | |||||
$scope.flash('warn'); | |||||
else if (err === 'unauthorized') | |||||
$scope.flash('error'); | |||||
else | |||||
$scope.flash('error'); | |||||
} | |||||
}; | }; | ||||
}] | }] | ||||
}); | }); |
@@ -4,7 +4,7 @@ | |||||
<form ng-submit="login()"> | <form ng-submit="login()"> | ||||
<input id="username" placeholder="Username" class="form-control" type="text" ng-model="username"/> | <input id="username" placeholder="Username" class="form-control" type="text" ng-model="username"/> | ||||
<input id="password" placeholder="Password" class="form-control" type="password" ng-model="password"/> | <input id="password" placeholder="Password" class="form-control" type="password" ng-model="password"/> | ||||
<button type="submit" class="btn" ng-class="{shake: error}">Submit</button> | |||||
<button type="submit" class="btn" ng-class="{error: error, warn: warn}">Submit</button> | |||||
</form> | </form> | ||||
</fieldset> | </fieldset> | ||||
</div> | </div> |