import {Component, Injectable, Injector} from '@angular/core';
import { RegisterService } from '../../services/register/register.service';
import { User } from '../../../User';
import {ChatService} from "../../services/chat/chat.service";
import {Http, Headers} from "@angular/http";
import {Observable} from 'rxjs/Rx';
import {isUndefined} from "util";


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

export class RegisterComponent {

    //initialisation de notre classe/modele User/ts
    user : User;
    email : string;
    pseudo : string;
    password: string;
    ConfirmPassword :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,contactList){
        //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;
        contactList = [];
        //}
        //}
        //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);
/*
        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})+$";
        // initialize model here
        this.user = {
            _id: '',
            pseudo: '',
            email: '',
            password: '',
            picture:''
        }

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