import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
import { ServerService } from '../../app/services/server.service';
import { DropdownField } from '../../app/form/fields/dropdown/field-dropdown';
import { Param } from '../entities/model/param';
import { Dataset } from '../entities/model/dataset';
import { Project } from '../entities/model/project';
import { DataTable, DataTableTranslations, DataTableResource } from 'angular-4-data-table-bootstrap-4';
declare var jquery:any;
declare var $ :any;

@Component({
  selector: 'modal',
  templateUrl: './modal.html'
})

export class ModalComponent implements OnInit {

  @Input() datasetDropDown: DropdownField;
  @Input() dataSetVisibe:boolean;
  @Input() datasets: Dataset[]; 
  @Input() project: Project; 
  datasetResource :DataTableResource<Dataset>; 
  @Input() datasetCount = 0;
  @Input('show-modal') showModal: boolean;

  @ViewChild('modalDmps') modalDmps;

  constructor(private serverService: ServerService) {
    this.datasetDropDown = new DropdownField();
    this.datasetDropDown.options = [];
    this.dataSetVisibe= false;
    this.datasets = [];
    this.project = new Project();
  }

  ngOnInit() {

    this.serverService.listDmpsLabelID().subscribe(
      response => {
        console.log("response");
        console.log(response);
        //let params = new Param();
        response.forEach((dmp) => {
          let params = new Param();
          params.key = dmp.id;
          params.value = dmp.label;
          this.datasetDropDown.options.push(params);
        });

      }
    )

  }

  show(gridRow){
  this.project.label = gridRow.label;
  this.project.abbreviation = gridRow.abbreviation;
  this.project.uri = gridRow.uri;
    $("#exampleModalDmps").modal("show");
  }

  showDatasets(dmpId, event) {
    debugger;
    this.dataSetVisibe = true;
    this.serverService.getAllDatasets().subscribe(
      response => {
        console.log("response");
        console.log(response);
        //let params = new Param();
        response.forEach((dataset) => {
          let dt = new Dataset();
          dt.id = dataset.id;
          dt.name = dataset.label;
          dt.uriDataset = dataset.uri;
          this.datasets.push(dt);
          var params = { limit: 8, offset: 0, sortAsc: false }
          this.afterLoad();
          this.datasetResource.query(params).then(datasets => this.datasets = datasets);
        });
      });

  }

  afterLoad(){
    this.datasetResource = new DataTableResource(this.datasets);
    this.datasetResource.count().then(count => this.datasetCount = count);
  }
}