initial commit

src/app/user/login.html

@@ -0,0 +1,29 @@
+<h1>Login</h1>
+
+<div class="section">
+  <form [formGroup]="form" (ngSubmit)="onSubmit()">
+    <div class="form-group">
+      <label for="email">Email</label>
+      <input formControlName="email" type="email" class="form-control" id="email" placeholder="Enter email">
+    </div>
+    <div class="form-group">
+      <label for="password">Password</label>
+      <input formControlName="password" type="password" class="form-control" id="password" placeholder="Password">
+    </div>
+    <div class="form-group form-check">
+      <input formControlName="stayLoggedIn" id="stayLoggedIn" type="checkbox" class="form-check-input" />
+      <label for="stayedLoggedIn" class="form-check-label">Stay logged in</label>
+    </div>
+    <p *ngIf="error" class="error">
+      {{error.message}}
+    </p>
+    <p *ngIf="resetSuccess">
+      Password reset link sent.
+    </p>
+    <p>
+      <a routerLink="/register">Register for a new account</a><br>
+      <a (click)="resetPassword()">Reset password</a>
+    </p>
+    <button type="submit" class="btn btn-primary" [disabled]="!form.valid">Login</button>
+  </form>
+</div>

src/app/user/login.ts

@@ -0,0 +1,89 @@
+import { Component } from '@angular/core';
+import { Logger } from '../core/logger';
+import { 
+  FormGroup,
+  FormControl,
+  Validators,
+  FormBuilder,
+  AbstractControl,
+  ValidationErrors
+} from '@angular/forms';
+import { Router } from '@angular/router';
+import { ConfigService } from '../core/config.service';
+import { UserService } from '../core/user.service';
+import { SessionService } from '../core/session.service';
+import { User } from '../shared/user';
+import { RegisterPage } from '../register/register';
+import { AppError } from '../shared/error';
+import { Util } from '../shared/util';
+
+
+@Component({
+  selector: 'app-login',
+  templateUrl: 'login.html'
+})
+export class LoginPage {
+  public form: FormGroup;
+  public error: AppError;
+  public resetSuccess: boolean;
+
+  constructor(
+    private log: Logger,
+    private router: Router,
+    private configService: ConfigService,
+    private userService: UserService,
+    private sessionService: SessionService,
+    private fb: FormBuilder
+   ) {
+    this.form = fb.group({
+      'email': ['', Validators.required],
+      'password': ['', Validators.required],
+      'stayLoggedIn': [false, Validators.required]
+    });
+  }
+
+  onSubmit() {
+    this.error = null;
+    this.resetSuccess = false;
+
+    //this.dataService.setLoading(true);
+    let formUser = new User(this.form.value);
+    this.log.debug(formUser);
+
+    let sessionId = Util.newGuid();
+
+    this.sessionService.login(this.form.value.email, this.form.value.password, sessionId)
+      .subscribe(() => {
+        // save session id if desired
+        if(this.form.value.stayLoggedIn) {
+          this.configService.put('sessionId', sessionId);
+        }
+      },
+      error => {
+          this.log.debug('An error occurred!');
+          this.log.debug(error);
+
+          this.error = error;
+
+          if(error.code === 401) {
+            this.error = new AppError('Invalid username or password');
+          }
+      });
+  }
+
+  resetPassword() {
+    this.error = null;
+    this.resetSuccess = false;
+
+    if(!this.form.value.email) {
+      this.error = new Error('Please input email address');
+      return;
+    }
+
+    this.userService.resetPassword(this.form.value.email).subscribe(() => {
+      this.resetSuccess = true;
+    }, err => {
+      this.error = err;
+    });
+  }
+}

src/app/user/logout.html

@@ -0,0 +1 @@
+<p>Logged out</p>

src/app/user/logout.ts

@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core';
+import { ConfigService } from '../core/config.service';
+import { SessionService } from '../core/session.service';
+import { RegisterPage } from '../register/register';
+
+
+@Component({
+  selector: 'app-logout',
+  templateUrl: 'logout.html'
+})
+export class LogoutPage implements OnInit {
+
+  constructor(private configService: ConfigService, private sessionService: SessionService) {
+  }
+
+  ngOnInit() {
+    this.configService.clear();
+    this.sessionService.logout();
+  }
+}

src/app/user/reset.html

@@ -0,0 +1,30 @@
+<h1>Reset Password</h1>
+<div class="section">
+  <div *ngIf="success">
+    <p>
+      Your password has been updated. Please <a routerLink="/login">login</a> to your account.
+    </p>
+  </div>
+
+  <div *ngIf="!success">
+    <form [formGroup]="changePasswordForm" (ngSubmit)="changePassword()">
+      <div class="form-group row">
+        <label for="password" class="col-sm-3 col-form-label">New Password</label>
+        <div class="col-sm-9">
+          <input formControlName="password" id="password" type="password" class="form-control" />
+        </div>
+      </div>
+      <div class="form-group row">
+        <label for="password2" class="col-sm-3 col-form-label">Repeat Password</label>
+        <div class="col-sm-9">
+          <input formControlName="password2" id="password2" type="password" class="form-control" />
+        </div>
+      </div>
+      <p *ngIf="changePasswordForm.controls.password2.errors?.mismatchedPassword">
+        Passwords do not match.
+      </p>
+      <p *ngIf="error" class="error">{{error.message}}</p>
+      <button type="submit" class="btn btn-primary" [disabled]="!changePasswordForm.valid">Save</button>
+    </form>
+  </div>
+</div>

src/app/user/reset.ts

@@ -0,0 +1,62 @@
+import { Component } from '@angular/core';
+import { Router, ActivatedRoute } from '@angular/router';
+import { 
+  FormGroup,
+  Validators,
+  FormBuilder,
+  AbstractControl
+} from '@angular/forms';
+import { AppError } from '../shared/error';
+import { UserService } from '../core/user.service';
+
+
+@Component({
+  selector: 'app-resetpassword',
+  templateUrl: 'reset.html'
+})
+export class ResetPasswordPage {
+  public error: AppError;
+  public success: boolean;
+  public changePasswordForm: FormGroup;
+  private code: string;
+
+  constructor(
+    private router: Router,
+    private route: ActivatedRoute,
+    private userService: UserService,
+    private fb: FormBuilder
+  ) {
+    this.route.queryParams.subscribe(params => {
+      this.code = params['code'];
+
+      if(!this.code) {
+        throw new Error('Missing code');
+      }
+    }, err => {
+      this.error = err;
+    });
+
+    this.changePasswordForm = this.fb.group({
+      'password': [null, Validators.required],
+      'password2': [null, Validators.required]
+    }, {
+      validator: this.passwordMatchValidator
+    });
+  }
+
+  passwordMatchValidator(control: AbstractControl) {
+    if(control.get('password').value === control.get('password2').value) {
+      return null;
+    } else {
+      control.get('password2').setErrors({mismatchedPassword: true});
+    }
+  }
+
+  changePassword() {
+    this.userService.confirmResetPassword(this.changePasswordForm.value.password, this.code).subscribe(() => {
+      this.success = true;
+    }, err => {
+      this.error = err;
+    });
+  }
+}

src/app/user/user.module.ts

@@ -0,0 +1,25 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { LoginPage } from './login';
+import { LogoutPage } from './logout';
+import { VerifyUserPage } from './verify';
+import { ResetPasswordPage } from './reset';
+import { ReactiveFormsModule } from '@angular/forms';
+import { AppRoutingModule } from '../app-routing.module';
+
+
+@NgModule({
+  declarations: [
+    LoginPage,
+    LogoutPage,
+    VerifyUserPage,
+    ResetPasswordPage
+  ],
+  imports: [
+    BrowserModule,
+    ReactiveFormsModule,
+    AppRoutingModule
+  ],
+  providers: []
+})
+export class UserModule { }

src/app/user/verify.html

@@ -0,0 +1,16 @@
+<div *ngIf="success">
+  <h1>Success</h1>
+
+  <div class="section">
+    <p>
+      Your email has been verified. Please <a routerLink="/login">login</a> to your account.
+    </p>
+  </div>
+</div>
+
+<div *ngIf="error">
+  <h1>Verification Error</h1>
+  <div class="section">
+    <p class="error">{{error.message}}</p>
+  </div>
+</div>

src/app/user/verify.ts

@@ -0,0 +1,34 @@
+import { Component, OnInit } from '@angular/core';
+import { Router, ActivatedRoute } from '@angular/router';
+import { AppError } from '../shared/error';
+import { UserService } from '../core/user.service';
+
+
+@Component({
+  selector: 'app-verifyuser',
+  templateUrl: 'verify.html'
+})
+export class VerifyUserPage {
+  public error: AppError;
+  public success: boolean;
+
+  constructor(
+    private router: Router,
+    private route: ActivatedRoute,
+    private userService: UserService
+  ) {
+    this.route.queryParams.switchMap(params => {
+      let code = params['code'];
+
+      if(!code) {
+        throw new Error('Missing code');
+      }
+
+      return this.userService.verifyUser(code);
+    }).subscribe(() => {
+      this.success = true;
+    }, err => {
+      this.error = err;
+    })
+  }
+}