import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ToastController } from 'ionic-
angular';
import { FormGroup, Validators, FormBuilder } from '@angular/forms';
import { HttpModule, HttpClientModule, Headers, RequestOptions } from
'@angular/http';
import 'rxjs/add/operator/map';
import { PInfoPage } from '../p-info/p-info';

@IonicPage()
@Component({
selector: 'page-acc-info',
templateUrl: 'acc-info.html',
})
export class AccInfoPage {

// Define FormBuilder /model properties
public form               : FormGroup;
public a_username         : any;
public p_username        : any;
public password          : any;
// Flag to hide the form upon successful completion of remote operation
public hideForm               : boolean = false;
// Property to store the recordID for when an existing entry is being edited
public acc_id             : any      = null;
private baseURI           : string  = "http://localhost:10080/ionic/";



// Initialise module classes
constructor(public navCtrl    : NavController,
           public http       : Http,
           public NP         : NavParams,
           public fb         : FormBuilder,
           public toastCtrl  : ToastController)
 {

  // Create form builder validation rules
  this.form = fb.group({
     "a_username"                  : ["", Validators.required],
     "p_username"                  : ["", Validators.required],
     "password"                    : ["", Validators.required],
  });
}



 // Assign the navigation retrieved data to properties
// used as models on the page's HTML form
selectEntry(item)
{
  this.a_username        = item.a_username;
  this.p_username        = item.p_username;
  this.password          = item.password;
  this.acc_id            = item.acc_id;
}


 createEntry(a_username, p_username, password)
{
  let body     : string   = "key=create&a_username=" + a_username +
 "&p_username=" + p_username + "&password=" + password,
      type     : string   = "application/x-www-form-urlencoded; charset=UTF-
8",
      headers  : any      = new Headers({ 'Content-Type':application/json}),
      options  : any      = new RequestOptions({ headers: headers }),
      url      : any      = this.baseURI + "manage-data.php";

  this.http.post(url, body, options)
  .subscribe((data) =>
  {
     // If the request was successful notify the user
     if(data.status === 200)
     {
        this.hideForm   = true;
        this.sendNotification(`Congratulations the account was successfully
 created`);
     }
     // Otherwise let 'em know anyway
     else
     {
        this.sendNotification('Something went wrong!');
     }
  });
 }

// Handle data submitted from the page's HTML form
// Determine whether we are adding a new record or amending an
// existing record
saveEntry()
{
  let a_username          : string = this.form.controls["a_username"].value,
      p_username   : string    = this.form.controls["p_username"].value,
      password   : string    = this.form.controls["password"].value


     this.createEntry(a_username,p_username, password);

   }

// Clear values in the page's HTML form fields
resetFields() : void
 {
    this.a_username    = "";
    this.p_username    = "";
    this.password      = "";
 }



  // Manage notifying the user of the outcome
  // of remote operations
  sendNotification(message)  : void
 {
    let notification = this.toastCtrl.create({
       message       : message,
       duration      : 3000
    });
    notification.present();
  }


   open_p_info() {
    this.navCtrl.push(PInfoPage);
 }

}