3 files changed, 46 insertions, 0 deletions

diff --git a/client/angular/users/components/login/login.component.html b/client/angular/users/components/login/login.component.html
new file mode 100644
index 000000000..940694515
--- /dev/null
+++ b/client/angular/users/components/login/login.component.html
@@ -0,0 +1,14 @@
+<h3>Login</h3>
+<form role="form" (submit)="login(username.value, password.value)">
+  <div class="form-group">
+    <label for="username">Username</label>
+    <input type="text" #username class="form-control" id="username" placeholder="Username">
+  </div>
+
+  <div class="form-group">
+    <label for="password">Password</label>
+    <input type="password" #password class="form-control" id="password" placeholder="Password">
+  </div>
+
+  <input type="submit" value="Login" class="btn btn-default">
+</form>
diff --git a/client/angular/users/components/login/login.component.scss b/client/angular/users/components/login/login.component.scss
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/client/angular/users/components/login/login.component.scss
diff --git a/client/angular/users/components/login/login.component.ts b/client/angular/users/components/login/login.component.ts
new file mode 100644
index 000000000..0881a3a15
--- /dev/null
+++ b/client/angular/users/components/login/login.component.ts
@@ -0,0 +1,32 @@
+import { Component } from 'angular2/core';
+import { Router } from 'angular2/router';
+
+import { AuthService } from '../../services/auth.service';
+import { AuthStatus } from '../../models/authStatus';
+import { Token } from '../../models/token';
+
+@Component({
+  selector: 'my-user-login',
+  styleUrls: [ 'app/angular/users/components/login/login.component.css' ],
+  templateUrl: 'app/angular/users/components/login/login.component.html'
+})
+
+export class UserLoginComponent {
+  constructor(private _authService: AuthService, private _router: Router) {}
+
+  login(username: string, password: string) {
+    this._authService.login(username, password).subscribe(
+      result => {
+        if (result.error) return alert(result.error_description);
+
+        let token = new Token(result);
+        token.save();
+
+        this._authService.setStatus(AuthStatus.LoggedIn);
+
+        this._router.navigate(['VideosList']);
+      },
+      error => alert(error)
+    );
+  }
+}