import { Component, AfterViewInit, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { ApplicationService } from '../services/application.service';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { UpdateUserService } from '../services/update-user.service';
import { UserProfile, AdminUser } from '../model/data-model';

declare var jQuery: any;

@Component({
    templateUrl: '../components/change-password.component.html'
})
export class ChangePasswordComponent implements AfterViewInit, OnInit {

    changePasswordForm: FormGroup;

    admminUser: AdminUser;

    userId: number;
    loginId: string;
    password: string;
    newPassword: string;
    confirmPassword: string;

    constructor(private application: ApplicationService, private updateService: UpdateUserService, private router: Router, private fb: FormBuilder) {

    }

    ngAfterViewInit(): void {
        this.initializeUIElements();

        //jQuery(function () {
        //    jQuery("#slider-range-min-2").slider({
        //        range: "min",
        //        min: 1,
        //        max: 60,
        //        value: 10,
        //        slide: function (event, ui) {
        //            jQuery("#amount-2").val(ui.value);
        //        }
        //    });
        //    jQuery("#amount-2").val(jQuery("#slider-vertical-2").slider("value"));
        //});

        //jQuery('.modal').draggable({
        //    handle: '.modal-header'
        //})
    }

    initializeUIElements(): void {



    }

    ngOnInit(): void {
        /*if (this.application.currentUser == null) {
            this.router.navigate(['/login']);
        }*/
        this.initializeChangePasswordComponent();
    }

    showAlert(id: string): void {
        jQuery('#' + id).modal('show');
    }

    initializeChangePasswordComponent(): void {
        this.changePasswordForm = this.fb.group({
            'userId': ['', [Validators.required]],
            'oldPassword': ['', [Validators.required]],
            'newPassword': ['', [Validators.required, Validators.minLength(8)]],
            'confirmPassword': ['', [Validators.required]]
        });

        this.changePasswordForm.valueChanges
            .subscribe(data => this.onValueChanged(data));

        this.onValueChanged(); // (re)set validation messages now
    }

    onValueChanged(data?: any) {
        if (!this.changePasswordForm) { return; }
        const form = this.changePasswordForm;

        for (const field in this.formErrors) {
            // clear previous error message (if any)
            this.formErrors[field] = '';
            const control = form.get(field);

            if (control && control.dirty && !control.valid) {
                const messages = this.validationMessages[field];
                for (const key in control.errors) {
                    this.formErrors[field] += messages[key] + ' ';
                }
            }
        }
    }

    formErrors = {
        'userId': '',
        'oldPassword': '',
        'newPassword': '',
        'confirmPassword': ''
    };

    validationMessages = {
        'userId': {
            'required': 'Userid is required.'
        },
        'oldPassword': {
            'required': 'Old password is required.'
        },
        'newPassword': {
            'required': 'New password is required.',
            'minlength': 'New password must be at least 8 characters long.'
        },
        'confirmPassword': {
            'required': 'Confirm password is required.',
            'validateEqual': 'New password and Confirm password must match!'
        }
    }

    getUserDetailsByLoginIdandPassword(): void { //loginId: string, password: string
        console.log('inside getUserDetailsByLoginIdandPassword');
        let loginId: string;
        loginId = 'superadmin';
        console.log(loginId);
        let password: string;
        password = 'education';
        this.updateService.GetUserDetailsByLoginIdandPassword(loginId, password).subscribe(
            uDetail => this.admminUser = uDetail.json(), err => {
                console.log(err);
            });
    }

    updateUserPassword(): void { //userId: number, newPassword: string
        debugger;
        let userId: number;
        userId = 1;
        let newPassword: string;
        newPassword = 'education';
        console.log('inside change user password component');
        console.log(userId);
        console.log(newPassword);
        this.updateService.UpdateUserPassword(userId, newPassword).subscribe((result) => {
            console.log('Completed');
        });
    }
}