import { Component, OnInit, Input, SimpleChanges } from '@angular/core';
import { DatasetsServiceService } from '../../services/datasets-service.service';

import '../../../assets/custom.js';
declare function simple_notifier(type: string, title: string, message:string): any;

@Component({
  selector: 'properties-editor',
  templateUrl: './properties-editor.component.html',
  styleUrls: ['./properties-editor.component.css']
})
export class PropertiesEditorComponent implements OnInit {

  @Input('datasetID') datasetID : string;
  private propstext : string;

  //for update sensing...
  private haveChanges : boolean = false;
  

  constructor(private datasetsService : DatasetsServiceService) {
    
  }

  ngOnInit() {
    
  }

  ngOnChanges(changes: SimpleChanges) {

    if(this.datasetID==null)
      return;
    if(changes.datasetID != null){
      this.datasetsService.getDatasetById(this.datasetID).subscribe((data) => {
        this.propstext = data.properties; 
      });
    }

  }


  onFocusIn($event){
    this.haveChanges = false; 
  }

  onTextChanged($event){
    this.haveChanges = true; 
  }

  onFocusOut($event){
    if(this.haveChanges){
      //console.log("Updating the value of properties to: "+$event.target.value+" on row with id: "+this.datasetID);
      this.datasetsService.getDatasetById(this.datasetID).subscribe( (data) => {
        data.properties = $event.target.value;
        this.datasetsService.setDataset(data).subscribe( (data) => {
          if(data.status == 201){
            simple_notifier("success",null,"Updated value of properties field");
          }
          else{
            simple_notifier("danger",null,"Could not update value of properties field");
          }
        });
      });
    }
  }

  preventDefaults($event){
    if($event.code == 'Tab') { 
      $event.preventDefault(); 
      //AND NOW HACK THE TAB KEY WITHIN THE TEXT EDITOR
      var start = $event.srcElement.selectionStart;
      var end = $event.srcElement.selectionEnd;
      // set textarea value to: text before caret + tab + text after caret
      $event.target.value = $event.target.value.substring(0, start)+"\t"+$event.target.value.substring(end);
      // put caret at right position again
      $event.srcElement.selectionStart =
      $event.srcElement.selectionEnd = start + 1;
    }
  }


}