Fix login shaking and update AuthService

app/public/services/AuthSvc.js

@@ -1,31 +1,31 @@
 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',
             url: '/api/auth/login',
             data: {
                 displayname: displayname,
                 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({
-            method: 'GET',
+            method: 'POST',
             url: '/api/auth/logout'
-        }).then(() => {
-            $window.location.href = '/';
         });
-    };
 
-    this.register = (displayname, password, invite) => {
-        return $http({
+    this.register = async (displayname, password, invite) =>
+        $http({
             method: 'POST',
             url: '/api/auth/register',
             data: {
@@ -33,18 +33,15 @@ angular.module('AuthSvc', []).service('AuthService', ['$http', '$window', functi
                 password: password,
                 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',
             url: '/api/auth/whoami'
-        }).then(function(res) {
-            cb(res.data);
+        }).catch(err => {
+            throw err;
         });
-    }
 }]);

app/public/shimapan/components/LoginComp.js

@@ -1,15 +1,26 @@
-var angular = require('angular');
+const angular = require('angular');
 
 angular.module('LoginComp', ['AuthSvc']).component('loginComponent', {
     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');
+            }
         };
     }]
 });

public/views/shimapan/login-form.html

@@ -4,7 +4,7 @@
         <form ng-submit="login()">
             <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"/>
-            <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>
     </fieldset>
 </div>