import { Component, OnInit, Input, Output, EventEmitter, ViewChild } from '@angular/core';
import {GoogleSignInSuccess} from 'angular-google-signin';
import { Router, ActivatedRoute } from '@angular/router';
import { ServerService } from '../../app/services/server.service';
import { Dmp } from '../entities/model/dmp';
import { Dataset } from '../entities/model/dataset';
import { Project } from '../entities/model/project';

import {DataTable} from 'angular2-datatable';
import { DropdownField } from '../../app/form/fields/dropdown/field-dropdown';
import { Param } from '../entities/model/param';
import { ModalComponent } from '../modal/modal.component';
import { HttpErrorResponse } from '@angular/common/http';
import { FormGroup, FormControl }                 from '@angular/forms'; //na dw an xreiazontai
import { NgForm } from '@angular/forms';
import { DatasetsComponent } from '../datasets/dataset.component';
import { StatusToString } from '../pipes/various/status-to-string';

declare var $ :any;

@Component({
  selector: 'dmps',
  templateUrl: 'dmps.html',
  styleUrls: ['./dmp.component.css'],
  providers:  [ServerService]
})

export class DmpComponent implements OnInit{

  // Start ALTERNATIVE
  //whole dmp data model
  tableData : any[] = new Array();
  
  //organisation editor data model
  editingOrganisation: any = {};
  organisationEditorForm : any;

  //required by the table
  public filterQuery = "";
  public rowsOnPage = 10;
  public sortBy = "label";
  public sortOrder = "asc";

  //visibility rules for containers
  tableVisible: boolean = true;
  editorVisible: boolean = true;


  // for tableIds
  showIDs : boolean = false;
// END ALTERNATIVE


  dmp:any;
  @Input() dmpTableVisible: boolean;
  @Input() dmpCount = 0;
  @Input() projectsDropDown:DropdownField;
  @Input() dataSetVisibe:boolean;
  @Input() statusDropDown: DropdownField;
  //@Input() projects: Project[];
  dmpIdforDatasets: string;
  dmpLabelforDatasets:string;
  @ViewChild(DatasetsComponent) datasetsComponent:DatasetsComponent;
  

  @ViewChild('isignOutBtn') isignOutBtn;
  constructor( 
    private serverService: ServerService,
    private route: ActivatedRoute,
    private router: Router){
      this.projectsDropDown = new DropdownField();      
      this.projectsDropDown.options = [];
      this.statusDropDown = new DropdownField();
      this.statusDropDown.options= [{key:'0', value:"Active"},{key:'1', value:"Inactive"}]
      //this.projects = [];
      this.dmpTableVisible = false;
      this.dataSetVisibe = false;
      
      this.dmp = {
        id: null,
        label: '',
        previous:'',
        version:'',
        profileData:''
        //,
        //profile:{}
     }
  }

  ngOnInit() {
    
    this.serverService.getDmpOfUser().subscribe( 
      response => { 
        this.tableData = response;
      },
      (err: HttpErrorResponse) => {
        
      }      
    ); 

    this.serverService.getAllProjects().subscribe(
      response => {
        //let params = new Param();
        response.forEach((dmp) => {
          let params = new Param();
          params.key = dmp.id;
          params.value = dmp.label;
          this.projectsDropDown.options.push(params);
        });

      },
      (err: HttpErrorResponse) => {

      }
    )
  }



getDmps(){
  this.serverService.getDmpOfUser().subscribe( 
    response => { 
      this.tableData = response;
    },
    (err: HttpErrorResponse) => {
      
    }      
  ); 
}

newDMP(){ 
  console.log(this.dmp, this.dmp.projectsDropDownKey);  

  this.dmp.project = {"id" : this.dmp.project};
  this.dmp["version"] = 1;
  //this.dmp.profile = {};
  
  this.serverService.createDmpForCurrentUser(this.dmp)
  .subscribe(
    response =>{
      this.getDmps();
    }
  );
  $("#newDmpModal").modal("hide");
}

updateDMP(){ 

  this.dmp.project = {"id":this.dmp.project};

  this.serverService.updateDmp(this.dmp)
  .subscribe(
    response =>{
      this.getDmps();
    }
  );
  $("#newDmpModal").modal("hide");
  $("#newVersionDmpModal").modal("hide");
  
}

SaveDmp(){ 
  if (this.dmp.id == null)
    this.newDMP();
  else
    this.updateDMP();
}


selectDmp(item){ 
  this.dmpIdforDatasets = item.id;
  this.dmpLabelforDatasets = item.label;
  if(this.dataSetVisibe == false)
    this.dataSetVisibe = true;
  else 
    this.datasetsComponent.getDatasetForDmpMethod(item.id);
}

editRow(item, event){ 
  if (event.toElement.id == "editDMP"){
    this.dmp.label = item.label;
    this.dmp.previous = item.previous;
    this.dmp.version = item.version;
    this.dmp.profile = item.profile;
    this.dmp.profileData = item.profileData;
    this.dmp.id = item.id;
    this.dmp.project = item.project.id;
    $("#newDmpModal").modal("show");
  }
  if(event.toElement.id == "changeVersionDMP"){
    this.dmp.label = item.label;
    this.dmp.previous = item.previous;
    this.dmp.version = item.version;
    this.dmp.profile = item.profile;
    this.dmp.profileData = item.profileData;
    this.dmp.id = item.id;
    this.dmp.project = item.project.id;
    $("#newVersionDmpModal").modal("show");
  }
  
  if(event.toElement.id == "showDatasets"){
    this.selectDmp(item);
    
  }
  
}

newDmp(item){
  this.dmp.label = "";
  this.dmp.id = null;
  this.dmp.version = "";
 // this.dmp.profile = "";
  this.dmp.profileData = "";
  this.dmp.project = "";

  $("#newDmpModal").modal("show");
}



}