import { IAjaxResponse } from '@abp/abpHttpInterceptor';
import { TokenService } from '@abp/auth/token.service';
import { Component, Injector, OnInit, ViewChild, ViewChildren, QueryList, ElementRef, AfterViewInit, Query } from '@angular/core';
import { AppConsts } from '@shared/AppConsts';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { AppComponentBase } from '@shared/common/app-component-base';
import { SettingScopes, SendTestEmailInput, TenantSettingsEditDto, TenantSettingsServiceProxy, SetBlindCountLimitInputDto,OrderNumberDisplayTypeDto } from '@shared/service-proxies/service-proxies';
import { FileUploader, FileUploaderOptions } from 'ng2-file-upload';
import { finalize } from 'rxjs/operators';
import { MobileAppSettingsComponent } from '@app/sprintship/settings/mobile-app/mobile-app-settings.component';
import { MobileAppVersionsComponent } from '@app/sprintship/settings/mobile-app/mobile-app-versions.component';
import { MobileAppRequestSettingsComponent } from '@app/sprintship/settings/mobile-app/mobile-app-request-settings.component';
import { MobileAppTextToSpeechSettingsComponent } from '@app/sprintship/settings/mobile-app/mobile-app-texttospeech-settings.component';

@Component({
    templateUrl: './tenant-settings.component.html',
    animations: [appModuleAnimation()]
})
export class TenantSettingsComponent extends AppComponentBase implements OnInit, AfterViewInit {

    usingDefaultTimeZone = false;
    initialTimeZone: string = null;
    testEmailAddress: string = undefined;

    blindCountLimitValue: SetBlindCountLimitInputDto = new SetBlindCountLimitInputDto();
    labEdition: string = undefined;
    isLaboratory: boolean = false;
    isMultiTenancyEnabled: boolean = this.multiTenancy.isEnabled;
    showTimezoneSelection: boolean = abp.clock.provider.supportsMultipleTimezone;
    activeTabIndex: number = (abp.clock.provider.supportsMultipleTimezone) ? 0 : 1;
    loading = false;
    settings: TenantSettingsEditDto = undefined;
    labelDisplay:String;
    logoUploader: FileUploader;
    customCssUploader: FileUploader;

    remoteServiceBaseUrl = AppConsts.remoteServiceBaseUrl;

    defaultTimezoneScope: SettingScopes = SettingScopes.Tenant;

    @ViewChildren("mobileAppSettingsComponent")
    private mobileAppSettingsComponents: QueryList<MobileAppSettingsComponent>;
    private mobileAppSettingsComponent: MobileAppSettingsComponent;

    @ViewChildren("mobileAppVersionsComponent")
    private mobileAppVersionsComponents: QueryList<MobileAppVersionsComponent>;
    private mobileAppVersionsComponent: MobileAppVersionsComponent;

    @ViewChildren("mobileAppRequestSettingsComponent")
    private mobileAppRequestSettingsComponents: QueryList<MobileAppRequestSettingsComponent>;
    private mobileAppRequestSettingsComponent: MobileAppRequestSettingsComponent;

    @ViewChildren("mobileAppTextToSpeechSettingsComponent")
    private mobileAppTextToSpeechSettingsComponents: QueryList<MobileAppTextToSpeechSettingsComponent>;
    private mobileAppTextToSpeechSettingsComponent: MobileAppTextToSpeechSettingsComponent;

    constructor(
        injector: Injector,
        private _tenantSettingsService: TenantSettingsServiceProxy,
        private _tokenService: TokenService
    ) {
        super(injector);
    }

    ngOnInit(): void {
        this.testEmailAddress = this.appSession.user.emailAddress;
        this.labEdition = this.appSession.tenant.edition.displayName.toUpperCase();
        this.labEdition =='LABORATORY'? this.isLaboratory=true:this.isLaboratory=false;
        this.getSettings();
        this.initUploaders();
    }

    ngAfterViewInit(): void
    {
        this.initMobileAppSettingsComponent(() => {
            this.initMobileAppVersionsComponent(() => {
                this.initMobileAppRequestSettingsComponent(() => {
                    this.initMobileAppTextToSpeechSettingsComponent(() => {});
                });
            });
        });
    }

    initMobileAppSettingsComponent(onFinish: () => void): void {
        this.mobileAppSettingsComponents.changes.subscribe((comps: QueryList<MobileAppSettingsComponent>) => {
            this.mobileAppSettingsComponent = comps.first;

            onFinish();
        });
    }

    initMobileAppVersionsComponent(onFinish: () => void): void {
        this.mobileAppVersionsComponents.changes.subscribe((comps: QueryList<MobileAppVersionsComponent>) => {
            this.mobileAppVersionsComponent = comps.first;

            onFinish();
        });
    }

    initMobileAppRequestSettingsComponent(onFinish: () => void): void {
        this.mobileAppRequestSettingsComponents.changes.subscribe((comps: QueryList<MobileAppRequestSettingsComponent>) => {
            this.mobileAppRequestSettingsComponent = comps.first;

            onFinish();
        });
    }

    initMobileAppTextToSpeechSettingsComponent(onFinish: () => void): void {
        this.mobileAppTextToSpeechSettingsComponents.changes.subscribe((comps: QueryList<MobileAppTextToSpeechSettingsComponent>) => {
            this.mobileAppTextToSpeechSettingsComponent = comps.first;

            onFinish();
        });
    }

    getSettings(): void {
        this.loading = true;
        this._tenantSettingsService.getAllSettings()
            .pipe(finalize(() => { this.loading = false; }))
            .subscribe((result: TenantSettingsEditDto) => {
                this.settings = result;
                this.blindCountLimitValue = this.settings.blindCountLimit;
                this.labelDisplay = this.settings.orderNumberDisplay.orderNumberDisplayType;
                if (this.settings.general) {
                    this.initialTimeZone = this.settings.general.timezone;
                    this.usingDefaultTimeZone = this.settings.general.timezoneForComparison === abp.setting.values['Abp.Timing.TimeZone'];
                }
            });
    }

    initUploaders(): void {
        this.logoUploader = this.createUploader(
            '/TenantCustomization/UploadLogo',
            result => {
                this.appSession.tenant.logoFileType = result.fileType;
                this.appSession.tenant.logoId = result.id;
            }
        );

        this.customCssUploader = this.createUploader(
            '/TenantCustomization/UploadCustomCss',
            result => {
                this.appSession.tenant.customCssId = result.id;

                let oldTenantCustomCss = document.getElementById('TenantCustomCss');
                if (oldTenantCustomCss) {
                    oldTenantCustomCss.remove();
                }

                let tenantCustomCss = document.createElement('link');
                tenantCustomCss.setAttribute('id', 'TenantCustomCss');
                tenantCustomCss.setAttribute('rel', 'stylesheet');
                tenantCustomCss.setAttribute('href', AppConsts.remoteServiceBaseUrl + '/TenantCustomization/GetCustomCss?tenantId=' + this.appSession.tenant.id);
                document.head.appendChild(tenantCustomCss);
            }
        );
    }

    createUploader(url: string, success?: (result: any) => void): FileUploader {
        const uploader = new FileUploader({ url: AppConsts.remoteServiceBaseUrl + url });

        uploader.onAfterAddingFile = (file) => {
            file.withCredentials = false;
        };

        uploader.onSuccessItem = (item, response, status) => {
            const ajaxResponse = <IAjaxResponse>JSON.parse(response);
            if (ajaxResponse.success) {
                this.notify.info(this.l('SavedSuccessfully'));
                if (success) {
                    success(ajaxResponse.result);
                }
            } else {
                this.message.error(ajaxResponse.error.message);
            }
        };

        const uploaderOptions: FileUploaderOptions = {};
        uploaderOptions.authToken = 'Bearer ' + this._tokenService.getToken();
        uploaderOptions.removeAfterUpload = true;
        uploader.setOptions(uploaderOptions);
        return uploader;
    }

    uploadLogo(): void {
        this.logoUploader.uploadAll();
    }

    uploadCustomCss(): void {
        this.customCssUploader.uploadAll();
        setTimeout(function(){ location.reload(); }, 500);

    }

    clearLogo(): void {
        this._tenantSettingsService.clearLogo().subscribe(() => {
            this.appSession.tenant.logoFileType = null;
            this.appSession.tenant.logoId = null;
            this.notify.info(this.l('ClearedSuccessfully'));
        });
    }

    clearCustomCss(): void {
        this._tenantSettingsService.clearCustomCss().subscribe(() => {
            this.appSession.tenant.customCssId = null;

            let oldTenantCustomCss = document.getElementById('TenantCustomCss');
            if (oldTenantCustomCss) {
                oldTenantCustomCss.remove();
            }

            this.notify.info(this.l('ClearedSuccessfully'));
        });
    }

    saveAll(): void {
        this.settings.blindCountLimit = this.blindCountLimitValue;
        this.settings.orderNumberDisplay.orderNumberDisplayType = this.labelDisplay.toString();
        this._tenantSettingsService.updateAllSettings(this.settings).subscribe(() => {
            this.notify.info(this.l('SavedSuccessfully'));

            if (abp.clock.provider.supportsMultipleTimezone && this.usingDefaultTimeZone && this.initialTimeZone !== this.settings.general.timezone) {
                this.message.info(this.l('TimeZoneSettingChangedRefreshPageNotification')).then(() => {
                    window.location.reload();
                });
            }
        });
    }

    saveCustomSettings(): void{
        // this._tenantSettingsService.updateCustomSettingAsync(this.settings.customSettings).subscribe(() => {
        //     this.notify.info(this.l('SavedSuccessfully'));
        // });

    }
   
    sendTestEmail(): void {
        const input = new SendTestEmailInput();
        input.emailAddress = this.testEmailAddress;
        this._tenantSettingsService.sendTestEmail(input).subscribe(result => {
            this.notify.info(this.l('TestEmailSentSuccessfully'));
        });
    }

    onSelectMobileAppSettings(): void {
        //this.mobileAppSettingsComponent.getSettingsFromApi();
    }

    setLoader(visible: boolean): void {
        if (visible) {
            this.spinnerService.show();
        }
        else {
            this.spinnerService.hide();
        }
    }
}