From a283651eaecf9488a91c2d63f5cd017497738f34 Mon Sep 17 00:00:00 2001
From: Alexis Lahouze <xals@lahouze.org>
Date: Fri, 6 Oct 2017 23:57:44 +0200
Subject: [PATCH] Try to use materialize for login popup.

---
 src/login/login.module.ts         |  2 ++
 src/login/login.service.ts        | 21 +++++------
 src/login/loginModal.component.ts | 58 +++++++++++++++----------------
 3 files changed, 41 insertions(+), 40 deletions(-)

diff --git a/src/login/login.module.ts b/src/login/login.module.ts
index 8e4f4b9..e4e25e1 100644
--- a/src/login/login.module.ts
+++ b/src/login/login.module.ts
@@ -5,6 +5,7 @@ import { CommonModule } from '@angular/common';
 import { ReactiveFormsModule } from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
 import { HTTP_INTERCEPTORS } from '@angular/common/http';
+import { MaterializeModule } from 'ng2-materialize';
 
 import { NgLoggerModule } from '@nsalaun/ng-logger';
 
@@ -18,6 +19,7 @@ import { LoginModalComponent } from './loginModal.component';
     HttpClientModule,
     CommonModule,
     ReactiveFormsModule,
+    MaterializeModule,
     NgLoggerModule,
   ],
   providers: [
diff --git a/src/login/login.service.ts b/src/login/login.service.ts
index 7418807..580576f 100644
--- a/src/login/login.service.ts
+++ b/src/login/login.service.ts
@@ -6,7 +6,7 @@ import { Observable} from 'rxjs/Rx';
 import * as base64 from 'base64util';
 
 import { Logger } from '@nsalaun/ng-logger';
-import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { MzModalService } from 'ng2-materialize';
 
 import { Token } from './token';
 import { LoginModalComponent } from './loginModal.component';
@@ -18,24 +18,25 @@ export class LoginService {
     constructor(
         private httpClient: HttpClient,
         private logger: Logger,
-        private ngbModal: NgbModal,
+        private mzModalService: MzModalService,
     ) {}
 
     public readonly url: string = '/api/user/login';
 
     login(): Observable<Token> {
-        let modal = this.ngbModal.open(LoginModalComponent);
+        let modal = this.mzModalService.open(LoginModalComponent);
 
         sessionStorage.clear();
 
-        let observable: Observable<any> = Observable.fromPromise(modal.result);
+        //let observable: Observable<any> = Observable.fromPromise(modal.result);
 
-        return observable.flatMap((login: Login) =>
-            this.doLogin(login)
-        ).map((token: Token): Token => {
-            this.accessToken = token.access_token;
-            return token;
-        });
+        //return observable.flatMap((login: Login) =>
+        //    this.doLogin(login)
+        //).map((token: Token): Token => {
+        //    this.accessToken = token.access_token;
+        //    return token;
+        //});
+        return null;
     }
 
     logout() {
diff --git a/src/login/loginModal.component.ts b/src/login/loginModal.component.ts
index 8ff7abd..a2a7ab3 100644
--- a/src/login/loginModal.component.ts
+++ b/src/login/loginModal.component.ts
@@ -1,7 +1,7 @@
 // vim: set tw=80 ts=2 sw=2 sts=2:
 import { Component, Input, ViewChild } from '@angular/core';
 
-import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { MzBaseModal } from 'ng2-materialize';
 
 import { Login } from './login';
 import { LoginFormComponent } from './loginForm.component';
@@ -9,43 +9,41 @@ import { LoginFormComponent } from './loginForm.component';
 @Component({
   selector: 'login-modal',
   template: `
-<div class="modal-header">
-  <h3 class="modal-title" id="modal-title">Authentification requise</h3>
-</div>
+<mz-modal>
+  <mz-modal-header>
+    Authentification requise
+  </mz-modal-header>
 
-<div class="modal-body" id="modal-body">
-  <login-form (submit)="submit()" #loginForm="loginForm"></login-form>
-</div>
+  <mz-modal-content>
+    <login-form (submit)="submit()" #loginForm="loginForm"></login-form>
+  </mz-modal-content>
 
-<div class="modal-footer">
-  <button class="btn btn-primary" [disabled]="!loginForm.form.valid" (click)="submit()">
-    Login
-  </button>
+  <mz-modal-footer>
+    <button class="btn btn-primary" [disabled]="!loginForm.form.valid" (click)="submit()">
+      Login
+    </button>
 
-  <button class="btn btn-default" (click)="cancel()">
-    Cancel
-  </button>
-</div>
+    <button class="btn btn-default" (click)="cancel()">
+      Cancel
+    </button>
+  </mz-modal-footer>
+</mz-modal>
   `
 })
-export class LoginModalComponent {
+export class LoginModalComponent extends MzBaseModal {
   @ViewChild('loginForm') loginForm: LoginFormComponent;
 
-  constructor(private activeModal: NgbActiveModal) {
-    
-  }
+  //submit(): void {
+  //  let formModel = this.loginForm.form.value;
+  //  let login: Login = new Login();
 
-  submit(): void {
-    let formModel = this.loginForm.form.value;
-    let login: Login = new Login();
+  //  login.email = formModel.email;
+  //  login.password = formModel.password;
 
-    login.email = formModel.email;
-    login.password = formModel.password;
+  //  this.activeModal.close(login);
+  //}
 
-    this.activeModal.close(login);
-  }
-
-  cancel(): void {
-    this.activeModal.dismiss("closed");
-  }
+  //cancel(): void {
+  //  this.activeModal.dismiss("closed");
+  //}
 }