D-Net

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

import {Observable}       from 'rxjs/Observable';

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

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

import { FetchPublications } from '../../utils/fetchEntitiesClasses/fetchPublications.class';

import { FetchDataproviders } from  '../../utils/fetchEntitiesClasses/fetchDataproviders.class';

import { FetchProjects } from  '../../utils/fetchEntitiesClasses/fetchProjects.class';

import { FetchDatasets } from '../../utils/fetchEntitiesClasses/fetchDatasets.class';

import { FetchOrganizations } from '../../utils/fetchEntitiesClasses/fetchOrganizations.class';

import { FetchPeople } from '../../utils/fetchEntitiesClasses/fetchPeople.class';

import {SearchPublicationsService} from '../../services/searchPublications.service';

import {SearchDataprovidersService} from '../../services/searchDataproviders.service';

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

import {SearchDatasetsService} from '../../services/searchDatasets.service';

import {SearchPeopleService} from '../../services/searchPeople.service';

import {SearchOrganizationsService} from '../../services/searchOrganizations.service';

import {OpenaireProperties} from '../../utils/properties/openaireProperties';

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

@Component({

  changeDetection: ChangeDetectionStrategy.Default,

  encapsulation: ViewEncapsulation.Emulated,

    selector: 'search-find',

    template: `

    <div  class="uk-margin-top">

      <div class="page-header">

          <h1>{{pageTitle}}</h1>

      </div>

    <div class="uk-grid">

        <div class="uk-width-1-1  uk-margin uk-panel uk-panel-box uk-panel-box-default">

            <search-form [(keyword)]=keyword (keywordChange)="keywordChanged($event)"></search-form>

        </div>

        <div  class="  uk-grid uk-margin-top uk-width-1-1">

            <ul class="uk-tab uk-tab-left uk-width-large-1-5 uk-width-small-1-1 " data-uk-switcher="{connect:'#searchtabs'}">

                    <li (click)="searchPublications()"  >

                       <a   href="#pubsTab">

                           Publications {{((keyword.length > 0)?'('+fetchPublications.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                   <li (click)="searchDatasets()">

                       <a   href="#dataTab" (click)="searchDatasets()">

                           Datasets {{((keyword.length > 0)?'('+fetchDatasets.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                   <li (click)="searchProjects()"  >

                       <a   href="#projectsTab">

                           Projects {{((keyword.length > 0)?'('+fetchProjects.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                   <li (click)="searchDataProviders()" >

                       <a   href="#dataProviderTab">

                           Data Providers {{((keyword.length > 0)?'('+fetchDataproviders.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                   <li (click)="searchOrganizations()" >

                       <a   href="#organizationsTab"  >

                           Organizations {{((keyword.length > 0)?'('+fetchOrganizations.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                   <li (click)="searchPeople()" >

                       <a   href="#peopleTab" >

                           People {{((keyword.length > 0)?'('+fetchPeople.searchUtils.totalResults+')':'')}}

                       </a>

                   </li>

                </ul>

                <ul id="searchtabs" class="uk-switcher uk-margin-left uk-width-large-3-4 uk-width-small-1-1">

                     <li id="pubsTab" class="uk-active">

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults> 10" ><a [href] = "linkToSearchPublications" >View all {{fetchPublications.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchPublications.results" [(status)]= "fetchPublications.status"></search-result>

                      </div>

                      <div *ngIf = "keyword.length == 0 && activeTab=='publications'" class ="uk-animation-fade" >

                              <browse-entities entityName="publication" baseUrl="/search/find/publications" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>

                      </div>

                    </li>

                    <li id="dataTab">

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults> 10" ><a [href] = "linkToSearchDatasets" >View all {{fetchDatasets.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchDatasets.results" [(status)]= "fetchDatasets.status"></search-result>

                        </div>

                        <div *ngIf = "keyword.length == 0 && activeTab=='datasets'" class ="uk-animation-fade">

                                <browse-entities entityName="dataset" baseUrl="/search/find/datasets" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>

                        </div>

                    </li>

                    <li id="projectsTab" >

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResults> 10" ><a [href] = "linkToSearchProjects" >View all {{fetchProjects.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchProjects.results" [(status)]= "fetchProjects.status"></search-result>

                      </div>

                      <div *ngIf = "keyword.length == 0 && activeTab=='projects'" class ="uk-animation-fade">

                              <browse-entities entityName="project" baseUrl="/search/find/projects" [refineFields]=searchFields.PROJECT_REFINE_FIELDS></browse-entities>

                      </div>

                    </li>

                    <li id="dataProviderTab">

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults> 10" ><a [href] = "linkToSearchDataproviders" >View all {{fetchDataproviders.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchDataproviders.results" [(status)]= "fetchDataproviders.status"></search-result>

                      </div>

                      <div *ngIf = "keyword.length == 0 && activeTab=='dataproviders'" class ="uk-animation-fade" >

                              <browse-entities entityName="dataprovider" baseUrl="/search/find/dataproviders" [refineFields]=searchFields.DATASOURCE_REFINE_FIELDS></browse-entities>

                      </div>

                    </li>

                    <li id="organizationsTab" >

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchOrganizations.searchUtils.totalResults> 10" ><a [href] = "linkToSearchOrganizations" >View all {{fetchOrganizations.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchOrganizations.results" [(status)]= "fetchOrganizations.status"></search-result>

                      </div>

                      <div *ngIf = "keyword.length == 0 && activeTab=='organizations'" class ="uk-animation-fade">

                              <browse-entities entityName="organization" baseUrl="/search/find/organizations" [refineFields]=searchFields.ORGANIZATION_REFINE_FIELDS></browse-entities>

                      </div>

                    </li>

                    <li id="peopleTab">

                      <div *ngIf = "keyword.length > 0" class ="uk-animation-fade">

                        <div class = "uk-text-right" *ngIf = "fetchPeople.searchUtils.totalResults> 10" ><a [href] = "linkToSearchPeople" >View all {{fetchPeople.searchUtils.totalResults}} results</a></div>

                        <search-result [(results)]="fetchPeople.results" [(status)]= "fetchPeople.status"></search-result>

                      </div>

                      <div *ngIf = "keyword.length == 0 && activeTab=='people'" class ="uk-animation-fade">

                          <div   class="uk-alert uk-alert-info " role="alert">No person statistics found</div>

                      </div>

                    </li>

                </ul>

      </div>

    </div>

    `

})

export class SearchComponent {

  public sub: any;

  public subPublicationsCount: any;

  public subDatasetsCount: any;

  public subProjectsCount: any;

  public subDataprovidersCount: any;

  public subOrganizationsCount: any;

  public subPeopleCount: any;

  public reloadPublications: boolean;

  public reloadDatasets: boolean;

  public reloadProjects: boolean;

  public reloadDataproviders: boolean;

  public reloadOrganizations: boolean;

  public reloadPeople: boolean;

  public pageTitle = "Search in OpenAIRE"

  public keyword:string = "";

  public publications:string[];

  public datasets:string[];

  public projectsTab:string[];

  public dataproviders:string[];

  public organizations:string[];

  public people:string[];

  public activeTab = "publications";

  public linkToSearchPublications = "";

  public linkToSearchProjects = "";

  public linkToSearchDataproviders = "";

  public linkToSearchDatasets = "";

  public linkToSearchOrganizations = "";

  public linkToSearchPeople = "";

  public fetchPublications : FetchPublications;

  public fetchDataproviders : FetchDataproviders;

  public fetchProjects : FetchProjects;

  public fetchDatasets: FetchDatasets;

  public fetchOrganizations: FetchOrganizations;

  public fetchPeople: FetchPeople;

  public searchFields:SearchFields = new SearchFields();

public subPub;public subData;public subProjects;public subOrg;public subPeople; public subDataPr;

  constructor ( private route: ActivatedRoute,

      private _searchPublicationsService: SearchPublicationsService,

      private _searchDataprovidersService: SearchDataprovidersService,

      private _searchProjectsService: SearchProjectsService,

      private _searchDatasetsService: SearchDatasetsService,

      private _searchOrganizationsService: SearchOrganizationsService,

      private _searchPeopleService: SearchPeopleService,

      private location: Location ) {

    this.fetchPublications = new FetchPublications(this._searchPublicationsService);

    this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);

    this.fetchProjects = new FetchProjects(this._searchProjectsService);

    this.fetchDatasets = new FetchDatasets( this._searchDatasetsService);

    this.fetchOrganizations = new FetchOrganizations( this._searchOrganizationsService);

    this.fetchPeople = new FetchPeople(this._searchPeopleService);

  }

  public ngOnInit() {

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

      this.keyword = (params['keyword'])?params['keyword']:"";

      if(this.keyword !=null && this.keyword.length > 0){

          this.reloadTabs();

          this.searchPublications();

          this.count();

      }

    });

  }

  public ngOnDestroy() {

    this.sub.unsubscribe();

    if(this.keyword !=null && this.keyword.length > 0){

        if(this.subPub){

          this.subPub.unsubscribe();

        }

        if(this.subData){

          this.subData.unsubscribe();

        }

        if(this.subProjects){

          this.subProjects.unsubscribe();

        }

        if(this.subOrg){

          this.subOrg.unsubscribe();

        }

        if(this.subPeople){

          this.subPeople.unsubscribe();

        }

        if(this.subDataPr){

          this.subDataPr.unsubscribe();

        }

        this.subPublicationsCount.unsubscribe();

        this.subDatasetsCount.unsubscribe();

        this.subProjectsCount.unsubscribe();

        //this.subDataprovidersCount.unsubscribe();

        this.subOrganizationsCount.unsubscribe();

        this.subPeopleCount.unsubscribe();

    }

  }

  public searchPublications() {

    this.activeTab = "publications";

    if(this.reloadPublications) {

        this.reloadPublications = false;

        this.fetchPublications.getResultsByKeyword(this.keyword,  1, 10);

        this.linkToSearchPublications = OpenaireProperties.getLinkToSearchPublications() + "?keyword="  + this.keyword;

    }

   }

   public searchDatasets() {

     this.activeTab = "datasets";

     if(this.reloadDatasets) {

         this.reloadDatasets = false;

         this.fetchDatasets.getResultsByKeyword(this.keyword,  1, 10);

         this.linkToSearchDatasets = OpenaireProperties.getLinkToSearchDatasets() + "?keyword="  + this.keyword;

     }

   }

   public  searchProjects() {

     this.activeTab = "projects";

     if(this.reloadProjects) {

         this.reloadProjects = false;

         this.fetchProjects.getResultsByKeyword(this.keyword,  1, 10);

         this.linkToSearchProjects = OpenaireProperties.getLinkToSearchProjects() + "?keyword="  + this.keyword;

     }

   }

   public  searchDataProviders() {

     this.activeTab = "dataproviders";

     if(this.reloadDataproviders) {

         this.reloadDataproviders = false;

         this.fetchDataproviders.getResultsByKeyword(this.keyword, 1, 10);

         this.linkToSearchDataproviders = OpenaireProperties.getLinkToSearchDataProviders() + "?keyword="  + this.keyword;

     }

   }

   public searchOrganizations() {

     this.activeTab = "organizations";

     if(this.reloadOrganizations) {

         this.reloadOrganizations = false;

         this.fetchOrganizations.getResultsByKeyword(this.keyword,  1, 10);

         this.linkToSearchOrganizations = OpenaireProperties.getLinkToSearchOrganizations() + "?keyword="  + this.keyword;

     }

   }

   public  searchPeople() {

     this.activeTab = "people";

     if(this.reloadPeople) {

         this.reloadPeople = false;

         this.fetchPeople.getResultsByKeyword(this.keyword,  1, 10);

         this.linkToSearchPeople = OpenaireProperties.getLinkToSearchPeople() + "?keyword="  + this.keyword;

     }

   }

   public keywordChanged($event){

    this.keyword = $event.value;

    console.info("Search Find: search with keyword \"" +  this.keyword + "\"" );

      this.location.go(location.pathname,"?keyword="  + this.keyword);

    this.reloadTabs();

    if(this.activeTab == "publications") {

        this.searchPublications();

    }

    if(this.activeTab == "projects") {

        this.searchProjects();

    }

    if(this.activeTab == "dataproviders") {

        this.searchDataProviders();

    }

    if(this.activeTab == "datasets") {

        this.searchDatasets();

    }

    if(this.activeTab == "organizations") {

        this.searchOrganizations();

    }

    if(this.activeTab == "people") {

        this.searchPeople();

    }

    this.count();

   }

   private count() {

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

           this.subPub = this._searchPublicationsService.numOfSearchPublications(this.keyword).subscribe(

             data => {

                 this.fetchPublications.searchUtils.totalResults = data;

             },

             err => {

       		    console.log(err);

       		 }

           );

       })

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

           this.subData = this._searchDatasetsService.numOfSearchDatasets(this.keyword).subscribe(

             data => {

                 this.fetchDatasets.searchUtils.totalResults = data;

             },

             err => {

                 console.log(err);

              }

           );

       })

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

          this.subProjects = this._searchProjectsService.numOfSearchProjects(this.keyword).subscribe(

             data => {

                 this.fetchProjects.searchUtils.totalResults = data;

             },

             err => {

                 console.log(err);

              }

           );

       })

       this.fetchDataproviders.getNumForSearch(this.keyword);

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

            this.subOrg = this._searchOrganizationsService.numOfSearchOrganizations(this.keyword).subscribe(

             data => {

                 this.fetchOrganizations.searchUtils.totalResults = data;

             },

             err => {

                 console.log(err);

              }

           );

       })

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

          this.subPeople =  this._searchPeopleService.numOfSearchPeople(this.keyword).subscribe(

             data => {

                 this.fetchPeople.searchUtils.totalResults = data;

             },

             err => {

                 console.log(err);

              }

           );

       })

   }

   private reloadTabs() {

       this.reloadPublications = true;

       this.reloadDatasets = true;

       this.reloadProjects = true;

       this.reloadDataproviders = true;

       this.reloadOrganizations = true;

       this.reloadPeople = true;

   }

}