D-Net

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

import {ClaimContext} from '../../claim-utils/claimEntities.class';

@Component({

    selector: 'claim-selected-contexts',

    template: `

        <!-- Contexts -->

          <ul     class="uk-accordion" uk-accordion="{showfirst:true}">

          <li class="uk-open">

            <h3 class="uk-accordion-title"> {{title}} ({{(contexts.length)}})</h3>

            <div class="uk-accordion-content" ><!--(contextSelected)="contextSelected($event)"-->

            <div class="uk-clearfix"><button *ngIf=" !showsearch "  (click)="showsearch = true;" class="uk-button uk-button-default uk-animation uk-float-right">Add more <span uk-icon="icon: plus"></span></button></div>

            <claim-contexts-search-form *ngIf=" showsearch "    [selectedList]="contexts" [projects]="projects" [results]="results" [inlineEntity]="inlineEntity" > </claim-contexts-search-form>

              <ul class="uk-list uk-list-line">

                <li class="list-group-item" *ngFor="let context of contexts" >

                  <span *ngIf="context.community != context.concept.label">{{context.community }} > {{context.category}} ></span><span> {{context.concept.label}} </span>

                  <span (click)="removeContext(context)" aria-hidden="true" class="uk-icon-button"><span uk-icon="icon: close"></span></span>

                </li>

              </ul>

              <div  *ngIf="contexts.length == 0 " class="uk-alert uk-alert-primary">There are no communities</div>

          </div>

        </li>

        </ul>

        `

})

export class ClaimSelectedContextsComponent {

   ngOnInit() {

     var myDate = new Date();

     this.todayDate=( myDate.getFullYear()+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;

     this.nextDate= ( (myDate.getFullYear()+100)+ "-" +myDate.getMonth() + 1) + "-" + myDate.getDate() ;

     //2015-05-01

    //  if(this.linkType == "context"){

       this.showsearch = true

    //  }else{

    //    this.showsearch = false;

    //  }

}

  @Input() contexts:ClaimContext[];

  //The following need to be kept in case we have to save the current state

  @Input() public projects;

  @Input() public results;

  @Input() public inlineEntity;

  @Input() componentClass:string = ""; //"" or "col-sm-6" for horizontal display (besides projects)

  @Input() show='home';

  @Input() title='Communities';

  @Input() linkType:string = "project";

  @Input() hideType;

  @Input() bulkMode:boolean = false;

  @Output() showChange = new EventEmitter();

  showsearch:boolean = false;

  todayDate = '';

  nextDate = '';

  showType(type){

     if(type != this.show){

       this.show = type;

       this.showChange.emit({

         value: this.show

       });

     }

    }

  removeContext(item:any){

    var index:number =this.contexts.indexOf(item);

     if (index > -1) {

        this.contexts.splice(index, 1);

      }

    }

  contextSelected($event) {

    // this.showsearch = false;

  }

}