import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ViewChild, AfterViewInit, OnDestroy } from '@angular/core';
import { Router } from '@angular/router';
import { MetaSensorDisplayItem } from '@overflow/commons-typescript/model/meta';
import { MetaCrawler } from '@overflow/commons-typescript/model/meta';
import { MetaSensorItemType } from '@overflow/commons-typescript/model/meta';
import { TreeNode } from 'primeng/primeng';
import { Target } from '@overflow/commons-typescript/model/target';

@Component({
  selector: 'of-sensor-item-selector',
  templateUrl: './sensor-item-selector.component.html',
})
export class SensorItemSelectorComponent implements OnInit, OnChanges {

  @Input() target: Target;
  @Input() crawler: MetaCrawler;
  @Output() sensorItemsSelected = new EventEmitter<TreeNode[]>();

  selectedItems: TreeNode[];
  itemTreeNode: TreeNode[];

  constructor(
    private router: Router,
  ) { }

  ngOnInit() {
   //  this.selectedItems = new Set();
    // this.items$.subscribe(
    //   (list: MetaSensorDisplayItem[]) => {
    //     if (list !== null) {
    //     }
    //   },
    //   (error: RPCClientError) => {
    //     console.log(error.response.message);
    //   }
    // );

  }

  ngOnChanges() {
    // this.selectedItems.clear();
    // this.listStore.dispatch(new ListStore.ReadAllByCrawler(this.crawler));

    this.itemTreeNode = [];
    if (!this.target || !this.crawler) {
      return;
    }
    // Temporary data
    const displayItems = [];
    for (let i = 0; i < 10; i++) {
      let isDefault = false;
      const t: MetaSensorItemType = {
        name: 'CPU'
      };
      if (i % 2) {
        isDefault = true;
        t.name = 'Memory';
      }
      const si: MetaSensorDisplayItem = {
        id: i,
        key: 'SensorDisplayItemKey' + i,
        name: 'this.is.display.item.name' + i,
        default: isDefault,
        metaSensorItemType: t
      };
      displayItems.push(si);
    }

    this.generateTreeData(displayItems);
  }

  generateTreeData(items) {
    this.itemTreeNode = [];
    for (const item of items) {
      const categoryNode = this.existCategory(item);
      if (categoryNode === null) {
        const childrenNode = [];
        childrenNode.push(this.getChildNode(item));
        const node = {
          label: item.itemType.name,
          children: childrenNode,
          expanded: true,
        };
        this.itemTreeNode.push(node);
      } else {
        categoryNode.children.push(this.getChildNode(item));
      }
    }
  }

  getChildNode(item) {
    const childNode = {
      label: item.displayName,
      expandedIcon: item.default ? 'ui-icon-star' : '',
      collapsedIcon: item.default ? 'ui-icon-star' : '',
      expanded: true,
      data: item
    };
    return childNode;
  }
  existCategory(item: MetaSensorDisplayItem) {
    let categoryNode = null;
    for (const node of this.itemTreeNode) {
      if (node.label === item.metaSensorItemType.name) {
        categoryNode = node;
      }
    }
    return categoryNode;
  }


  onNodeSelect(event) {
    this.sensorItemsSelected.emit(this.selectedItems);
  }
  onNodeUnselect(event) {
   this.sensorItemsSelected.emit(this.selectedItems);
  }
}
