import {Component} from '@angular/core';
import {Validators, FormBuilder, FormGroup} from '@angular/forms';

import {
    App, NavController, ModalController, AlertController, ToastController, ViewController,
    LoadingController, Platform
} from 'ionic-angular';


import {GoogleAnalytics} from 'ionic-native';

import {GlobalValidators} from '../../shared/global.validators';
import {AuthenticationService} from '../../shared/authentication/authentication.service';

import {User} from '../../shared/authentication/user.model';
// import {UserUpdate} from '../../shared/authentication/user.model';

import {PropertiesService} from '../properties/properties.service';

import {nTranslateService} from '../../shared/nTranslate/nTranslate.service';

import {LoginPage} from '../login/login';

import 'rxjs/add/operator/concat';
import 'rxjs/add/observable/forkJoin';
import 'rxjs/add/operator/toPromise';

import {EditPasswordPage} from "./editPassword/editPassword";

@Component({
    selector: 'page-profile',
    templateUrl: 'profile.html'
})
export class ProfilePage {

    public me: User;
    public user: FormGroup;

    public isLoading: boolean = false;
    public showError: boolean = false;

    public loadingPopup;

    public translations = {
        uiTranslations: {},
        pageTranslations: {},
        validations: {},
        defaults: {},
        errors: {}
    };

    constructor(public platform: Platform,
                private appCtrl: App,
                private modalCtrl: ModalController,
                private navCtrl: NavController,
                private propSvc: PropertiesService,
                private nTranslate: nTranslateService,
                private alertCtrl: AlertController,
                private toastCtrl: ToastController,
                private auth: AuthenticationService,
                private formBuilder: FormBuilder,
                private loadingCtrl: LoadingController,
                public viewCtrl: ViewController) {
        this.auth.currentUser.subscribe(
            user => {

                console.log("inside");
                if(!user) {
                    console.log(user);
                    return
                }

                this.me = user;

                this.user = this.formBuilder.group({
                    firstName: [user.firstName, Validators.compose([Validators.maxLength(30), Validators.pattern('[a-zA-ZæøåÅØÆ ]*')])],
                    lastName: [user.lastName, Validators.compose([Validators.maxLength(30), Validators.pattern('[a-zA-ZæøåÅØÆ ]*')])],
                    // address: [user.address, Validators.compose([Validators.maxLength(30), Validators.pattern('[A-Za-zÅåØøÆæ0-9.-][ ]]*')])],
                    // zipcode: [user.zipCode, Validators.compose([Validators.maxLength(30), Validators.pattern('[0-9 ]*')])],
                    // city: [user.city, Validators.compose([Validators.maxLength(30), Validators.pattern('[a-zA-ZæøåÅØÆ ]*')])],
                    phone1: [user.phone1, Validators.compose([Validators.maxLength(30), Validators.pattern('[0-9 ]*')])],
                    phone2: [user.phone2, Validators.compose([Validators.maxLength(30), Validators.pattern('[0-9 ]*')])],

                    email: [user.email, Validators.compose([
                        Validators.required,
                        GlobalValidators.validateEmail
                    ])],
                    oldPassword: '',
                    newPassword: '',
                    newPasswordRepeat: ''

                }, {validator: GlobalValidators.validateEqualPasswords});
            }
        );

        this.isLoading = true;
    }

    ionViewWillEnter() {

        this.platform.ready().then(() => {
            GoogleAnalytics.trackView('profile').then(
                (res) => {console.log(res);},
                (err) => {console.log(err);}
            )
        });


        console.log('useeer',User);

        let pageTranslations = this.nTranslate.getSection('profile').toPromise().then(res => this.translations.pageTranslations = res);
        let uiTranslations = this.nTranslate.getSection('ui-pages').toPromise().then(res => this.translations.uiTranslations = res);
        let validationTranslations = this.nTranslate.getSection('validation').toPromise().then(res => this.translations.validations = res);
        let defaultTranslations = this.nTranslate.getSection('default').toPromise().then(res => this.translations.defaults = res);
        let errorTranslations = this.nTranslate.getSection('error').toPromise().then(res => this.translations.errors = res);

        return Promise.all([pageTranslations, uiTranslations, validationTranslations, defaultTranslations, errorTranslations]);

    }

    save({value, valid}: {value: User, valid: boolean}) {

        // if(value.newPassword.length < 1) {
        //     value.newPassword = undefined;
        // }
        if(!valid){
            return
        }
        this.appCtrl.setEnabled(false);
        this.isLoading = true;

        console.log("USER", value);

        this.auth.updateMe(value)
            .subscribe(
                user => this._toastOnSuccess(),
                error => this._alertOnError(error)
            )
    }

    logout() {
        this.propSvc.clearStoredPropertyId();
        this.auth.logout();

        this.loadingPopup = this.loadingCtrl.create({
            content: this.translations.defaults['loading']
        });
        this.loadingPopup.present();

        this.navCtrl.setRoot(LoginPage);
        this.propSvc.clearStoredPropertyId();
        this.loadingPopup.dismiss();
        // this.appCtrl.getRootNav().setRoot(LoginPage, null, {animate: true});
    }

    editPassword(user) {
        let modal = this.modalCtrl.create(EditPasswordPage, {user:  this.user});
        modal.present();
    }


    dismiss() {
        this.viewCtrl.dismiss();
    }

    private _toastOnSuccess() {

        let toast = this.toastCtrl.create({
            message: this.translations.pageTranslations['feedbackSaveSuccessful'],
            duration: 3000,
            position: 'bottom',
            showCloseButton: true,
            closeButtonText: this.translations.defaults['ok']
        });

        this.appCtrl.setEnabled(true);
        this.isLoading = false;

        toast.present();
    }

    private _alertOnError(error) {

        this.showError = true;
        var errors = [];
        for(let key in error) {
            if(error.hasOwnProperty(key)) {
                let errMsg = `${key}: ${error[key]}`;
                errors.push(errMsg);
            }
        }

        let alert = this.alertCtrl.create({
            title: this.translations.errors['errorTitle'],
            subTitle: errors.join('\n'),
            buttons: [this.translations.defaults['ok']]
        });
        this.appCtrl.setEnabled(true);
        this.isLoading = false;

        alert.present();

    }

}