D-Net

import {Component, Input, ViewChild, Output, EventEmitter} from '@angular/core';

import {Observable}       from 'rxjs/Observable';

import {ClaimInsertComponent} from '../linking/insertClaim/insertClaim.component';

// import {ClaimResultComponent} from '../linking/claimResult/claimResult.component';

// import {ClaimSelectedResultsComponent} from '../linking/selected/selectedResults.component';

@Component({

    selector: 'inline-claim-result',

    template: `

     <div *ngIf="showComp" class="panel-body well well-lg">

       <div class="row" >

            <claim-result   [selectedDatasets]="datasets" [selectedPublications]="publications" (datasetsChange)="datasetsChange($event)" (publicationsChange)="publicationsChange($event)"   inline=true  > </claim-result>

<!-- ClaimSelectedResultsComponent -->

          <claim-selected-results   [publications]="publications"  [datasets]="datasets"

           (datasetsChange)="datasetsChange($event)" (publicationsChange)="publicationsChange($event)"

              (showChange)="showChange($event)"   inline=true [hideType]="hideType"  [showAccessRights]=true  > </claim-selected-results>

       </div>

       <claim-insert (showChange)="showChange($event)" inline=true [publications]="publications"  [datasets]="datasets"   showButton=false [inlineEntity]="inlineEntity" ></claim-insert>

       <button     (click)="insert()"  [class]="(enableButton)?'btn btn-xs btn-primary':'btn btn-primary btn-xs disabled'" style="float:right">Finish </button>

       <button     (click)="cancel()"  [class]="(enableButton)?'btn btn-xs btn-default ':'btn btn-xs btn-default disabled'" style="float:left">Cancel </button>

    </div>

`

})

 export class InlineClaimResultComponent {

  constructor () {

   }

  // This is the component from the landing page

  @Input() public inlineEntity:any;

  @Input() public inlineType:string;

  private hideType:string;

  publications = [];

  datasets = [];

  private show = 'project';

  private showComp:boolean = false;

  private enableButton:boolean=true;

  keyword: string = "";

@Output() datasetAdded = new EventEmitter();

@Output() publicationAdded = new EventEmitter();

@ViewChild (ClaimInsertComponent) claimInsert : ClaimInsertComponent ;

  ngOnInit() {

    console.info("Inline entity:"+this.inlineEntity.id);

    this.hideType = this.inlineType;

    if(this.inlineType == 'dataset' || this.inlineType == 'publication' ){

      this.hideType = "";

    }

  }

 datasetsChange($event) {

   this.datasets=$event.value;

   console.log($event.value);

  }

  publicationsChange($event) {

    this.publications=$event.value;

    console.log($event.value);

   }

  showChange($event) {

    this.show=$event.value;

    if(this.show == "end"){

      this.datasetAdded.emit({

        value: this.datasets

      });

      this.publicationAdded.emit({

        value: this.publications

      });

      this.datasets = [];

      this.publications = [];

      this.showComponent();

    }else if(this.show == "error"){

        this.showComponent();

    }

  }

  public toggle(){

    if(!this.showComp){

      this.showComponent();

    }else{

      this.hideComponent();

    }

  }

  private showComponent(){

    this.showComp=true;

    this.enableButton = true;

  }

  private hideComponent(){

    this.showComp=false;

  }

  private insert(){

   if(this.inlineType === 'project'){ //TODO check if neccessary

      this.claimInsert.projects = [];

      this.claimInsert.projects.push(this.inlineEntity);

    }

    this.enableButton = false;

    if (!this.claimInsert.validateInsertions()){

      this.enableButton = true;

    }

  }

  private cancel(){

    this.datasets = [];

    this.publications = [];

    this.hideComponent();

   }

}