import {Component, OnInit, OnDestroy} from '@angular/core';
import { RegisterService } from '../../services/register/register.service';
import { User } from '../../../User';

import {Http} from "@angular/http";
import {stat} from "fs";



@Component({
    moduleId: module.id,
    selector: 'register',
    templateUrl: 'register.component.html',
    providers: [RegisterService]
})

export class RegisterComponent  implements OnInit, OnDestroy {

    //initialisation de notre classe/modele User/ts
    user : User;
    email : string;
    pseudo : string;
    birthday : Date;
    password: string;
    ConfirmPassword :string;
    status:string;
    //contactList = [];
    file: File;
    namePicture = '';
    isNewUser : boolean;
    source='http://localhost:3000/public/profile.jpg';
    //password : string;

    /*ici les petites salopes on passe en parametre notre service qui push dans la DB en appelant
     }
     filesToUpload: Array<File>;
     les routes de notre fichier register.js du serveur , pour le call a chaque fois qu on appelera ce component
     */
    filesToUpload: Array<File>;


    constructor(private registerService:RegisterService,private http: Http){
        this.filesToUpload = [];
    }
    /*
     addPicture(event: EventTarget) {
     var xhr = new XMLHttpRequest();
     let eventObj: MSInputMethodContext = <MSInputMethodContext> event;
     let target: HTMLInputElement = <HTMLInputElement> eventObj.target;
     let files: FileList = target.files;
     this.file = files[0];
     const formData = new FormData();
     formData.append('myPicture', files[0]);
     console.log(this.file);
     console.log(this.file.name);
     console.log(formData.get('myPicture'));
     //let picturePlace = document.getElementById('picturePlace');
     //this.source = this.file.name;
     //this.registerService.addPicture(this.file);
     xhr.onreadystatechange = function () {
     if (xhr.readyState == 4) {
     if (xhr.status == 200) {
     resolve(JSON.parse(xhr.response));
     } else {
     reject(xhr.response);
     }
     }
     }
     xhr.open("POST", url, true);
     xhr.send(formData);
     var headers = new Headers();
     headers.append('Content-Type', 'application/json');
     //xhr.open('POST', 'http://localhost:3000/api/pictureUser', true);
     //xhr.send(formData);
     this.http.post('http://localhost:3000/api/pictureUser', formData, {headers})
     .subscribe(//JSON.stringify(newUser)
     data => {
     let body = data.json();
     console.log(body);
     }
     );
     }*/
    //lie avec notre html bien sur ici add user prend en parametre le click sur le bouton. il settera les valeurs
    //de notre model User.ts cree dans le dossier client (on ne fait que recuperer la valeur des champs du formulaire)

    isNew(pseudo){
        pseudo = this.user.pseudo;
        console.log("this.isNewUser dans register component: " + this.isNewUser);
        if(/*pseudo != null &&this.isNewUser != true*/ this.isNewUser == undefined /*|| this.isNewUser == false*/) {
            this.registerService.isNew(pseudo).then(isNewUs => {
                //console.log("dans register component" + isNewUs);
                if (isNewUs) {
                    this.isNewUser =isNewUs;
                    return false;
                } else {
                    this.isNewUser =isNewUs;
                    return true;
                }
            });
        }else {
            if(this.isNewUser){
                return false;
            }else if(this.isNewUser == false){
                return true;
            }
        }
    }


    addUser(email,pseudo,password,picture,birthday,contactList,contactInvites){
        //event.preventDefault();
        //var newUser = {
        //this.user = new User();
        //var newUser = {
        email = this.user.email;
        pseudo = this.user.pseudo;
        password = this.user.password;
        picture = this.namePicture;
        birthday = this.user.birthday;
        contactList = [];
        contactInvites = [];
        //}
        //}
        //password : this.password

        console.log(email);
        console.log(pseudo);
        console.log(picture);

        //la on passe notre newUser cree lors du click a notre register.service qui lui le donnera a la DB avec sa propre
        //methode addUser
        //this.registerService.addUser(newUser)

        this.registerService.addUser(email,pseudo,password,picture,contactList,contactInvites,birthday);
        /*
         this.registerService.isNew(pseudo).then(isNewUser=>{
         console.log("dans register component"+isNewUser);
         if(isNewUser){
         this.registerService.addUser(email,pseudo,password,picture,contactList);
         }else{
         console.log("dans register component ton user existe deja!");
         }
         });
         */



        //this.registerService.addUser(email,pseudo,password,picture,contactList);
        //.suscribe(
    }

    uploadPic(){
        this.makeFileRequest("http://localhost:3000/api/upload", [], this.filesToUpload).then((result) => {
            console.log(result);
            this.namePicture = result[0].filename;
            var src = this.namePicture;
            this.source = 'http://localhost:3000/public/'+src;

        }, (error) => {
            console.error(error);
        });
    }

    fileChangeEvent(fileInput: any){
        this.filesToUpload = <Array<File>> fileInput.target.files;
    }

    makeFileRequest(url: string, params: Array<string>, files: Array<File>) {
        return new Promise((resolve, reject) => {
            var formData: any = new FormData();
            var xhr = new XMLHttpRequest();
            for(var i = 0; i < files.length; i++) {
                formData.append("public[]", files[i], files[i].name);
            }
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    if (xhr.status == 200) {
                        resolve(JSON.parse(xhr.response));
                    } else {
                        reject(xhr.response);
                    }
                }
            }

            //let picturePlace = document.getElementById('picturePlace');
            console.log(this.source);
            xhr.open("POST", url, true);
            xhr.send(formData);
        });
    }

    ngOnInit() {

        var pattern = "^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$";
        var pattern2="\d{1,2}/\d{1,2}/\d{4}";
        // initialize model here
        this.user = {
            _id: '',
            pseudo: '',
            email: '',
            password: '',
            picture:'',
            bio:'',
            birthday:new Date(''),
            status:''
        }

        this.isNewUser;
    }
    /*
     getUsername(){
     this.chatService.getUsername();
     }*/
}