/**
* @Component Name: AddressPluginComponent
* @Module: App
* @Module Functionality : To display customer address details
* @Creation Date: August 6th ,2018
* @Author: sbaireddy
* @Version: 1.0
*/
import { Component, OnInit, Input, Output, OnChanges, EventEmitter } from '@angular/core';

import { HEADER_BACKGROUND_DEFAULT, SIDEBAR_BACKGROUND_DEFAULT, SIDEBAR_ACTIVE_COLOR_DEFAULT, CONTENT_BACKGROUND_DEFAULT } from '../../shared/form.constants';

import { User } from '../../shared/modal/user';
import { UserService } from '../../services/user.service';
import { SharedService } from '../../shared/shared.service';

declare var $: any;

@Component( {
    moduleId: module.id,
    selector: 'address-cmp',
    templateUrl: 'address.component.html',
    styleUrls: ['address.component.css']
})

export class AddressComponent implements OnInit, OnChanges {
    private COMPONENT_NAME: string = 'addressComponent';
    storeId: number;
    user: User;
    @Input() showSettings: boolean = false;
    @Output() changeStatus: EventEmitter<boolean> = new EventEmitter();

 
    constructor(public sharedService: SharedService, public userService: UserService) { }
    /**
     * This function is used to initialize the directive/component after Angular
     * first displays the data-bound properties.It is invoked only once when the
     * directive is instantiated
     * @returns void
     */
    ngOnInit(): void {
        const METHOD_NAME: string = 'ngOnInit()';
        const window_width = $(window).width();
        if (window_width > 767) {
            if ($('.address-plugin .dropdown').hasClass('show-dropdown')) {
                $('.address-plugin .dropdown').addClass('open');
            }
        }

        $('.address-plugin a').click(function (event) {
            // Alex if we click on switch, stop propagation of the event, so the dropdown will not be hide, otherwise we set the  section active
            if ($(this).hasClass('switch-trigger')) {
                if (event.stopPropagation) {
                    event.stopPropagation();
                } else if (window.event) {
                    window.event.cancelBubble = true;
                }
            }
            $('.dropdown-header.settings').removeClass('open');
            if ($('.dropdown-header.address').hasClass('open')) {
                $('.dropdown-header.address').removeClass('open');
            } else {
                $('.dropdown-header.address').addClass('open');
            }
        });

    }

    /**
    * This function is called whenever one or more data-bound input properties change
    * @returns void
    */
    ngOnChanges() {
        const METHOD_NAME: string = 'ngOnChanges()';
        if (this.showSettings === false) {
            setTimeout(() => {
                this.changeStatus.emit(true);
            }, 500)
        }
    }
}