D-Net

      this.title.setTitle(params['community'].toUpperCase() + ' | Organizations');

import {IsCommunity} from '../../../openaireLibrary/connect/communityGuard/isCommunity.guard';

import {ConnectAdminLoginGuard} from '../../../openaireLibrary/connect/communityGuard/connectAdminLoginGuard.guard';

import {ConnectCommunityGuard} from '../../../openaireLibrary/connect/communityGuard/connectCommunityGuard.guard';

    SubjectsService, IsCommunity, ConnectAdminLoginGuard, ConnectCommunityGuard

  providers: [LoginGuard],

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

import { ActivatedRoute, Router } from "@angular/router";

import { Subject } from 'rxjs';

import { DataTableDirective } from 'angular-datatables';

import {ErrorCodes} from '../../../openaireLibrary/utils/properties/errorCodes';

import {SearchUtilsClass } from '../../../openaireLibrary/searchPages/searchUtils/searchUtils.class';

import {EnvProperties} from '../../../openaireLibrary/utils/properties/env-properties';

import {ManageCommunityProjectsService} from '../../../services/manageProjects.service';

import {SearchCommunityProjectsService} from '../../../openaireLibrary/connect/projects/searchProjects.service';

import {RouterHelper} from '../../../openaireLibrary/utils/routerHelper.class';

import {DOI, StringUtils} from '../../../openaireLibrary/utils/string-utils.class';

import {Session} from '../../../openaireLibrary/login/utils/helper.class';

import {LoginErrorCodes} from '../../../openaireLibrary/login/utils/guardHelper.class';

@Component({

    selector: 'remove-projects',

    templateUrl: './remove-projects.component.html',

    styles: [`

      #dpTable_info, #dpTable_paginate,  #dpTable_length,  #dpTable_filter{

        display: none;

      }

      `],

    encapsulation: ViewEncapsulation.None // this used in order styles to work

})

export class RemoveProjectsComponent implements OnInit {

  public routerHelper:RouterHelper = new RouterHelper();

  private community: string = '';

  private communityUrl = "https://beta.explore.openaire.eu";

  public errorCodes: ErrorCodes;

  @Output() communityProjectsChanged  = new EventEmitter();

  public communityProjects = [];

  public communitySearchUtils:SearchUtilsClass = new SearchUtilsClass();

  public sub: any; public subResults: any; subRemove: any;

  properties:EnvProperties;

  public disableForms: boolean = false;

  dtOptions: DataTables.Settings = {};

  showTable = false; filteringAdded = false;

  @ViewChild(DataTableDirective) datatableElement: DataTableDirective;

  dtTrigger: Subject<any> = new Subject(); //necessary

  public rowsOnPage:number  = 10;

  public queryParameters: string = "";

  public query = '';

  public selectedProjects=[] ;

  public elementRef;

  public funders:Set<string>;

  public selectedFunder:string ="";

  //@Output() projectSelected = new EventEmitter();

  //@Input() public properties:EnvProperties;

  public projects:string[];

  private triggered: boolean = false;

  private selectedCommunityProject: any;

  @ViewChild('AlertModalDeleteCommunity') alertModalDeleteCommunity;

  ngOnInit() {

    this.route.data.subscribe((data: { envSpecific: EnvProperties }) => {

        this.properties = data.envSpecific;

      });

    this.route.queryParams.subscribe(params => {

      if(params['communityId']) {

        this.community = params['communityId'];

        this.communityUrl = "https://beta."+this.community+".openaire.eu";

        this._getCommunityProjects();

        //this.getFunders();

        //this._getOpenaireProjects("", 1, 10);

      }

    });

    this.dtOptions = {

      // "paging": true,

      // "searching": true,

      // "lengthChange": false,

      "pageLength": this.rowsOnPage,

      "language": {

          "search": "",

          "searchPlaceholder": "Search projects..."

        }

    };

    this.communitySearchUtils.keyword = "";

  }

  constructor(private route: ActivatedRoute, private _router: Router, private _manageCommunityProjectsService: ManageCommunityProjectsService, private _searchCommunityProjectsService: SearchCommunityProjectsService) {

    this.errorCodes = new ErrorCodes();

    this.communitySearchUtils.status = this.errorCodes.LOADING;

  }

  public ngOnDestroy() {

    if(this.sub){

      this.sub.unsubscribe();

    }

    if(this.subResults){

      this.subResults.unsubscribe();

    }

    if(this.subRemove){

      this.subRemove.unsubscribe();

    }

    $.fn['dataTable'].ext.search.pop();

  }

  rerender(): void {

    this.datatableElement.dtInstance.then((dtInstance: DataTables.Api) => {

      // Destroy the table first

      dtInstance.destroy();

      // Call the dtTrigger to rerender again

      this.dtTrigger.next();

    });

  }

  ngAfterViewInit(): void {

    $.fn['dataTable'].ext.search.push((settings, data, dataIndex) => {

       if (this.filterData(data, this.communitySearchUtils.keyword, this.selectedFunder)) {

         return true;

       }

       return false;

     });

     //console.info("ngAfterViewInit");

  }

  filterData(row: any, query: string, selectedFunder: string) {

    let returnValue: boolean = false;

    if(query) {

      for(var i=0; i <3; i++){

        var r= this.filterQuery(row[i], query);

        if(r) {

          returnValue = true;

          break;

        }

      }

      if(!returnValue) {

        return false;

      }

    }

    if(selectedFunder){

      return this.filterQuery(row[2], selectedFunder);

    }

    return true;

  }

  filterQuery(data, query){

    if(data.toLowerCase().indexOf(query.toLowerCase()) > -1){

      return true;

    }else{

      return false;

    }

  }

  /*

  Trigger a table draw in order to get the initial filtering

  */

  triggerInitialLoad(){

    this.triggered = true;

    //console.info("triggerInitialLoad");

    setTimeout(function(){

      var table = (<any>$('#dpTable')).DataTable();

      table.page( 0  ).draw( false );

    }, 500);

    this.dtTrigger.next();

  }

  public inCommunity(result: any): any {

    let found = false;

    for(let project of this.communityProjects) {

      if(project.opeaireId == result.id) {

        return true;

      } else if(result['title'].name.search("("+project.grantId+")") != -1 && result.funderShortname == project.funder) {

        return true;

      }

    }

    return found;

  }

  goTo(page:number = 1){

      this.communitySearchUtils.page=page;

      var table = $('#dpTable').DataTable();

      table.page( page - 1  ).draw( false );

      var info = table.page.info();

      this.communitySearchUtils.totalResults = info.recordsDisplay;

  }

  totalPages(): number {

      let totalPages:any = this.communitySearchUtils.totalResults/(this.rowsOnPage);

      if(!(Number.isInteger(totalPages))) {

          totalPages = (parseInt(totalPages, 10) + 1);

      }

      return totalPages;

  }

  public confirmedDeleteProject(data : any) {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.subRemove = this._manageCommunityProjectsService.removeProject(this.properties, this.community, this.selectedCommunityProject.id).subscribe(

        data => {

          //console.info(data);

        },

        err => {

          console.log(err);

        },

        () => {

          let index = this.communityProjects.indexOf(this.selectedCommunityProject);

          this.communityProjects.splice(index, 1);

          this.communitySearchUtils.totalResults--;

          this.communitySearchUtils.page=1;

          this.rerender();

        }

      )

    }

  }

  public removeProject(communityProject: any) {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.selectedCommunityProject = communityProject;

      this.alertModalDeleteCommunity.cancelButton = true;

      this.alertModalDeleteCommunity.okButton = true;

      this.alertModalDeleteCommunity.alertTitle = "Remove project?";

      let title = "";

      if(communityProject.name) {

        title = communityProject.name;

      }

      if(communityProject.name && communityProject.acronym) {

        title += " (";

      }

      if(communityProject.acronym) {

        title += communityProject.acronym;

      }

      if(communityProject.name && communityProject.acronym) {

        title += ")";

      }

      this.alertModalDeleteCommunity.message = "Project";

      if(title) {

        this.alertModalDeleteCommunity.message += " '"+title+"' ";

      }

      this.alertModalDeleteCommunity.message += "will be removed from your community. Are you sure?";

      this.alertModalDeleteCommunity.okButtonText = "Yes";

      this.alertModalDeleteCommunity.open();

    }

  }

  public _getCommunityProjects(){

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.communitySearchUtils.status = this.errorCodes.LOADING;

      this.disableForms = true;

      this.communityProjects = [];

      this.communitySearchUtils.totalResults = 0;

      this.communitySearchUtils.page=1;

      this.communitySearchUtils.keyword = "";

      this.selectedFunder = "";

      this.subResults = this._searchCommunityProjectsService.searchProjects(this.properties, this.community).subscribe(

          data => {

            //console.info("search Projects [total communityProjects:"+data.length+"]");

            this.communityProjects = data;

            this.communitySearchUtils.totalResults = data.length;

            this.communitySearchUtils.status = this.errorCodes.DONE;

            // if(this.communitySearchUtils.totalResults == 0 ){

            //   this.communitySearchUtils.status = this.errorCodes.NONE;

            // }

            this.disableForms = false;

            if(!this.triggered) {

              this.triggerInitialLoad();

            } else {

              var table = $('#dpTable').DataTable();

              table.clear();

              this.rerender();

            }

            this.communityProjectsChanged.emit({

                value: this.communityProjects,

            });

            this.createFunderFilter();

          },

          err => {

            console.log(err);

             //TODO check erros (service not available, bad request)

            if(err.status == '404') {

              this.communitySearchUtils.status = this.errorCodes.NOT_FOUND;

            } else if(err.status == '500') {

              this.communitySearchUtils.status = this.errorCodes.ERROR;

            } else {

              this.communitySearchUtils.status = this.errorCodes.NOT_AVAILABLE;

            }

            this.disableForms = false;

            if(!this.triggered) {

              this.triggerInitialLoad();

            } else {

              var table = $('#dpTable').DataTable();

              table.clear();

              this.rerender();

            }

          }

      );

    }

  }

  private createFunderFilter(): Set<String> {

    this.funders = new Set<string>();

    let i;

    for(i=0; i<this.communityProjects.length; i++) {

      let funder = this.communityProjects[i].funder;

      if(funder && !this.funders.has(funder)) {

        this.funders.add(funder);

      }

    }

    return this.funders;

  }

}

import { NgModule } from '@angular/core';

import {RouterModule} from '@angular/router';

import {IsCommunity} from '../../../openaireLibrary/connect/communityGuard/isCommunity.guard';

import {ConnectAdminLoginGuard} from '../../../openaireLibrary/connect/communityGuard/connectAdminLoginGuard.guard';

import {ManageProjectsComponent} from './manage-projects.component';

@NgModule({

    imports: [

        RouterModule.forChild([

            { path: '', canActivate: [IsCommunity, ConnectAdminLoginGuard], component: ManageProjectsComponent}

        ])

    ]

})

export class CommunityProjectsRoutingModule { }

<div class="uk-child-width-expand@s uk-text-center uk-margin-bottom" uk-grid>

  <div>

    <form class=" uk-animation uk-card uk-card-default uk-padding" >

      <div>

        <select class="uk-select"  [(ngModel)]="selectedFunderId" name="select_funder"  >

         <option  value="0" (click)="funderChanged('0','Select funder:')">Select funder:</option>

         <option *ngFor="let  funder of funders"  [value]="funder.id" (click)="funderChanged(funder.id,funder.name)">{{(funder.name.split("||").length > 0)?(funder.name.split("||")[0]+" ("+funder.name.split("||")[1]+")"):(funder.name)}}</option>

        </select>

      </div>

    </form>

  </div>

  <div>

    <form class="uk-text-center uk-animation uk-card uk-card-default uk-padding">

      <div>

        <input type="text" class="uk-input  uk-width-1-2" placeholder="Project name or ID" aria-describedby="sizing-addon2"  [(ngModel)]="openaireSearchUtils.keyword"  name="keyword" >

        <button (click)="keywordChanged(openaireSearchUtils.keyword)"  type="submit" class=" uk-button">

           <span class="uk-icon">

           <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>

           </span>Search

         </button>

      </div>

    </form>

  </div>

</div>

<div *ngIf="openaireSearchUtils.status == errorCodes.DONE" class="uk-alert uk-alert-primary">

  <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

Newly added projects will be linked to your community on the next run of our algorithms.

<!-- <div> If you cannot find a funder that is relevant for your community, please contact us (<a [href]="'mailto:' + properties.feedbackmailForMissingEntities +'?Subject=[OpenAIRE Connect - '+ community + '] report missing Funder' + '&body=' + body" target="_top">feedback@openaire.eu</a>) and we'll try to get the funder on board!</div> -->

</div>

<div *ngIf="openaireSearchUtils.status == errorCodes.DONE" class="uk-alert uk-alert-primary">

  <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

If you cannot find a funder that is relevant for your community, please contact us (<a [href]="'mailto:' + properties.feedbackmailForMissingEntities +'?Subject=[OpenAIRE Connect - '+ community + '] report missing Funder' + '&body=' + body" target="_top">feedback@openaire.eu</a>) and we'll try to get the funder on board!

</div>

<errorMessages [status]="[openaireSearchUtils.status]" [type]="'OpenAIRE projects'"></errorMessages>

<div *ngIf="openaireSearchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary">

  <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

   If you wish to suggest a new funder to include or report a missing project, please contact us via

   <a [href]="'mailto:' + properties.feedbackmailForMissingEntities +'?Subject=[OpenAIRE Connect - '+ community + '] report missing project' + '&body=' + body" target="_top">feedback@openaire.eu</a>.

</div>

<div *ngIf="openaireSearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">

  <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">

    <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">

      {{openaireSearchUtils.totalResults | number}} projects, page {{openaireSearchUtils.page | number}} of {{(totalPages()) | number}}

    </span>

    <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">

      <paging-no-load [limitPaging]=true [currentPage]="openaireSearchUtils.page" [totalResults]="openaireSearchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value)"></paging-no-load>

    </span>

  </div>

</div>

<ul *ngIf="(openaireSearchUtils.page <= pagingLimit)" [class]="'uk-list uk-list-divider  uk-margin '+custom_class">

 <!-- <errorMessages [status]="[status]" [type]="'results'"></errorMessages> -->

   <li *ngFor="let result of openaireProjects" class="uk-animation-fade">

       <h6 class="uk-grid" uk-grid>

           <span class="uk-width-5-6">

             <a target="_blank" [href]="properties.baseOpenaireLink+'/search/project?projectId='+result.id">

               <span *ngIf="result['title'].name || result.acronym">

                 <span *ngIf="result.acronym">{{result.acronym}}</span>

                 <span *ngIf="result.acronym && result['title'].name">-</span>

                 <span [innerHTML]="result['title'].name"></span>

                 <span *ngIf="result.code">({{result.code}})</span>

               </span>

               <span *ngIf="!result['title'].name && !result.acronym">

                 [no title available]

                 <span *ngIf="result.code">({{result.code}})</span>

              </span>

               <span class="custom-external custom-icon space"></span>

             </a>

           </span>

           <span class="uk-width-1-6 uk-text-center">

             <!-- <a *ngIf="!inCommunity(result)" (click)="addProject(result)" class="uk-icon-button"><svg height="20" icon="plus" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><rect height="17" width="1" x="9" y="1"></rect><rect height="1" width="17" x="1" y="9"></rect></svg></a> -->

<!--               green_background_color green_color-->

             <a *ngIf="!inCommunity(result)" (click)="addProject(result)" class="uk-icon-button add uk-button-primary" uk-icon="plus" title="Add"></a>

             <span *ngIf="inCommunity(result)" class="uk-label uk-label-success">Added</span>

             <!-- <svg *ngIf="inCommunity(result)" class="added" src="assets/imgs/check-icon.png" title="Added" width="20" type="image" height="20"></svg> -->

             <!-- <button *ngIf="undo[result.id]" class="uk-button uk-button-danger uk-button-small" (click)="removeProject(result.id)">Undo</button> -->

             <!-- <input *ngIf="undo[result.id]" (click)="removeProject(result.id)" class="remove" src="assets/imgs/x-icon.png" title="Undo" width="20" type="image" height="20"> -->

             <!-- <a *ngIf="undo[result.id]" (click)="removeProject(result.id)" class="remove red_colour"><svg height="20" icon="close" ratio="1" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><rect height="17" width="1" x="9" y="1"></rect><rect height="1" width="17" x="1" y="9"></rect></svg></a> -->

<!--               red_background_color red_color-->

             <a *ngIf="undo[result.id]" (click)="removeProject(undo[result.id], result.id)" class="uk-icon-button remove uk-button-danger" uk-icon="close" title="Undo"></a>

          </span>

       </h6>

       <span *ngIf="result.title && result.title.accessMode" [class]="'uk-label custom-label  label-'+ result.title.accessMode " title="Access Mode">{{result.title.accessMode}}</span>

       <span *ngIf="result.funderShortname" class="uk-label custom-label label-funder " title="Funder">{{result.funderShortname}}</span>

       <span *ngIf="result.title  && result.title.sc39" class="uk-label custom-label label-sc39 " title="Special Clause 39">Special Clause 39</span>

       <div *ngIf="result.startYear && result.endYear"> Start year: {{result.startYear}} - End year: {{result.endYear}}</div>

       <div *ngIf="result['organizations'] != undefined && result['organizations'].length > 0">

           <span> Organization: </span>

           <span *ngFor="let organization of result['organizations'].slice(0,10) let i=index">

               <a *ngIf="organization.id" target="_blank"

                  [href]="properties.baseOpenaireLink+'/search/organization?organizationId='+organization.id">

                    <span>{{organization.name}}</span>

                    <span class="custom-external custom-icon space"></span>

               </a>

             <span

                   *ngIf="!organization.id">

                       {{organization.name}}</span><span

                   *ngIf="(i < result['organizations'].length-1) && (i < 9)">,</span>

           </span>

           <span *ngIf="result['organizations'].length > 10">...</span>

       </div>

   </li>

</ul>

<div [class]="openaireSearchUtils.page > pagingLimit ? 'search-results' : ''" *ngIf="(openaireSearchUtils.page >= pagingLimit) && (openaireSearchUtils.totalResults > resultsPerPage*pagingLimit)">

    <p class="uk-alert-warning" uk-alert>For more results please try a new, more specific query</p>

</div>

<div *ngIf="openaireSearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">

  <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">

    <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">

      {{openaireSearchUtils.totalResults | number}} projects, page {{openaireSearchUtils.page | number}} of {{(totalPages()) | number}}

    </span>

    <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">

      <paging-no-load [limitPaging]=true [currentPage]="openaireSearchUtils.page" [totalResults]="openaireSearchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value)"></paging-no-load>

    </span>

  </div>

</div>

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

import { ActivatedRoute, Router } from "@angular/router";

//import { Subject } from 'rxjs/Subject';

import {SearchResult}     from '../../../openaireLibrary/utils/entities/searchResult';

import {ErrorCodes} from '../../../openaireLibrary/utils/properties/errorCodes';

import {SearchFields, FieldDetails} from '../../../openaireLibrary/utils/properties/searchFields';

import {SearchUtilsClass } from '../../../openaireLibrary/searchPages/searchUtils/searchUtils.class';

import {EnvProperties} from '../../../openaireLibrary/utils/properties/env-properties';

import {SearchProjectsService} from '../../../openaireLibrary/services/searchProjects.service';

import {RouterHelper} from '../../../openaireLibrary/utils/routerHelper.class';

import {DOI, StringUtils} from '../../../openaireLibrary/utils/string-utils.class';

import {ManageCommunityProjectsService} from '../../../services/manageProjects.service';

import {Session} from '../../../openaireLibrary/login/utils/helper.class';

import {LoginErrorCodes} from '../../../openaireLibrary/login/utils/guardHelper.class';

@Component({

    selector: 'add-projects',

    templateUrl: './add-projects.component.html',

})

export class AddProjectsComponent implements OnInit {

  @Input() communityProjects = [];

  //@Output() communityProjectsChanged  = new EventEmitter();

  private community: string = '';

  public openaireProjects = [];

  public undo = {};

  public queryParameters: string = "";

  public funders:string[];

  public selectedFunderId:string ="0";

  selectedFunderName:string ="Select funder:";

  public disableForms: boolean = false;

  public warningMessage = "";

  public infoMessage = "";

  public rowsOnPage:number  = 10;

  public routerHelper:RouterHelper = new RouterHelper();

  public errorCodes: ErrorCodes;

  public openaireSearchUtils:SearchUtilsClass = new SearchUtilsClass();

  public properties:EnvProperties = null;

  public pagingLimit:number = 0;

  public resultsPerPage: number = 0;

  public subFunders: any; public subResults: any; subAdd: any; subRemove: any;

  public body:string = "Send from page";

  ngOnInit() {

      this.route.data

        .subscribe((data: { envSpecific: EnvProperties }) => {

           this.properties = data.envSpecific;

           this.pagingLimit = data.envSpecific.pagingLimit;

           this.resultsPerPage =data.envSpecific.resultsPerPage;

           this.route.queryParams.subscribe(params => {

             this.community = params['communityId'];

             this.getFunders();

             this._getOpenaireProjects("", 1, 10);

             var referrer = null;

             if (typeof location !== 'undefined') {

               referrer = location.href;

             }

             this.body = "[Please write your message here]";

             this.body = StringUtils.URIEncode(this.body);

           });

        });

  }

  constructor(private route: ActivatedRoute, private _router: Router, private _searchProjectsService: SearchProjectsService, private _manageCommunityProjectsService: ManageCommunityProjectsService) {

    this.errorCodes = new ErrorCodes();

    this.openaireSearchUtils.status = this.errorCodes.LOADING;

  }

  public ngOnDestroy() {

    if(this.subFunders){

      this.subFunders.unsubscribe();

    }

    if(this.subResults){

      this.subResults.unsubscribe();

    }

    if(this.subAdd) {

      this.subAdd.unsubscribe();

    }

    if(this.subRemove) {

      this.subRemove.unsubscribe();

    }

  }

  public addProject(project: SearchResult) {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.subAdd = this._manageCommunityProjectsService.addProject(this.properties, this.community, project).subscribe(

        data => {

          this.undo[project.id] = data.id;

        },

        err => {

          console.log(err.status);

        }/*,

        () => {

          console.info("completed ADD");

        }*/

      );

    }

  }

  public removeProject(projectId: string, communityProjectId: string) {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.subRemove = this._manageCommunityProjectsService.removeProject(this.properties, this.community, projectId).subscribe(

        data => {

          //console.info(data);

        },

        err => {

          console.log(err);

        },

        () => {

          this.undo[communityProjectId] = "";

        }

      )

    }

  }

  public inCommunity(project: any): any {

    for(let communityProject of this.communityProjects) {

      if(communityProject.openaireId == project.id) {

        return true;

      } else if(project.code == communityProject.grantId && project.funderShortname == communityProject.funder) {

        return true;

      }

    }

    if(this.undo[project.id]) {

      return true;

    }

    return false;

  }

  getFunders ()  {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      this.subFunders = this._searchProjectsService.getFunders(this.properties).subscribe(

        data => {

          this.funders = data[1];

        },

        err => console.log(err)

      );

    }

  }

  private _getOpenaireProjects(parameters:string, page: number, size: number){

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      if(page > this.pagingLimit) {

        size=0;

      }

      if(this.openaireSearchUtils.status == this.errorCodes.LOADING) {

        this.openaireSearchUtils.status = this.errorCodes.LOADING;

        this.disableForms = true;

        this.openaireProjects = [];

        this.openaireSearchUtils.totalResults = 0;

        this.subResults = this._searchProjectsService.searchProjects(parameters, null, page, size, [], this.properties).subscribe(

          data => {

              this.undo = {};

              //console.info("total openaire projects = "+data[0]);

              this.openaireSearchUtils.totalResults = data[0];

              this.openaireProjects = data[1];

              //this.searchPage.checkSelectedFilters(this.filters);

              this.openaireSearchUtils.status = this.errorCodes.DONE;

              if(this.openaireSearchUtils.totalResults == 0 ){

                this.openaireSearchUtils.status = this.errorCodes.NONE;

              }

              this.disableForms = false;

              if(this.openaireSearchUtils.status == this.errorCodes.DONE) {

                // Page out of limit!!!

                let totalPages:any = this.openaireSearchUtils.totalResults/(this.openaireSearchUtils.size);

                if(!(Number.isInteger(totalPages))) {

                    totalPages = (parseInt(totalPages, 10) + 1);

                }

                if(totalPages < page) {

                  this.openaireSearchUtils.totalResults = 0;

                  this.openaireSearchUtils.status = this.errorCodes.OUT_OF_BOUND;

                }

              }

          },

          err => {

              console.log(err);

               //TODO check erros (service not available, bad request)

              if(err.status == '404') {

                this.openaireSearchUtils.status = this.errorCodes.NOT_FOUND;

              } else if(err.status == '500') {

                this.openaireSearchUtils.status = this.errorCodes.ERROR;

              } else {

                this.openaireSearchUtils.status = this.errorCodes.NOT_AVAILABLE;

              }

              this.disableForms = false;

          }

        );

      }

    }

  }

  totalPages(): number {

    let totalPages:any = this.openaireSearchUtils.totalResults/(this.rowsOnPage);

    if(!(Number.isInteger(totalPages))) {

        totalPages = (parseInt(totalPages, 10) + 1);

    }

    return totalPages;

  }

  keywordChanged(keyword) {

    this.openaireSearchUtils.keyword = keyword;

    this.buildQueryParameters();

    this.goTo(1);

  }

  funderChanged(funderId:string, funderName:string){

    this.selectedFunderId = funderId;

    this.selectedFunderName = funderName;

    this.buildQueryParameters();

    this.goTo(1);

  }

  buildQueryParameters() {

    this.queryParameters = "";

    if(this.openaireSearchUtils.keyword) {

      this.queryParameters = "q="+StringUtils.URIEncode(this.openaireSearchUtils.keyword);

    }

    if(this.selectedFunderId != "0") {

      this.queryParameters += this.queryParameters ? "&" : "";

      this.queryParameters += "fq=funder exact " + '"'+StringUtils.URIEncode(this.selectedFunderId)+ '"';

    }

  }

  goTo(page:number = 1){

    this.openaireSearchUtils.page=page;

    this.openaireSearchUtils.status = this.errorCodes.LOADING;

    this._getOpenaireProjects(this.queryParameters, page, 10);

  }

}

import { Component, ViewChild, OnInit, ViewEncapsulation, Input, ElementRef } from '@angular/core';

import { ActivatedRoute, Router } from "@angular/router";

import {RemoveProjectsComponent} from './remove-projects.component';

import {AddProjectsComponent} from './add-projects.component';

import {Session} from '../../../openaireLibrary/login/utils/helper.class';

import {LoginErrorCodes} from '../../../openaireLibrary/login/utils/guardHelper.class';

import {HelperFunctions} from "../../../openaireLibrary/utils/HelperFunctions.class";

import {Title} from '@angular/platform-browser';

@Component({

    selector: 'manage-projects',

    template: `

      <div id="manage-projects">

        <div class="menubar uk-margin-bottom ">

          <a *ngIf="!toggle" (click)="updateCommunityProjects()" uk-toggle="target: .toggle-usage" class="uk-button uk-button-primary uk-float-right">{{toggleLinkMessage}}</a>

          <div class="manage-projects-title uk-text-large">{{pageTitle}}</div>

        </div>

        <div class="toggle-usage">

          <remove-projects (communityProjectsChanged)="communityProjectsChanged($event)"></remove-projects>

          <fab (clicked)="updateCommunityProjects()" uk-toggle="target: .toggle-usage"></fab>

        </div>

        <div class="toggle-usage" hidden>

          <!-- (updateCommunityProjects)="updateCommunityProjects($event)" -->

          <add-projects [(communityProjects)]="communityProjects"></add-projects>

        </div>

      </div>

    `

})

export class ManageProjectsComponent implements OnInit {

  private community: string = '';

  @Input() communityProjects =[];

  @ViewChild (RemoveProjectsComponent) removeProjectsComponent : RemoveProjectsComponent ;

  @ViewChild (AddProjectsComponent) addProjectsComponent : AddProjectsComponent ;

  public warningMessage = "";

  public infoMessage = "";

  public toggle: boolean = true;

  public updateCommunityProjectsOnToggle: boolean = false;

  public pageTitle: string = "Manage projects";

  public toggleLinkMessage: string = "Manage projects";

  ngOnInit() {

    this.route.queryParams.subscribe(params => {

      if(params['communityId']) {

        this.community = params['communityId'];

        this.title.setTitle('Administration Dashboard | Projects');

      }

    });

  }

  constructor(private element: ElementRef,

              private title: Title,

              private route: ActivatedRoute, private _router: Router) {}

  public ngOnDestroy() {}

  public updateCommunityProjects() {

    if(!Session.isLoggedIn()){

      this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

    } else {

      HelperFunctions.scroll();

      this.toggle = !this.toggle;

      if(this.toggle) {

        this.pageTitle = "Manage projects";

        // this.toggleLinkMessage = "Missing projects?";

        //if(this.updateCommunityProjectsOnToggle) {

          this.removeProjectsComponent._getCommunityProjects();

          this.addProjectsComponent.undo = {};

        //}

      } else {

        this.updateCommunityProjectsOnToggle = false;

        this.pageTitle = "Search projects";

        //this.toggleLinkMessage = "Manage projects";

      }

    }

  }

  public communityProjectsChanged($event) {

    this.communityProjects = $event.value;

  }

  // public updateCommunityProjects($event) {

  //   this.updateCommunityProjectsOnToggle = true;

  // }

}

import { NgModule } from '@angular/core';

import { HttpClientModule } from '@angular/common/http';

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

import { RouterModule } from '@angular/router';

import { EnvironmentSpecificResolver } from '../../../openaireLibrary/utils/properties/environmentSpecificResolver';

import { EnvironmentSpecificService } from '../../../openaireLibrary/utils/properties/environment-specific.service';

import { DataTablesModule } from 'angular-datatables';

import { ManageProjectsComponent } from './manage-projects.component';

import { ManageCommunityProjectsService } from '../../../services/manageProjects.service';

import { SearchProjectsServiceModule } from '../../../openaireLibrary/connect/projects/searchProjectsService.module';

import { RemoveProjectsComponent } from './remove-projects.component';

import { AddProjectsComponent } from './add-projects.component';

import { SearchProjectsService } from '../../../openaireLibrary/services/searchProjects.service';

import { PagingModule } from '../../../openaireLibrary/utils/paging.module';

import { SearchPagingModule } from '../../../openaireLibrary/searchPages/searchUtils/searchPaging.module';

import {ErrorMessagesModule} from '../../../openaireLibrary/utils/errorMessages.module';

import {AlertModalModule} from '../../../openaireLibrary/utils/modal/alertModal.module';

import {FABModule} from '../../../utils/fabModule.module';

import {CommonModule} from '@angular/common';

import {CommunityProjectsRoutingModule} from './communityProjects-routing.module';

@NgModule({

    imports: [

        CommonModule,

        HttpClientModule,

        FormsModule,

        ReactiveFormsModule,

        RouterModule,

        DataTablesModule,

        PagingModule, SearchPagingModule,

        ErrorMessagesModule,

        AlertModalModule,

        SearchProjectsServiceModule,

        FABModule,

        CommunityProjectsRoutingModule

    ],

    declarations: [

        ManageProjectsComponent,

        RemoveProjectsComponent,

        AddProjectsComponent

    ],

    providers: [

        ManageCommunityProjectsService,

        SearchProjectsService,

        EnvironmentSpecificResolver, EnvironmentSpecificService

    ],

    exports: [ManageProjectsComponent]

})

export class CommunityProjectsModule { }

  <div class="uk-child-width-expand@s uk-text-center uk-margin-bottom" uk-grid>

    <div>

      <form class=" uk-animation uk-card uk-card-default uk-padding" >

        <div>

          <select class="uk-select"  [(ngModel)]="selectedFunder" name="select_funder"  >

           <option  value="" (click)="goTo(1)">Select funder:</option>

           <option *ngFor="let  funder of funders"  [value]="funder" (click)="goTo(1)">{{funder}}</option>

          </select>

        </div>

      </form>

    </div>

    <div>

      <form class="uk-text-center uk-animation uk-card uk-card-default uk-padding">

        <div>

          <input type="text" class="uk-input  uk-width-1-2" placeholder="Search community projects..." aria-describedby="sizing-addon2"  [(ngModel)]="communitySearchUtils.keyword"  name="keyword" >

          <button (click)="goTo(1)"  type="submit" class=" uk-button">

             <span class="uk-icon">

             <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="search" ratio="1"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg>

             </span>Search

           </button>

        </div>

      </form>

    </div>

  </div>

  <errorMessages [status]="[communitySearchUtils.status]" [type]="'community projects'"></errorMessages>

  <div *ngIf="communitySearchUtils.status == errorCodes.DONE" class="uk-alert uk-alert-primary">

    <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

  All the research results linked to the projects specified here will be automatically linked to your community dashboard.  

  </div>

  <div *ngIf="communitySearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">

    <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">

      <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">

        {{communitySearchUtils.totalResults | number}} projects, page {{communitySearchUtils.page | number}} of {{(totalPages()) | number}}

      </span>

      <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">

        <paging-no-load [currentPage]="communitySearchUtils.page" [totalResults]="communitySearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>

      </span>

    </div>

  </div>

<!-- uk-first-column uk-width-expand -->

  <div class="custom-dataTable-content">

    <div class="uk-overflow-container">

      <table datatable class="uk-table uk-table-striped divider-table" [dtOptions]="dtOptions" id="dpTable"  [dtTrigger]="dtTrigger" dtInstance="dtInstanceCallback">

        <thead>

          <tr>

            <th class="uk-text-center">Project</th>

            <th class="uk-text-center">Grant Id</th>

            <th class="uk-text-center">Funder</th>

            <th class="uk-text-center">Action</th>

          </tr>

        </thead>

        <tbody>

          <tr class="uk-table-middle" *ngFor="let result of communityProjects">

            <td class="uk-text-center uk-width-1-4">

              <a target="_blank"

                 [href]="communityUrl+'/search/project?' + ((result.openaireId) ? 'projectId='+result.openaireId : 'grantId='+result.grantId+'&funder='+result.funder)">

                <span *ngIf="result.name">{{result.name}}</span>

                <span *ngIf="result.name && result.acronym">(</span><span *ngIf="result.acronym">{{result.acronym}}</span><span *ngIf="result.name && result.acronym">)</span>

                <span *ngIf="!result.name && !result.acronym">[no title available]</span>

                <span class="custom-external custom-icon space"></span>

              </a>

            </td>

            <td class="uk-text-center uk-width-1-4">

              <span *ngIf="result.grantId">{{result.grantId}}</span>

              <span *ngIf="!result.grantId">-</span>

            </td>

            <td class="uk-text-center uk-width-1-4">

              <span *ngIf="result.funder">{{result.funder}}</span>

              <span *ngIf="!result.funder">-</span>

            </td>

            <td class="uk-text-center uk-width-1-4">

<!--              red_background_color red_color-->

              <a (click)="removeProject(result)" class="uk-icon-button remove uk-button-danger" uk-icon="icon: close; ratio: 1" title="Remove"></a>

            </td>

          </tr>

        </tbody>

      </table>

    </div>

  </div>

  <div *ngIf="communitySearchUtils.totalResults > 0" class="uk-align-center uk-margin-remove-bottom">

    <div class="searchPaging uk-panel uk-margin-top uk-grid uk-margin-bottom">

      <span class="uk-h6 uk-width-1-1@s uk-width-1-2@m">

        {{communitySearchUtils.totalResults | number}} projects, page {{communitySearchUtils.page | number}} of {{(totalPages()) | number}}

      </span>

      <span class="float-children-right-at-medium margin-small-top-at-small uk-width-1-1@s uk-width-1-2@m">

        <paging-no-load [currentPage]="communitySearchUtils.page" [totalResults]="communitySearchUtils.totalResults" [size]="10" (pageChange)="goTo($event.value, false)"></paging-no-load>

      </span>

    </div>

  </div>

  <modal-alert #AlertModalDeleteCommunity (alertOutput)="confirmedDeleteProject($event)"></modal-alert>

  <!-- <delete-confirmation-dialog #deleteConfirmationModal [isModalShown]="isModalShown" (emmitObject)="confirmedDeleteProject($event)">

      Are you sure you want to remove the selected project from your community?

  </delete-confirmation-dialog> -->

<!-- </div> -->

 <div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>

<div id="manage-zenodo-communities" class="uk-padding-small">

    <div *ngIf="zenodoCommunitySearchUtils.status == errorCodes.LOADING " class="uk-position-center">

      <loading></loading>

    </div>

  <div *ngIf="zenodoCommunitySearchUtils.status == errorCodes.NONE "

       class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">

    <div>      No zenodo communities found

    </div>

  <no-load-paging  *ngIf="zenodoCommunitySearchUtils.totalResults > 0"   [type]="'Zenodo Communities'"

                    [page]="zenodoCommunitySearchUtils.page" [pageSize]="rowsOnPage" (pageChange)="goTo($event.value)"

                    [totalResults]="zenodoCommunitySearchUtils.totalResults" >

        class="uk-card uk-card-default uk-margin-bottom uk-padding" >

            <div class="uk-width-auto@m uk-width-1-1">

              <div class=" uk-flex uk-flex-middle uk-flex-center uk-flex-column uk-height-1-1">

                <div class="uk-padding-small uk-padding-remove-horizontal">

                  <div [class.hide-element]="inThelist(item, selectedCommunities)">

                    <span *ngIf=" masterCommunity && item.id==masterCommunity.id" class="uk-label uk-label-warning">Master zenodo community</span>

                     <div (click)="addCommunity(item)" class="uk-button action uk-flex uk-flex-middle"

                          uk-tooltip="title:<div class='uk-padding-small'><div class='uk-margin-bottom uk-text-bold'>Add new community </div><div>Newly added Zenodo communities will be linked to your community on the next run of our algorithms.</div></div>">

  <!--                     <i class="clickable uk-text-success" uk-icon="plus"></i>-->

                       <div class="uk-text-success">

                         <icon name="add"></icon>

                       </div>

                       <span class="uk-margin-small-left"> Add community</span>

                    </div>

                  <div [class.hide-element]="!inThelist(item, selectedCommunities) && !(masterCommunity && item.id==masterCommunity.id)">

                    <div (click)="removeCommunity(item)" class="uk-button action uk-flex uk-flex-middle">

  <!--                    <i class="clickable " uk-icon="trash"-->

  <!--                    ></i>-->

                      <icon name="remove_circle_outline" ratio="0.7"></icon>

                      <span class="uk-margin-small-left"> Remove community </span>

                    </div>

                  </div>

        </div>

      </li>

    </ul>

  <no-load-paging *ngIf="zenodoCommunitySearchUtils.totalResults > 0"   [type]="'Zenodo Communities'"

                    [page]="zenodoCommunitySearchUtils.page" [pageSize]="rowsOnPage" (pageChange)="goTo($event.value)"

                    [totalResults]="zenodoCommunitySearchUtils.totalResults" >

            communities</button>

           [bordered]="true" colorClass="uk-text-secondary" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>

<div id="manage-zenodo-communities" class="uk-padding uk-padding-remove-top">

  <div *ngIf="masterCommunity" class="uk-animation-fade  uk-alert uk-alert-primary uk-padding-small uk-margin-large-bottom">

    <div class="uk-text-large uk-margin-bottom"  >Main Zenodo community</div>

     <preview-zenodo-community [item]="masterCommunity"></preview-zenodo-community>

  </div>

    <!--<div *ngIf="searchUtils.status == errorCodes.DONE ||searchUtils.status == errorCodes.NONE " class="uk-alert uk-alert-primary">

      <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>

    All the research results belonging to the Zenodo communities specified here will be automatically linked to your community dashboard.

    </div>-->

    <div *ngIf="searchUtils.status == errorCodes.LOADING "

         class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert">

      <span class="loading-gif  uk-align-center" ></span>

    <div *ngIf="searchUtils.status == errorCodes.NONE || (searchUtils.status != errorCodes.LOADING  &&

      previewCommunities && previewCommunities.length == 0)"

         class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">

      <div>      No zenodo communities found

    </div>

    <div class="">

      <div class="uk-overflow-container">

        <no-load-paging *ngIf=" previewCommunities && previewCommunities.length > 0"  [type]="'Zenodo Communities'"

                          [page]="page" [pageSize]="size" (pageChange)="page = $event.value"

                          [totalResults]="previewCommunities.length" >

            <li class="" *ngFor="let item of previewCommunities; let i = index;" class="uk-card uk-card-default uk-margin-bottom"

                [class.uk-hidden] = "i >= page * size ||

              <div class="uk-grid uk-padding uk-grid-divider  " uk-grid>

                <div class="uk-width-expand@m uk-width-1-1">

                  <preview-zenodo-community [item]="item"></preview-zenodo-community>

                </div>

                <div class="uk-text-center uk-width-auto@m uk-width-1-1">

                  <div class=" uk-flex uk-flex-middle uk-flex-center uk-height-1-1">

                    <div class="uk-padding-small uk-padding-remove-horizontal">

                      <div (click)="removeCommunity(item)"

                           class="uk-button action uk-flex uk-flex-middle ">

                        <icon name="remove_circle_outline" ratio="0.7"></icon>

                        <span class="uk-margin-small-left">Remove community</span>

                      </div>

            </li>

          </ul>

    </div>

    selector: 'add-zenodo-communities',

    templateUrl: './add-zenodo-communities.component.html',

    public zenodoCommunities = null; // zenodo search API results

    public totalZenodoCommunities = null;

    @Input() properties:EnvProperties = null;

    @Input() communityId = null;

    @ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;

    public filterForm: FormControl;

    private subscriptions: any[] = [];

    public zenodoCommunitySearchUtils:SearchUtilsClass = new SearchUtilsClass();

    errorCodes: ErrorCodes;

    public rowsOnPage = 10;

    @Input() masterCommunity = null;

    @Input() selectedCommunities = [];

    constructor (private route: ActivatedRoute,

                 private _router: Router,

                 public _fb: FormBuilder,

                 private _zenodoCommunitieService: ZenodoCommunitiesService,

               private _manageZenodoCommunitiesService: ManageZenodoCommunitiesService) {

       this.errorCodes = new ErrorCodes();

       this.zenodoCommunitySearchUtils.status = this.errorCodes.LOADING;

    }

    ngOnInit() {

      this.filterForm = this._fb.control('');

      this.subscriptions.push(this.filterForm.valueChanges.subscribe(value => {

        this.searchTermStream.next(value);

      this.subscriptions.push(this.searchTermStream

        .pipe(debounceTime(1000), distinctUntilChanged())

        .subscribe((term: string) => {

          this.zenodoCommunitySearchUtils.keyword = term;

          this.goTo(1);

        }));

      this.zenodoCommunitySearchUtils.keyword = "";

      if(!Session.isLoggedIn()){

        this._router.navigate(['/user-info'], { queryParams: { "errorCode": LoginErrorCodes.NOT_VALID, "redirectUrl":  this._router.url} });

      } else {

        this.zenodoCommunitySearchUtils.status = this.errorCodes.LOADING;

        if (this.communityId != null && this.communityId != '') {

            this._zenodoCommunitieService.getZenodoCommunities(this.properties, this.properties.zenodoCommunities+"?page="+this.zenodoCommunitySearchUtils.page+"&size="+this.rowsOnPage).subscribe(

                result  => {

                         this.zenodoCommunities = result[0];

                         this.totalZenodoCommunities = result[1];

                         this.zenodoCommunitySearchUtils.totalResults = result[1];

                         this.zenodoCommunitySearchUtils.page = 1;

                         this.zenodoCommunitySearchUtils.size =this.rowsOnPage;

                         if(this.totalZenodoCommunities == 0){

                           this.zenodoCommunitySearchUtils.status = this.errorCodes.NONE;

                         }else{

                           this.zenodoCommunitySearchUtils.status = this.errorCodes.DONE;

                         }

            },

            error => {

              this.zenodoCommunitySearchUtils.status = this.errorCodes.ERROR;

          );

        }

    ngOnDestroy() {

      this.subscriptions.forEach(subscription => {

        if (subscription instanceof Subscription) {

          subscription.unsubscribe();