import {Component, ElementRef, OnInit, TemplateRef, ViewChild} from '@angular/core';
import {Router, ActivatedRouteSnapshot, NavigationEnd} from '@angular/router';
import {EmitService} from '../../shared/event/eventEmitter';
import {Title} from '@angular/platform-browser';
import {LocalStorageService, SessionStorageService} from 'ngx-webstorage';
import {zh_CN, NzI18nService} from 'ng-zorro-antd';
import {CommonService} from '../../shared/common/common.service';
import {ThemeList} from '../../app.constants';
import {AppService} from '../../app.service';
import {Subscription} from 'rxjs';

@Component({
    selector: 'jhi-main',
    templateUrl: './main.component.html',
    styles: [`
        .layout {
            display: -ms-flexbox;
            -ms-flex-direction: row;
        }

        .layout-content {
            display: -ms-flexbox;
            -ms-flex-direction: column;
            -ms-flex: auto;
            width: 80%;
        }

        :host ::ng-deep .trigger {
            font-size: 18px;
            line-height: 50px;
            padding: 0 0 0 24px;
            cursor: pointer;
            transition: color .3s;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 9;
        }
    `]
})
export class JhiMainComponent implements OnInit {
    @ViewChild('container') container: ElementRef;
    @ViewChild('nzContent') nzContent: ElementRef;
    @ViewChild('trigger') customTrigger: TemplateRef<void>;

    token: boolean;
    theme;
    isCollapsed = false;
    triggerTemplate = null;
    otherSystem;  //是否外来系统

    private sub: Subscription;

    constructor(
        private titleService: Title,
        private router: Router,
        private appSer: AppService,
        private $localStorage: LocalStorageService,
        private $sessionStorage: SessionStorageService,
        public emitService: EmitService,
        private nzI18nService: NzI18nService,
        private commonSer: CommonService
    ) {

    }

    private getPageTitle(routeSnapshot: ActivatedRouteSnapshot) {
        let title: string = (routeSnapshot.data && routeSnapshot.data['pageTitle']) ? routeSnapshot.data['pageTitle'] : '智能监控';
        if (routeSnapshot.firstChild) {
            title = this.getPageTitle(routeSnapshot.firstChild) || title;
        }
        return title;
    }

    ngOnInit() {
        this.nzI18nService.setLocale(zh_CN);
        const accessToken = this.$localStorage.retrieve('accessToken');
        if (accessToken) {
            this.token = true;
        } else {
            this.token = false;
        }

        this.router.events.subscribe((event) => {
            if (event instanceof NavigationEnd) {
                this.titleService.setTitle(this.getPageTitle(this.router.routerState.snapshot.root));
            }
        });

        this.appSer.otherSystem.subscribe(value => {
            console.log(`otherSystem:${value}`);
            this.otherSystem = value;
        })

        const sub = this.appSer.theme.subscribe(value => {
            this.theme = value;
        });
    }

    fullScreen() {
        this.commonSer.showInFullScreen(this.container.nativeElement, 'RequestFullScreen');
    }

    changeCollapsed() {
        this.isCollapsed = !this.isCollapsed;
        this.appSer.setCollapse(this.isCollapsed);
    }

    changeTrigger(): void {
        this.triggerTemplate = this.customTrigger;
    }
}
