import { autoinject, Aurelia } from "aurelia-framework"
import { HttpClient, json } from "aurelia-fetch-client"
import { AuthService } from "aurelia-authentication"
import { Router } from 'aurelia-router';

@autoinject
export class login2 {

  email = "";
  password = "";



  constructor(private auth: AuthService, private http: HttpClient, message: string, private aurelia: Aurelia, private router : Router) {

  }


  login() {
      var authRequest = {
      username: this.email,
      password: this.password
    };

    return this.auth.login(authRequest)
        .then(response => {
            console.log(`Success: ${response}`);
            this.aurelia.setRoot("app");
            this.aurelia.setRoot("app");

        })
        .catch(error => {
            console.log(`Error! ${error}`);
            alert("Username / Password is wrong");
        })
  }





  logout() {
    this.auth.logout('');
  }

  redirect() { this.aurelia.setRoot("signup");}



}

<template>


    <div class="container">
      <div class="row vertical-offset-100">
        <div class="col-md-4 col-md-offset-4">
          <div class="panel panel-default">
            <div class="panel-heading">
              <h3 class="panel-title">Please sign in</h3>
            </div>
            <div class="panel-body">
              <form accept-charset="UTF-8" role="form">
                <fieldset>
                  <div class="form-group">
                    <input class="form-control" placeholder="E-mail" name="email" value.bind="email" type="text">
                  </div>
                  <div class="form-group">
                    <input class="form-control" placeholder="Password" name="password" value.bind="password" type="password" value="">
                  </div>
                  <div class="checkbox">
                    <label>
                      <input name="remember" type="checkbox" value="Remember Me"> Remember Me
                    </label>
                  </div>
                  <input class="btn btn-lg btn-success btn-block" type="submit" click.delegate="login()" value="Login">
                  <input class="btn btn-lg btn-success btn-block" type="submit" click.delegate="redirect()" value="Signup">
                </fieldset>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>

</template>