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 { ConfirmationComponent } from '../widgets/confirmation/confirmation.component';

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;

import '../../assets/custom.js';
declare function simple_notifier(type: string, title: string, message:string): 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() isSelected:boolean;
  //@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:'', value:null},{key:'0', value:"Active"},{key:'1', value:"Inactive"}, {key:'2', value:"Submitted"}, {key:'3', value:"Cancel"}]
      //this.projects = [];
      this.dmpTableVisible = false;
      this.dataSetVisibe = false;
      this.isSelected=false;
      
      this.dmp = {
        id: null,
        label: '',
        previous:'',
        version:'',
        profileData:''
        //profile:{}
     }
  }

  ngOnInit() {

    this.getDmps(); 

    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) => {
        simple_notifier("danger",null,"Could not load User's Projects");
      }
    )
  }



getDmps(muted? : boolean){
  this.serverService.getDmpOfUser().subscribe( 
    response => {
      this.tableData = response;
      if(muted && muted!=true)
        simple_notifier("success",null,"Refreshed DMPs");
    },
    (err: HttpErrorResponse) => {
      simple_notifier("danger",null,"Could not refresh DMPs");
    }      
  ); 
}

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 =>{
      simple_notifier("success",null,"DMP created");
      this.getDmps();
    },
    error => {
      simple_notifier("danger",null,"Could not create the DMP");
    }
  );
  $("#newDmpModal").modal("hide");
}

updateDMP(){ 

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

  this.serverService.updateDmp(this.dmp)
  .subscribe(
    response =>{
      simple_notifier("success",null,"Edited the DMP");
      this.getDmps();
    },
    error =>{
      simple_notifier("danger",null,"Failed to edit the DMP");
    }
  );
  $("#newDmpModal").modal("hide");
  $("#newVersionDmpModal").modal("hide");
  
}

cloneDMP(dmp){
  dmp = {"id": dmp.id, "label": dmp.label};
  this.serverService.cloneDmp(dmp).subscribe(
    response => {
      simple_notifier("success",null,"Successfully cloned the DMP");
      this.getDmps();
    },
    error => {
      simple_notifier("danger",null,"Failed to clone the DMP");
    }
  );
  $("#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, elementId){ 
  this.isSelected = true;
  if (elementId == "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;
    this.dmp.description = item.description;
    this.dmp.status = item.status;
    setTimeout(function() {
      $("#newDmpModal").modal("show");  
    },0);
    
  }
  if(elementId == "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;
    this.dmp.description = item.description;
    $("#newVersionDmpModal").modal("show");
  }
  
  if(elementId == "showDatasets"){
    this.selectDmp(item);
    
  }

  return false; //return false will prevent browser from following the link
  
}

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

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

markDMPForDelete(dmp){
  this.dmp = dmp;
}

deleteDMP(confirmation){
  if(confirmation==true)
    this.deleteRow(this.dmp);
}

deleteRow(dmp){

  this.serverService.deleteDmp(dmp).subscribe( 
    response => { 
      simple_notifier("success",null,"Successfully deleted the DMP");
      this.getDmps();
    },
    (err: HttpErrorResponse) => {
      simple_notifier("danger",null,"Failed to delete the DMP");
    }      
  );

}

clickFilters(element){ 
  if(element.textContent == "More filters")
    element.textContent = "Less Filters";
  else
    element.textContent = "More Filters";
  }

SelectDMPStatus(dmp, event, oldValue){
  console.log(dmp);
  let cannotChangeStatus:boolean;
  if(dmp.status == 2){
    this.serverService.getDatasetForDmp({ "id": dmp.id }).subscribe(
      response => {
        response.forEach(dataset => {
          if(dataset.status !==2 || dataset.status !==3){
            cannotChangeStatus=true;            
          }
          return;
        });
        if(cannotChangeStatus == true){          
          dmp.status = 0;
          $("#messageForChangingStatus").modal("show");
        }
      },
      error => {
        console.log("could not retrieve dataset for dpm: "+dmp.id);
      }
    );
  }
  
}


}