import { Component, OnInit, Input, Inject, DoCheck, ViewEncapsulation, Output, EventEmitter, OnChanges } from '@angular/core';
import { Target } from 'packages/target/model';
import { Infra } from 'packages/infra/model';
import { MetaCrawler } from 'packages/meta/crawler/model/MetaCrawler';
import { MetaSensorDisplayItem } from 'packages/meta/sensor-display-item/model/MetaSensorDisplayItem';

import { Store, select } from '@ngrx/store';
import { RPCClientError } from '@loafer/ng-rpc/protocol';
import * as SensorItemKeyListStore from 'packages/sensor-item/store/key-list';
import { ReadSensorItemKeySelector } from 'packages/sensor-item/store';
import { MetaSensorItemKey } from 'packages/meta/sensor-item-key/model/MetaSensorItemKey';
import { TreeNode } from 'primeng/primeng';

@Component({
    selector: 'of-sensor-setting',
    templateUrl: './setting.component.html',
    encapsulation: ViewEncapsulation.None
})
export class SettingComponent implements OnInit, DoCheck, OnChanges {

    @Input() preTarget: Target;
    @Output() close = new EventEmitter();

    nextable = false;
    selectedTarget: Target;
    selectedCrawler: MetaCrawler;
    credentialPassed: boolean;
    selectedSensorDisplayItems: MetaSensorDisplayItem[];
    itemNodes: TreeNode[];
    step = 1;

    sensorItemKeys$ = this.keyListStore.pipe(select(ReadSensorItemKeySelector.select('list')));


    constructor(
        private keyListStore: Store<SensorItemKeyListStore.State>,
    ) {
    }

    ngOnInit() {
        // this.sensorItemKeys$.subscribe(
        //     (list: MetaSensorItemKey[]) => {
        //         if (list !== null) {
        //             console.log(list);
        //         }
        //     },
        //     (error: RPCClientError) => {
        //         console.log(error.response.message);
        //     }
        // );
    }

    ngOnChanges(changes) {

    }

    ngDoCheck() {
        try {
            if (
                this.selectedTarget === null ||
                this.selectedCrawler === null ||
                this.itemNodes === null ||
                this.itemNodes.length === 0 ||
                !this.credentialPassed
            ) {
                this.nextable = false;
            } else {
                this.nextable = true;
            }
        } catch (exception) {
            this.nextable = false;
        }
    }

    onCancel() {
        this.selectedTarget = null;
        this.selectedCrawler = null;
        this.credentialPassed = false;
        this.selectedSensorDisplayItems = null;
        this.close.emit();
    }

    onNext() {
        this.step += 1;
    }

    onPrev() {
        this.step -= 1;
    }

    onDone() {
        this.selectedSensorDisplayItems = [];
        for (const node of this.itemNodes) {
            if (node.data && node.data !== undefined) {
                this.selectedSensorDisplayItems.push(node.data);
            }
        }
        console.log(this.selectedSensorDisplayItems);
    }

    onTargetSelect(t: Target) {
        this.selectedTarget = t;
    }
    onCrawlerSelect(c: MetaCrawler) {
        this.selectedCrawler = c;
    }
    onCredentialPass(b: boolean) {
        this.credentialPassed = b;
    }
    onItemsSelect(nodes: TreeNode[]) {
        this.itemNodes = nodes;
    }
}