Refactoring and fixing the login sequence and calls

src/app/authentication/authentication.component.html

@@ -6,17 +6,17 @@
 
 				<div class="form-group">
 					<label for="exampleInputEmail1">Email address</label>
-					<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp"
+					<input #email_input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp"
 						placeholder="Enter email">
 				</div>
 
 				<div class="form-group">
 					<label for="exampleInputPassword1">Password</label>
-					<input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
+					<input #password_input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
 				</div>
 
 				<!-- <a routerLink="/generator-search"><button type="submit" class="btn btn-primary">Submit</button></a> -->
-				<button type="submit"  class="btn btn-primary" id="login-button" ng-click="LogOn($event)">Submit</button>
+        <a href="#" class="btn btn-primary" (click)="logOn()">Submit</a>
 			</form>
 			<p>
 					<br>
@@ -27,4 +27,4 @@
 				</p>
 		</div>
 	</div>
-</div>
+</div>

src/app/authentication/authentication.component.ts

@@ -1,9 +1,7 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
-import { LoginService } from '../services/login.service'
-import 'rxjs/Rx';
-import { Observable } from 'rxjs/Rx';
+import { LoginService } from '../services/login.service';
 
 @Injectable()
 
@@ -13,37 +11,34 @@ import { Observable } from 'rxjs/Rx';
   styleUrls: ['./authentication.component.css']
 })
 export class AuthenticationComponent implements OnInit {
-  private items: Array<string>;
+  // private items: Array<string>;
+  @ViewChild('email_input') email_input: ElementRef;
+  @ViewChild('password_input') password_input: ElementRef;
 
-  constructor(private data: LoginService) { 
-    this.items = ["username", "password"]
+  constructor(private data: LoginService) {
   }
 
-  logOn (event: any) {
-    event.preventDefault();
+  logOn () {
 
-    let username: HTMLElement = document.getElementById('email');
-    let password: HTMLElement = document.getElementById('password');
-    username.click();
-    password.click();
+    const loginjson = {
+      'user_email': this.email_input.nativeElement.value,
+      'user_password': this.password_input.nativeElement.value
+    };
 
-    var json = JSON.stringify({
-      "user_email": username,
-      "user_password": password
+    this.data.authorizeUser(loginjson).subscribe((data) => {
+      const token = data['token'];
+      // Authorized
+      console.log(token);
+      localStorage.setItem('auth_token', token);
     });
-
-    var authInfo = this.data.authorizeUser(json);
-
-    var authorized = authInfo["message"];
-    var token = authInfo["token"];
-    if (authorized) {
-      return token;
-    }
-
-    this.data.getUser(token);
-
   }
 
+  /*
+  this.data.getUser(token).subscribe((me) => {
+        console.log(me);
+      });
+   */
+
   ngOnInit() { }
 
 }

src/app/services/login.service.ts

@@ -10,11 +10,14 @@ export class LoginService {
   constructor(private http: HttpClient) { }
 
   authorizeUser(loginInfo) {
-    return this.http.post('http://sd5-backend.engr.uconn.edu/auth', loginInfo)
+    return this.http.post('http://sd5-backend.engr.uconn.edu/auth', loginInfo);
   }
 
   getUser(token) {
-    return this.http.get('http://sd5-backend.engr.uconn.edu/user/me', token)
+    return this.http.get('http://sd5-backend.engr.uconn.edu/user/me', {
+      headers: {
+        Authorization: 'Bearer ' + token
+      }
+    });
   }
-
 }