From d30a8951f68c753c8a6dcda572dd621dd7624553 Mon Sep 17 00:00:00 2001
From: Alexis Lahouze <alexis@lahouze.org>
Date: Sun, 10 Jun 2018 00:30:56 +0200
Subject: [PATCH] Externalize HTML templates in separate files.

---
 src/login/login.tmpl.html           | 38 -----------------------------
 src/login/loginForm.component.html  | 29 ++++++++++++++++++++++
 src/login/loginForm.component.ts    | 32 +-----------------------
 src/login/loginModal.component.html | 17 +++++++++++++
 src/login/loginModal.component.ts   | 22 +++--------------
 5 files changed, 50 insertions(+), 88 deletions(-)
 delete mode 100644 src/login/login.tmpl.html
 create mode 100644 src/login/loginForm.component.html
 create mode 100644 src/login/loginModal.component.html

diff --git a/src/login/login.tmpl.html b/src/login/login.tmpl.html
deleted file mode 100644
index 64a54ef..0000000
--- a/src/login/login.tmpl.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<!-- vim: set tw=80 ts=2 sw=2 sts=2: -->
-<div class="modal top am-fade" tabindex="-1" role="dialog" aria-hidden="true">
-  <div class="modal-dialog">
-    <div class="modal-content">
-      <div class="modal-header">
-        <h3 class="modal-title" id="modal-title">Authentification requise</h3>
-      </div>
-
-      <form class="form-horizontal" ng-submit="$login()">
-        <div class="modal-body" id="modal-body">
-          <div class="form-group">
-            <label for="email" class="col-sm-4 control-label">Adresse email</label>
-            <div class="col-sm-8">
-              <input type="text" class="form-control" id="email" ng-model="email"
-                placeholder="Nom d'utilisateur">
-            </div>
-          </div>
-
-          <div class="form-group">
-            <label for="password" class="col-sm-4 control-label">Mot de passe</label>
-            <div class="col-sm-8">
-              <input type="password" class="form-control" id="password"
-              ng-model="password" placeholder="Mot de passe">
-            </div>
-          </div>
-        </div>
-
-        <div class="modal-footer">
-          <input class="btn btn-primary" type="submit" value="OK"/>
-
-          <button class="btn btn-default" type="button" ng-click="$hide()">
-            Annuler
-          </button>
-        </div>
-      </form>
-    </div>
-  </div>
-</div>
diff --git a/src/login/loginForm.component.html b/src/login/loginForm.component.html
new file mode 100644
index 0000000..25d0125
--- /dev/null
+++ b/src/login/loginForm.component.html
@@ -0,0 +1,29 @@
+<form novalidate (keyup.enter)="submit()" [formGroup]="form">
+  <div class="form-group row">
+    <label for="email" class="col-sm-4 control-label">Adresse email</label>
+
+    <div class="col-sm-8"
+      [class.has-danger]="email.errors">
+      <input type="text" class="form-control" id="email"
+        formControlName="email" placeholder="Nom d'utilisateur">
+
+      <div class="help-block text-danger" *ngIf="email.errors">
+        <p *ngIf="email.errors.required">The email is required.</p>
+      </div>
+    </div>
+  </div>
+
+  <div class="form-group row">
+    <label for="password" class="col-sm-4 control-label">Mot de passe</label>
+
+    <div class="col-sm-8"
+      [class.has-danger]="password.errors">
+      <input type="password" class="form-control" id="password"
+        formControlName="password" placeholder="Mot de passe">
+
+      <div class="help-block text-danger" *ngIf="password.errors">
+        <p *ngIf="password.errors.required">The password is required.</p>
+      </div>
+    </div>
+  </div>
+</form>
diff --git a/src/login/loginForm.component.ts b/src/login/loginForm.component.ts
index 1dc2f3a..c660e48 100644
--- a/src/login/loginForm.component.ts
+++ b/src/login/loginForm.component.ts
@@ -7,37 +7,7 @@ import { Login } from './login';
 @Component({
   selector: 'login-form',
   exportAs: 'loginForm',
-  template: `
-<form novalidate (keyup.enter)="submit()" [formGroup]="form">
-  <div class="form-group row">
-    <label for="email" class="col-sm-4 control-label">Adresse email</label>
-
-    <div class="col-sm-8"
-      [class.has-danger]="email.errors">
-      <input type="text" class="form-control" id="email"
-        formControlName="email" placeholder="Nom d'utilisateur">
-
-      <div class="help-block text-danger" *ngIf="email.errors">
-        <p *ngIf="email.errors.required">The email is required.</p>
-      </div>
-    </div>
-  </div>
-
-  <div class="form-group row">
-    <label for="password" class="col-sm-4 control-label">Mot de passe</label>
-
-    <div class="col-sm-8"
-      [class.has-danger]="password.errors">
-      <input type="password" class="form-control" id="password"
-        formControlName="password" placeholder="Mot de passe">
-
-      <div class="help-block text-danger" *ngIf="password.errors">
-        <p *ngIf="password.errors.required">The password is required.</p>
-      </div>
-    </div>
-  </div>
-</form>
-  `
+  templateUrl: './loginForm.component.html'
 })
 
 export class LoginFormComponent {
diff --git a/src/login/loginModal.component.html b/src/login/loginModal.component.html
new file mode 100644
index 0000000..c5dbabb
--- /dev/null
+++ b/src/login/loginModal.component.html
@@ -0,0 +1,17 @@
+<div class="modal-header">
+  <h3 class="modal-title" id="modal-title">Authentification requise</h3>
+</div>
+
+<div class="modal-body" id="modal-body">
+  <login-form (submit)="submit()" #loginForm="loginForm"></login-form>
+</div>
+
+<div class="modal-footer">
+  <button class="btn btn-succes" [disabled]="!loginForm.form.valid" (click)="submit()">
+    Login
+  </button>
+
+  <button class="btn btn-default" (click)="cancel()">
+    Cancel
+  </button>
+</div>
diff --git a/src/login/loginModal.component.ts b/src/login/loginModal.component.ts
index 8ff7abd..5572bf2 100644
--- a/src/login/loginModal.component.ts
+++ b/src/login/loginModal.component.ts
@@ -2,31 +2,15 @@
 import { Component, Input, ViewChild } from '@angular/core';
 
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+//import { jqxWindowComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxwindow';
+import { jqxButtonComponent } from 'jqwidgets-scripts/jqwidgets-ts/angular_jqxbuttons';
 
 import { Login } from './login';
 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>
-
-<div class="modal-body" id="modal-body">
-  <login-form (submit)="submit()" #loginForm="loginForm"></login-form>
-</div>
-
-<div class="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>
-  `
+  templateUrl: './loginModal.component.html'
 })
 export class LoginModalComponent {
   @ViewChild('loginForm') loginForm: LoginFormComponent;