openaire-library/landingPages/dataProvider/dataProvider.component.html

<div id="tm-main" class=" uk-section  uk-margin-small-top tm-middle"   >
  <div uk-grid uk-grid>
   <div class="tm-main uk-width-1-1@s uk-width-1-1@m  uk-width-1-1@l uk-row-first ">

<div class="uk-container uk-margin-top datasource">
    <div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning  uk-margin-large-top" role="alert">{{warningMessage}}</div>
    <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger  uk-margin-large-top" role="alert">{{errorMessage}}</div>
    <div [style.display]="showLoading ? 'inline' : 'none'" class="uk-animation-fade uk-margin-large-top  uk-width-1-1" role="alert"><img class="loading-gif  uk-align-center" ></div>

    <div *ngIf="dataProviderInfo != null" uk-grid class="uk-grid-large">

        <div class="uk-width-expand@m uk-width-1-1@s">
            <!--h3 *ngIf="dataProviderInfo.title != null">
                <a *ngIf="dataProviderInfo.title['url'] != undefined && dataProviderInfo.title['url'] != null"
                    href="{{dataProviderInfo.title['url']}}" target="_blank" class="custom-external">
                    {{dataProviderInfo.title['name']}}
                </a>
                <p *ngIf="dataProviderInfo.title['url'] == undefined || dataProviderInfo.title['url'] == null">
                    {{dataProviderInfo.title['name']}}
                </p>
            </h3-->
            <showTitle   [title]="dataProviderInfo.title"></showTitle>
            <div class="uk-text-large " *ngIf="dataProviderInfo.officialName && this.dataProviderInfo.title.name != dataProviderInfo.officialName ">{{dataProviderInfo.officialName}}</div>

            <span *ngIf="dataProviderInfo.type" class="uk-label custom-label label-type label-dataprovider " title="Type">{{dataProviderInfo.type}}</span>
            <span *ngIf="dataProviderInfo.compatibility" class="uk-label custom-label label-compatibility " title="Compatibility">
              <a *ngIf="!dataProviderInfo.compatibility.name && dataProviderInfo.compatibility.id"
                  [queryParams]="{datasourceId: dataProviderInfo.compatibility.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
                {{dataProviderInfo.compatibility.info}}
              </a>
              <span *ngIf="dataProviderInfo.compatibility.name || !dataProviderInfo.compatibility.id">
                {{dataProviderInfo.compatibility.info}}
              </span>
              <a *ngIf="dataProviderInfo.compatibility.name && dataProviderInfo.compatibility.id"
                    [queryParams]="{datasourceId: dataProviderInfo.compatibility.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
                {{dataProviderInfo.compatibility.name}}
              </a>
              <span *ngIf="dataProviderInfo.compatibility.name && !dataProviderInfo.compatibility.id">
                {{dataProviderInfo.compatibility.name}}
              </span>
            </span>

            <ul class="uk-list">
                <li *ngIf="dataProviderInfo.aggregationStatus && dataProviderInfo.aggregationStatus.fundedContent != -1"><span class="uk-text-bold">Results with funding information: </span>
                    {{dataProviderInfo.aggregationStatus.fundedContent | number}}
                </li>
                <li *ngIf="dataProviderInfo.aggregationStatus && dataProviderInfo.aggregationStatus.indexRecords != -1"><span class="uk-text-bold">Collected full-texts: </span>
                    {{dataProviderInfo.aggregationStatus.indexRecords | number}}
                </li>
                <li *ngIf="dataProviderInfo.oaiPmhURL"><span class="uk-text-bold">OAI-PMH: </span>
                        <span class="uk-button-text">
                            <a target="_blank" href="{{dataProviderInfo.oaiPmhURL}}">
                                {{dataProviderInfo.oaiPmhURL}}
                            </a>
                        </span>

                </li>
                <li *ngIf="dataProviderInfo.openDoarURL">
                        <span class="uk-button-text">
                            <a target="_blank" href="{{dataProviderInfo.openDoarURL}}">
                                Detailed content provider information (OpenDOAR)
                            </a>
                        </span>

                </li>
                <li *ngIf="dataProviderInfo.r3DataURL">
                        <span class="uk-button-text">
                            <a target="_blank" href="{{dataProviderInfo.r3DataURL}}">
                                Detailed content provider information (Re3data)
                            </a>
                        </span>

                </li>

                <li *ngIf="dataProviderInfo.countries != undefined && dataProviderInfo.countries.length > 0"><span class="uk-text-bold">Countries: </span>{{dataProviderInfo.countries.join(", ")}}</li>
            </ul>

            <div *ngIf="showTabs">
                <ul class="custom-accordion" uk-accordion *ngIf="dataProviderInfo.tabs2 != undefined">

                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Publications') != -1" (click)="search('publicationsTab', 1, 10); activeTab='Publications'">
                        <a class="uk-accordion-title" href="#">Publications
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchPublications.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <publicationsTab *ngIf="activeTab=='Publications'"
                                           [paramsForSearchLink]="paramsForSearchLink"
                                           [fetchPublications] = "fetchPublications" [(properties)]=properties>
                          </publicationsTab>
                        </div>
                    </li>
                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Research Data') != -1" (click)="search('datasetsTab', 1, 10); activeTab='Research Data'">
                        <a class="uk-accordion-title" href="#">Research Data
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchDatasets.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <p>
                            <datasetsTab *ngIf="activeTab=='Research Data'"
                                          [paramsForSearchLink]="paramsForSearchLink"
                                          [fetchDatasets]="fetchDatasets" [(properties)]=properties>
                          </datasetsTab>
                          </p>
                        </div>
                    </li>

                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Software') != -1" (click)="search('softwareTab', 1, 10); activeTab='Software'">
                        <a class="uk-accordion-title" href="#">Software
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchSoftware.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <softwareTab *ngIf="activeTab=='Software'"
                                       [paramsForSearchLink]="paramsForSearchLink"
                                       [fetchSoftware]="fetchSoftware" [(properties)]=properties>
                          </softwareTab>
                        </div>
                    </li>

                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Other Research Products') != -1" (click)="search('orpsTab', 1, 10); activeTab='Other Research Products'">
                        <a class="uk-accordion-title" href="#">Other Research Products
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchOrps.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <orpsTab *ngIf="activeTab=='Other Research Products'"
                                       [paramsForSearchLink]="paramsForSearchLink"
                                       [fetchOrps]="fetchOrps" [(properties)]=properties>
                          </orpsTab>
                        </div>
                    </li>

                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Projects') != -1" (click)="search('projectsTab', 1, 10); activeTab='Projects'">
                        <a class="uk-accordion-title" href="#">Projects
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchProjects.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <projectsTab *ngIf="activeTab=='Projects'"
                                       [paramsForSearchLink]="paramsForSearchLink"
                                       [fetchProjects]="fetchProjects" [(properties)]=properties>
                          </projectsTab>
                        </div>
                    </li>
                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Content Providers') != -1" (click)="search('datasourcesTab', 1, 10); activeTab='Content Providers'">
                        <a class="uk-accordion-title" href="#">Content Providers
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{fetchDataproviders.searchUtils.totalResults | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <datasourcesTab *ngIf="activeTab=='Content Providers'"
                                          [paramsForSearchLink]="paramsForSearchLink"
                                          [fetchDataproviders]="fetchDataproviders" [(properties)]=properties>
                          </datasourcesTab>
                        </div>
                    </li>
                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Organizations') != -1" (click)="search('organizationsTab', 1, 10); activeTab='Organizations'">
                        <a class="uk-accordion-title" href="#">Organizations
                          <!-- <span class="uk-badge uk-badge-notification"> -->
                              ({{dataProviderInfo.organizations.length | number}})
                          <!-- </span> -->
                        </a>
                        <div class="uk-accordion-content">
                          <organizationsTab *ngIf="activeTab=='Organizations'"
                                            [organizations]="dataProviderInfo.organizations">
                          </organizationsTab>
                        </div>
                    </li>
                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Related Content Providers') != -1" (click)="search('relatedDatasourcesTab', 1, 10); activeTab='Related Content Providers'">
                        <a class="uk-accordion-title" href="#">Related Content Providers</a>
                        <div class="uk-accordion-content">
                          <relatedDatasourcesTab *ngIf="activeTab=='Related Content Providers'"
                              [dataproviderId]="datasourceId"
                              [results]="dataProviderInfo.relatedDatasources"
                              [loading]="loadingRelatedDatasources"
                              [fetchPublications]="fetchAggregatorsPublications"
                              [fetchDatasets]="fetchAggregatorsDatasets"
                              [fetchSoftware]="fetchAggregatorsSoftware"
                              [fetchOrps]="fetchAggregatorsOrps"
                              [(properties)]=properties>
                          </relatedDatasourcesTab>
                        </div>
                    </li>
                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Statistics') != -1" (click)="search('statisticsTab', 1, 10); activeTab='Statistics'">
                        <a class="uk-accordion-title" href="#">Statistics</a>
                        <div class="uk-accordion-content">
                          <div *ngIf="activeTab=='Statistics' && statsClicked">

                            <errorMessages [status]="[fetchPublications.searchUtils.status, fetchDatasets.searchUtils.status]" [type]="'statistics'" tab_error_class=true></errorMessages>

                            <div *ngIf="(fetchPublications.searchUtils.status == errorCodes.DONE || fetchDatasets.searchUtils.status == errorCodes.DONE)">
                              <p class="uk-text-bold">Latest Research Result Timeline</p>
                              <i-frame  [url]=docsTimelineUrl width="800" height="350"></i-frame>
                              <p class="uk-text-bold">Research Result Types</p>
                              <i-frame [url]=docsTypesUrl width="800" height="350"></i-frame>
                            </div>


                              <div *ngIf="fetchPublications.searchUtils.totalResults > 0 || (fetchDatasets.searchUtils.totalResults > 0)">

                                    <p class="uk-text-bold">Funders in Research Results of content provider</p>
                                    <i-frame  [url]=docsFunderUrl width="800" height="350"></i-frame>

                              </div>
                              <div *ngIf="fetchPublications.searchUtils.totalResults > 0 ">
                                  <p class="uk-text-bold">Projects with most Publications</p>
                                  <i-frame [url]=pubsProjectsUrl width="800" height="350"></i-frame>
                              </div>
                              <div *ngIf="(fetchDatasets.searchUtils.totalResults > 0)">
                                    <div>
                                        <p class="uk-text-bold">Projects with most Research Data</p>
                                        <i-frame  [url]=dataProjectsUrl width="800" height="350"></i-frame>
                                    </div>
                              </div>
                            </div>
                        </div>
                    </li>



                    <li *ngIf="dataProviderInfo.tabs2.indexOf('Metrics') != -1" (click)="search('metricsTab', 1, 10); activeTab='Metrics'">
                        <a class="uk-accordion-title" href="#">Metrics</a>
                        <div class="uk-accordion-content">
                          <metrics *ngIf="activeTab=='Metrics'" [pageViews]="pageViews"
                              [id]="datasourceId" [entityType]="'datasources'" [entity]="'Content Provider'"
                              (metricsResults)="metricsResults($event)" [(properties)] = properties>
                          </metrics>
                          <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalViews > 0"
                              [url]=viewsFrameUrl width="100%" height="250">
                          </i-frame>
                          <i-frame *ngIf="activeTab=='Metrics' && metricsClicked && totalDownloads > 0"
                              [url]=downloadsFrameUrl width="100%" height="250">
                          </i-frame>
                        </div>
                    </li>

                </ul>
            </div>

        </div>
        <div class="uk-width-large@m uk-width-1-1@s">
          <div class="uk-card uk-card-default uk-padding-small">
            <div>
              Share - Bookmark<addThis ></addThis>
            </div>
            <metrics  [pageViews]="pageViews" shortView=true
                      [id]="datasourceId" [entityType]="'datasources'" [entity]="'Content Provider'"
                      (metricsResults)="metricsResults($event)" [(properties)] = properties>
            </metrics>
          </div>
        </div>
      </div>
    </div>

  </div>
  </div>
</div>