MaDgIK
/
explore-services
13
0
Fork 0
Code Issues Pull Requests Projects Releases 22 Wiki Activity

Add *.component.html files for components with big html template 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-portal/trunk@48974 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
argiro.kokogiannaki 2017-09-15 12:35:08 +00:00
parent 41c97cf410
commit 21ac2eba32
33 changed files with 1502 additions and 1535 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
portal-2/src/app/deposit/datasets/depositBySubjectResult.component.html Normal file
View File

@ -0,0 +1,79 @@
<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">
<div class="uk-article-title">
Deposit {{requestFor}}
</div>
<div class="uk-width-1-1 uk-margin uk-padding uk-panel uk-background-muted">
<form class= "uk-margin uk-text-center uk-margin-top">
<input type="text" [(ngModel)]="newSubject" class=" uk-input uk-width-1-2" name="subject" placeholder="Search for classifications..." />
<button class=" uk-button uk-button-default" type="submit" (click)="searchDataproviders()" >
Search
</button>
</form>
<div *ngIf="subject.length > 0" class=" uk-text-center ">
<span>Keywords: {{subject}}<span><a class="uk-icon-button" (click) = "subject = ''"><span aria-hidden="true" class=" clickable "><span class="clickable uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a></span>
</span>
</div>
</div>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div class="uk-grid helper-grid">
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand">
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING"
class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
</div>
<div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
<p>Please use the information/contacts shown below to deposit your {{requestFor}}.</p>
<!--showDataProviders [dataProviders]=dataProviders></showDataProviders-->
<div *ngIf="fetchDataproviders.searchUtils.totalResults" class="">
<paging-no-load [currentPage]="page" [totalResults]="fetchDataproviders.searchUtils.totalResults" size=10 (pageChange)="pageChange($event)"> </paging-no-load>
</div>
<div class="" *ngIf="fetchDataproviders.results && fetchDataproviders.searchUtils.totalResults > 0">
{{fetchDataproviders.searchUtils.totalResults}} content providers, page {{fetchDataproviders.searchUtils.page}} of {{(totalPages())}}
</div>
<search-result [(results)]="fetchDataproviders.results"
type="dataprovider" urlParam="datasourceId" [showSubjects]=true
[custom_class]="'other-results'">
</search-result>
</div>
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE && subject != ''" class = "uk-alert uk-alert-primary">
No content providers found with classification "{{subject}}".
</div>
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR && subject != ''" class = "uk-alert uk-alert-danger">
An error occured.
</div>
<div *ngIf="(fetchDataproviders.searchUtils.totalResults == 0 && fetchDataproviders.searchUtils.status == errorCodes.DONE)
|| fetchDataproviders.searchUtils.status == errorCodes.NONE || fetchDataproviders.searchUtils.status == errorCodes.ERROR" class = "uk-alert ">
You can still deposit your {{requestFor}} in
<a href="{{zenodo}}" target="_blank">OpenAIRE's Zenodo catch-all repository (<i class="custom-external"></i>)</a>
hosted by CERN.
</div>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<helper position="bottom"></helper>
<button class=" uk-button uk-button-default" type="submit" (click)="goToDeposit()">
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> Back
</button>
</div>
</div>
</div>
</div>

81
portal-2/src/app/deposit/datasets/depositBySubjectResult.component.ts
View File

@ -14,86 +14,7 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
@Component({
selector: 'deposit-by-subject-result',
template: `
<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">
<div class="uk-article-title">
Deposit {{requestFor}}
</div>
<div class="uk-width-1-1 uk-margin uk-padding uk-panel uk-background-muted">
<form class= "uk-margin uk-text-center uk-margin-top">
<input type="text" [(ngModel)]="newSubject" class=" uk-input uk-width-1-2" name="subject" placeholder="Search for classifications..." />
<button class=" uk-button uk-button-default" type="submit" (click)="searchDataproviders()" >
Search
</button>
</form>
<div *ngIf="subject.length > 0" class=" uk-text-center ">
<span>Keywords: {{subject}}<span><a class="uk-icon-button" (click) = "subject = ''"><span aria-hidden="true" class=" clickable "><span class="clickable uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a></span>
</span>
</div>
</div>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div class="uk-grid helper-grid">
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand">
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.LOADING"
class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
</div>
<div *ngIf="fetchDataproviders.searchUtils.totalResults > 0">
<p>Please use the information/contacts shown below to deposit your {{requestFor}}.</p>
<!--showDataProviders [dataProviders]=dataProviders></showDataProviders-->
<div *ngIf="fetchDataproviders.searchUtils.totalResults" class="">
<paging-no-load [currentPage]="page" [totalResults]="fetchDataproviders.searchUtils.totalResults" size=10 (pageChange)="pageChange($event)"> </paging-no-load>
</div>
<div class="" *ngIf="fetchDataproviders.results && fetchDataproviders.searchUtils.totalResults > 0">
{{fetchDataproviders.searchUtils.totalResults}} content providers, page {{fetchDataproviders.searchUtils.page}} of {{(totalPages())}}
</div>
<search-result [(results)]="fetchDataproviders.results"
type="dataprovider" urlParam="datasourceId" [showSubjects]=true
[custom_class]="'other-results'">
</search-result>
</div>
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.NONE && subject != ''" class = "uk-alert uk-alert-primary">
No content providers found with classification "{{subject}}".
</div>
<div *ngIf="fetchDataproviders.searchUtils.status == errorCodes.ERROR && subject != ''" class = "uk-alert uk-alert-danger">
An error occured.
</div>
<div *ngIf="(fetchDataproviders.searchUtils.totalResults == 0 && fetchDataproviders.searchUtils.status == errorCodes.DONE)
|| fetchDataproviders.searchUtils.status == errorCodes.NONE || fetchDataproviders.searchUtils.status == errorCodes.ERROR" class = "uk-alert ">
You can still deposit your {{requestFor}} in
<a href="{{zenodo}}" target="_blank">OpenAIRE's Zenodo catch-all repository (<i class="custom-external"></i>)</a>
hosted by CERN.
</div>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<helper position="bottom"></helper>
<button class=" uk-button uk-button-default" type="submit" (click)="goToDeposit()">
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-left" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="13 16 7 10 13 4"></polyline></svg></span> Back
</button>
</div>
</div>
</div>
</div>
`
templateUrl: 'depositBySubjectResult.component.html'
})
export class DepositBySubjectResultComponent {

56
portal-2/src/app/deposit/deposit.component.html Normal file
View File

@ -0,0 +1,56 @@
<div class="uk-margin-top">
<div class="uk-article-title">
Deposit {{requestFor}}
</div>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div class="uk-grid helper-grid">
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand">
<div>
<p>
<i>
Are you a grant recipient from the following: H2020; FP7 with SC39; or ERC?
</i>
Then you are required to publish in
<a href="{{openAccess}}" target="_blank">open access (<i class="custom-external"></i>)</a>.
One way to do this is to deposit your {{requestFor}} into an
<a href="{{openAccessRepo}}" target="_blank">open access repository (<i class="custom-external"></i>)</a>.
</p>
<p>
Click the following to find more information:
<a href="{{fp7Guidlines}}" target="_blank">FP7 guidelines (<i class="custom-external"></i>)</a>,
<a href="{{h2020Guidlines}}" target="_blank">H2020 guidelines (<i class="custom-external"></i>)</a>,
<a href="{{ercGuidlines}}" target="_blank">ERC guidelines (<i class="custom-external"></i>)</a> OR
<a href="{{helpdesk}}" target="_blank">ask a question (<i class="custom-external"></i>)</a> to OpenAIRE’s national representative.
</p>
</div>
<h3>Locate repository via your institution</h3>
<form class= "uk-grid">
<div class="uk-width-1-2 ">
<entities-autocomplete fieldId="organization" (click)="warningMessage = ''" [entityType]="'organization'" [depositType]=compatibility [selectedValue]=selectedId [showSelected]=true
[placeHolderMessage] = "'Search for Organizations'" [title] = "'Organizations'" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event)">
</entities-autocomplete>
</div>
<button class=" uk-button uk-button-default" type="submit" (click)="organizationSelected(selectedId)" >
Locate
</button>
<div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">{{warningMessage}}</div>
</form>
<div *ngIf="searchBySubjects" >
<deposit-by-subject></deposit-by-subject>
</div>
<div *ngIf="mapUrl">
<h3>Or locate repository in map</h3>
<div class="uk-margin-top">
<i-frame [url]="mapUrl" width="100%" height="900"></i-frame>
</div>
</div>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<helper position="bottom"></helper>
</div>

59
portal-2/src/app/deposit/deposit.component.ts
View File

@ -8,64 +8,7 @@ import {PiwikService} from '../utils/piwik/piwik.service';
@Component({
selector: 'deposit',
template: `
<div class="uk-margin-top">
<div class="uk-article-title">
Deposit {{requestFor}}
</div>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div class="uk-grid helper-grid">
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand">
<div>
<p>
<i>
Are you a grant recipient from the following: H2020; FP7 with SC39; or ERC?
</i>
Then you are required to publish in
<a href="{{openAccess}}" target="_blank">open access (<i class="custom-external"></i>)</a>.
One way to do this is to deposit your {{requestFor}} into an
<a href="{{openAccessRepo}}" target="_blank">open access repository (<i class="custom-external"></i>)</a>.
</p>
<p>
Click the following to find more information:
<a href="{{fp7Guidlines}}" target="_blank">FP7 guidelines (<i class="custom-external"></i>)</a>,
<a href="{{h2020Guidlines}}" target="_blank">H2020 guidelines (<i class="custom-external"></i>)</a>,
<a href="{{ercGuidlines}}" target="_blank">ERC guidelines (<i class="custom-external"></i>)</a> OR
<a href="{{helpdesk}}" target="_blank">ask a question (<i class="custom-external"></i>)</a> to OpenAIRE’s national representative.
</p>
</div>
<h3>Locate repository via your institution</h3>
<form class= "uk-grid">
<div class="uk-width-1-2 ">
<entities-autocomplete fieldId="organization" (click)="warningMessage = ''" [entityType]="'organization'" [depositType]=compatibility [selectedValue]=selectedId [showSelected]=true
[placeHolderMessage] = "'Search for Organizations'" [title] = "'Organizations'" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event)">
</entities-autocomplete>
</div>
<button class=" uk-button uk-button-default" type="submit" (click)="organizationSelected(selectedId)" >
Locate
</button>
<div *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">{{warningMessage}}</div>
</form>
<div *ngIf="searchBySubjects" >
<deposit-by-subject [compatibility]=compatibility [requestFor]=requestFor ></deposit-by-subject>
</div>
<div *ngIf="mapUrl">
<h3>Or locate repository in map</h3>
<div class="uk-margin-top">
<i-frame [url]="mapUrl" width="100%" height="900"></i-frame>
</div>
</div>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<helper position="bottom"></helper>
</div>
`
templateUrl: 'deposit.component.html'
})
export class DepositComponent {

65
portal-2/src/app/home/home.component.html Normal file
View File

@ -0,0 +1,65 @@
<div class="image-front-topbar uk-section-secondary uk-position-relative" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-fade&quot;,&quot;delay&quot;:false}" tm-header-transparent="light">
<div style="" class="mainPageSearchForm uk-background-norepeat uk-background-cover uk-background-fixed uk-section uk-padding-remove-bottom uk-flex uk-flex-middle" uk-height-viewport="offset-top: true;offset-bottom: ! +">
<div class="uk-position-cover"></div>
<div class="uk-width-1-1">
<div class="uk-position-relative">
<div class="uk-container uk-margin-medium">
<div class="tm-header-placeholder uk-margin-medium" style="height: 84px;"></div>
<div class="search_box_bg uk-grid-large uk-flex-middle uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div data-id="page#4">
<search-form placeholderText="Search in OpenAIRE information space" link=true></search-form>
</div>
</div>
</div>
</div>
<div class="uk-container uk-container-large uk-margin-medium">
<div class="search_box_bg uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div class="search_box_bg uk-margin-large uk-margin-remove-bottom uk-text-center uk-grid-match uk-child-width-1-2 uk-child-width-1-2@s uk-child-width-1-4@m uk-child-width-1-4@l uk-child-width-1-4@xl uk-grid-collapse uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" uk-grid="" data-id="page#7" style="">
<div *ngIf="publicationsSize" class="uk-first-column">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{publicationsSize.number}} {{publicationsSize.size}} publications</span>
</h2>
</div>
</div>
<div *ngIf="datasetsSize">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{datasetsSize.number}} {{datasetsSize.size}} research data</span>
</h2>
</div>
</div>
<div *ngIf="datasourcesSize" >
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{datasourcesSize.number}} {{datasourcesSize.size}} data sources</span>
</h2>
</div>
</div>
<div *ngIf="fundersSize">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{fundersSize.number}} {{fundersSize.size}} funders</span>
</h2>
</div>
</div>
</div>
<div class="uk-margin-large uk-margin-remove-bottom uk-text-center uk-text-meta uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" data-id="page#8" style="">
<span style="color:#fff!important; font-size:30pt!important">all linked together</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-main uk-container" style="min-height:200px">
<helper position="bottom"></helper>
</div>

68
portal-2/src/app/home/home.component.ts
View File

@ -20,73 +20,7 @@ import {PiwikService} from '../utils/piwik/piwik.service';
@Component({
selector: 'home',
template: `
<div class="image-front-topbar uk-section-secondary uk-position-relative" uk-scrollspy="{&quot;target&quot;:&quot;[uk-scrollspy-class]&quot;,&quot;cls&quot;:&quot;uk-animation-fade&quot;,&quot;delay&quot;:false}" tm-header-transparent="light">
<div style="" class="mainPageSearchForm uk-background-norepeat uk-background-cover uk-background-fixed uk-section uk-padding-remove-bottom uk-flex uk-flex-middle" uk-height-viewport="offset-top: true;offset-bottom: ! +">
<div class="uk-position-cover"></div>
<div class="uk-width-1-1">
<div class="uk-position-relative">
<div class="uk-container uk-margin-medium">
<div class="tm-header-placeholder uk-margin-medium" style="height: 84px;"></div>
<div class="search_box_bg uk-grid-large uk-flex-middle uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div data-id="page#4">
<search-form placeholderText="Search in OpenAIRE information space" link=true></search-form>
</div>
</div>
</div>
</div>
<div class="uk-container uk-container-large uk-margin-medium">
<div class="search_box_bg uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div class="search_box_bg uk-margin-large uk-margin-remove-bottom uk-text-center uk-grid-match uk-child-width-1-2 uk-child-width-1-2@s uk-child-width-1-4@m uk-child-width-1-4@l uk-child-width-1-4@xl uk-grid-collapse uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" uk-grid="" data-id="page#7" style="">
<div *ngIf="publicationsSize" class="uk-first-column">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{publicationsSize.number}} {{publicationsSize.size}} publications</span>
</h2>
</div>
</div>
<div *ngIf="datasetsSize">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{datasetsSize.number}} {{datasetsSize.size}} research data</span>
</h2>
</div>
</div>
<div *ngIf="datasourcesSize" >
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{datasourcesSize.number}} {{datasourcesSize.size}} data sources</span>
</h2>
</div>
</div>
<div *ngIf="fundersSize">
<div uk-scrollspy-class="" class="uk-width-medium uk-margin-auto el-item uk-panel uk-scrollspy-inview uk-animation-fade" style="">
<h2 class="el-title uk-margin uk-h2">
<span>{{fundersSize.number}} {{fundersSize.size}} funders</span>
</h2>
</div>
</div>
</div>
<div class="uk-margin-large uk-margin-remove-bottom uk-text-center uk-text-meta uk-scrollspy-inview uk-animation-fade" uk-scrollspy-class="" data-id="page#8" style="">
<span style="color:#fff!important; font-size:30pt!important">all linked together</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-main uk-container" style="min-height:200px">
<helper position="bottom"></helper>
</div>
`
templateUrl: 'home.component.html',
})
export class HomeComponent {
public piwiksub: any;

54
portal-2/src/app/login/user.component.html Normal file
View File

@ -0,0 +1,54 @@
<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 *ngIf="!server" class="uk-margin-top uk-container uk-container-small uk-position-relative">
<!--form *ngIf="!loggedIn" class=" ">
<h3>Welcome to OpenAIRE's Discover Portal</h3>
<p>This service uses the same ldap sign-in as the OpenAIRE services so you can use the same
credentials.</p>
<p>Login in. To see it in action.</p>
<div class="uk-margin">
<input class="uk-input uk-form-width-medium" placeholder="Username" type="text" name="username" [(ngModel)]="username">
</div>
<div class="uk-margin">
<input placeholder="Password" class="uk-input uk-form-width-medium" type="password" name="password" [(ngModel)]="password">
</div>
<div class="uk-margin">
<button (click)="login()" class=" uk-button uk-button-primary">Login</button>
</div>
</form-->
<div *ngIf="errorCode == '1'" class="uk-alert uk-alert-warning">
The requested page requires authentication. Please sign in.
<span *ngIf="!loggedIn">
<a class="loginLink" [href]="loginUrl" >Sign in</a>
</span>
</div>
<div *ngIf="errorCode == '2'" class="uk-alert uk-alert-warning">
You are not authorized to use the requested page
</div>
<div *ngIf="errorCode == '3'" class="uk-alert uk-alert-warning">
The session has expired. Please sign in again or continue <a (click)="redirect();">browsing as a guest</a>.
<span *ngIf="!loggedIn">
<a class="loginLink" [href]="loginUrl" >Sign in</a>
</span>
</div>
<div *ngIf="!loggedIn && errorMessage.length > 0" class="uk-alert uk-alert-danger">{{errorMessage}}</div>
<div *ngIf="loggedIn">
<div class="uk-alert uk-alert-success">
Hello {{user.fullname}}!
</div>
<button (click)="logout()" class=" uk-button uk-button-default">Log out</button>
</div>
</div>
</div>
</div>
</div>

58
portal-2/src/app/login/user.component.ts
View File

@ -10,62 +10,8 @@ import {OpenaireProperties} from '../utils/properties/openaireProperties';
@Component({
selector: 'user',
template: `
<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 *ngIf="!server" class="uk-margin-top uk-container uk-container-small uk-position-relative">
<!--form *ngIf="!loggedIn" class=" ">
<h3>Welcome to OpenAIRE's Discover Portal</h3>
<p>This service uses the same ldap sign-in as the OpenAIRE services so you can use the same
credentials.</p>
<p>Login in. To see it in action.</p>
<div class="uk-margin">
<input class="uk-input uk-form-width-medium" placeholder="Username" type="text" name="username" [(ngModel)]="username">
</div>
<div class="uk-margin">
<input placeholder="Password" class="uk-input uk-form-width-medium" type="password" name="password" [(ngModel)]="password">
</div>
<div class="uk-margin">
<button (click)="login()" class=" uk-button uk-button-primary">Login</button>
</div>
</form-->
<div *ngIf="errorCode == '1'" class="uk-alert uk-alert-warning">
The requested page requires authentication. Please sign in.
<span *ngIf="!loggedIn">
<a class="loginLink" [href]="loginUrl" >Sign in</a>
</span>
</div>
<div *ngIf="errorCode == '2'" class="uk-alert uk-alert-warning">
You are not authorized to use the requested page
</div>
<div *ngIf="errorCode == '3'" class="uk-alert uk-alert-warning">
The session has expired. Please sign in again or continue <a (click)="redirect();">browsing as a guest</a>.
<span *ngIf="!loggedIn">
<a class="loginLink" [href]="loginUrl" >Sign in</a>
</span>
</div>
<div *ngIf="!loggedIn && errorMessage.length > 0" class="uk-alert uk-alert-danger">{{errorMessage}}</div>
<div *ngIf="loggedIn">
<div class="uk-alert uk-alert-success">
Hello {{user.fullname}}!
</div>
<button (click)="logout()" class=" uk-button uk-button-default">Log out</button>
</div>
</div>
</div>
</div>
</div>
`
})
templateUrl: 'user.component.html'
})
export class UserComponent {
public user: User;

1
portal-2/src/app/reload/reload.component.ts
View File

@ -14,7 +14,6 @@ import {Session} from '../login/utils/helper.class';
<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 publication">
Go to initial page....
</div>

208
portal-2/src/app/searchPages/find/search.component.html Normal file
View File

@ -0,0 +1,208 @@
<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="">
<div class="uk-width-1-1 ">
<div class="uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle generalSearchForm">
<div class="uk-width-1-1">
<search-form [(keyword)]=keyword (keywordChange)="keywordChanged($event)" placeholderText="Search for research results, projects, content providers, organizations in OpenAIRE information space"></search-form>
</div>
</div>
</div>
<div class=" uk-margin-small-top uk-container">
<div class="uk-grid uk-margin-top">
<ul class=" uk-tab uk-tab-left uk-width-1-5 uk-visible@m" uk-tab="animation: uk-animation-fade">
<li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
<a>
Publications
<span [class]="(fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
<a>
Research Data
<span [class]="(fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
<a>
Projects
<span [class]="(fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
<a>
Content Providers
<span [class]="(fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
<a>
Organizations
<span [class]="(fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
</a>
</li>
</ul>
<div class="uk-hidden@m uk-clearfix uk-width-1-1 uk-margin-bottom">
<button class="uk-button uk-button-default uk-hidden@m " type="button">
<span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
</button>
<ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #searchtabs; animation: uk-animation-fade" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
<li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
<a>
Publications
<span *ngIf = "fetchPublications.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification">{{((keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
<a>
Research Data
<span *ngIf = "fetchDatasets.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
<a>
Projects
<span *ngIf = "fetchProjects.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
<a>
Content Providers
<span *ngIf = "fetchDataproviders.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
<a>
Organizations
<span *ngIf = "fetchOrganizations.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
</a>
</li>
</ul>
</div>
<!--ul id="searchtabs" class="uk-switcher uk-width-1-1 uk-margin-top custom-tab-content-large">
<li-->
<div class="uk-width-expand custom-tab-content-large">
<div *ngIf = "activeTab=='publications'">
<div *ngIf = "keyword.length > 0 && activeTab=='publications'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchPublications"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
View all {{fetchPublications.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchPublications.results"
[(status)]= "fetchPublications.searchUtils.status" showLoading = true
type="publication" urlParam="articleId">
</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-->
</div>
<div *ngIf = "activeTab=='research data'" >
<div *ngIf = "keyword.length > 0 && activeTab=='research data'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchDatasets"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchDatasets" class="uk-button uk-button-text">
View all {{fetchDatasets.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchDatasets.results"
[(status)]= "fetchDatasets.searchUtils.status" showLoading = true
type="dataset" urlParam="datasetId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0 && activeTab=='research data'" class ="uk-animation-fade">
<browse-entities entityName="dataset" baseUrl="/search/find/datasets" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>
</div>
<!--/li>
<li-->
</div>
<div *ngIf = "activeTab=='projects'">
<div *ngIf = "keyword.length > 0 && activeTab=='projects'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchProjects"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchProjects" class="uk-button uk-button-text">
View all {{fetchProjects.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchProjects.results"
[(status)]= "fetchProjects.searchUtils.status" showLoading = true
type="project" urlParam="projectId">
</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-->
</div>
<div *ngIf = "activeTab=='content providers'">
<div *ngIf = "keyword.length > 0 && activeTab=='content providers'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchDataproviders"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
View all {{fetchDataproviders.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchDataproviders.results"
[(status)]= "fetchDataproviders.searchUtils.status" showLoading = true
type="dataprovider" urlParam="datasourceId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0 && activeTab=='content providers'" class ="uk-animation-fade" >
<browse-entities entityName="dataprovider" baseUrl="/search/find/dataproviders" [refineFields]=searchFields.DATASOURCE_REFINE_FIELDS></browse-entities>
</div>
<!--/li>
<li-->
</div>
<div *ngIf = "activeTab=='organizations'">
<div *ngIf = "keyword.length > 0" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchOrganizations.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchOrganizations"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchOrganizations" class="uk-button uk-button-text">
View all {{fetchOrganizations.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchOrganizations.results"
[(status)]= "fetchOrganizations.searchUtils.status" showLoading = true
type="organization" urlParam="organizationId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0" class ="uk-animation-fade">
<browse-entities entityName="organization" baseUrl="/search/find/organizations" [refineFields]=searchFields.ORGANIZATION_REFINE_FIELDS></browse-entities>
</div>
</div>
</div>
</div>
<!--/li>
</ul-->
</div>
</div>
</div>
</div>

211
portal-2/src/app/searchPages/find/search.component.ts
View File

@ -28,216 +28,7 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
changeDetection: ChangeDetectionStrategy.Default,
encapsulation: ViewEncapsulation.Emulated,
selector: 'search-find',
template: `
<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="">
<div class="uk-width-1-1 ">
<div class="uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle generalSearchForm">
<div class="uk-width-1-1">
<search-form [(keyword)]=keyword (keywordChange)="keywordChanged($event)" placeholderText="Search for research results, projects, content providers, organizations in OpenAIRE information space"></search-form>
</div>
</div>
</div>
<div class=" uk-margin-small-top uk-container">
<div class="uk-grid uk-margin-top">
<ul class=" uk-tab uk-tab-left uk-width-1-5 uk-visible@m" uk-tab="animation: uk-animation-fade">
<li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
<a>
Publications
<span [class]="(fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
<a>
Research Data
<span [class]="(fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
<a>
Projects
<span [class]="(fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
<a>
Content Providers
<span [class]="(fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
<a>
Organizations
<span [class]="(fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)?'uk-badge uk-badge-notification':''"> {{((fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
</a>
</li>
</ul>
<div class="uk-hidden@m uk-clearfix uk-width-1-1 uk-margin-bottom">
<button class="uk-button uk-button-default uk-hidden@m " type="button">
<span uk-navbar-toggle-icon></span> <span class="uk-margin-small-left">{{activeTab}}</span>
</button>
<ul id="toggle-small-tabs" class="uk-subnav uk-subnav-pill uk-dropdown uk-hidden@m" uk-switcher="connect: #searchtabs; animation: uk-animation-fade" uk-dropdown="mode: click" uk-toggle="target: #toggle-small-tabs">
<li (click)="searchPublications()" [class]="activeTab == 'publications'?'uk-active':''">
<a>
Publications
<span *ngIf = "fetchPublications.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchPublications.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification">{{((keyword.length > 0)? fetchPublications.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDatasets()" [class]="activeTab == 'research data'?'uk-active':''">
<a>
Research Data
<span *ngIf = "fetchDatasets.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchDatasets.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDatasets.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchProjects()" [class]="activeTab == 'projects'?'uk-active':''">
<a>
Projects
<span *ngIf = "fetchProjects.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchProjects.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchProjects.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchDataProviders()" [class]="activeTab == 'content providers'?'uk-active':''">
<a>
Content Providers
<span *ngIf = "fetchDataproviders.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchDataproviders.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchDataproviders.searchUtils.totalResults :'')}}</span>
</a>
</li>
<li (click)="searchOrganizations()" [class]="activeTab == 'organizations'?'uk-active':''">
<a>
Organizations
<span *ngIf = "fetchOrganizations.searchUtils.status == errorCodes.LOADING && keyword.length > 0" class="uk-icon-spinner uk-icon-spin"></span>
<span *ngIf = "fetchOrganizations.searchUtils.status != errorCodes.LOADING && keyword.length > 0" class="uk-badge uk-badge-notification"> {{((keyword.length > 0)? fetchOrganizations.searchUtils.totalResults :'')}}</span>
</a>
</li>
</ul>
</div>
<!--ul id="searchtabs" class="uk-switcher uk-width-1-1 uk-margin-top custom-tab-content-large">
<li-->
<div class="uk-width-expand custom-tab-content-large">
<div *ngIf = "activeTab=='publications'">
<div *ngIf = "keyword.length > 0 && activeTab=='publications'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchPublications.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchPublications"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchPublications" class="uk-button uk-button-text">
View all {{fetchPublications.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchPublications.results"
[(status)]= "fetchPublications.searchUtils.status" showLoading = true
type="publication" urlParam="articleId">
</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-->
</div>
<div *ngIf = "activeTab=='research data'" >
<div *ngIf = "keyword.length > 0 && activeTab=='research data'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchDatasets.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchDatasets"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchDatasets" class="uk-button uk-button-text">
View all {{fetchDatasets.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchDatasets.results"
[(status)]= "fetchDatasets.searchUtils.status" showLoading = true
type="dataset" urlParam="datasetId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0 && activeTab=='research data'" class ="uk-animation-fade">
<browse-entities entityName="dataset" baseUrl="/search/find/datasets" [refineFields]=searchFields.RESULT_REFINE_FIELDS></browse-entities>
</div>
<!--/li>
<li-->
</div>
<div *ngIf = "activeTab=='projects'">
<div *ngIf = "keyword.length > 0 && activeTab=='projects'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchProjects.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchProjects"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchProjects" class="uk-button uk-button-text">
View all {{fetchProjects.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchProjects.results"
[(status)]= "fetchProjects.searchUtils.status" showLoading = true
type="project" urlParam="projectId">
</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-->
</div>
<div *ngIf = "activeTab=='content providers'">
<div *ngIf = "keyword.length > 0 && activeTab=='content providers'" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchDataproviders.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchDataproviders"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchDataproviders" class="uk-button uk-button-text">
View all {{fetchDataproviders.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchDataproviders.results"
[(status)]= "fetchDataproviders.searchUtils.status" showLoading = true
type="dataprovider" urlParam="datasourceId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0 && activeTab=='content providers'" class ="uk-animation-fade" >
<browse-entities entityName="dataprovider" baseUrl="/search/find/dataproviders" [refineFields]=searchFields.DATASOURCE_REFINE_FIELDS></browse-entities>
</div>
<!--/li>
<li-->
</div>
<div *ngIf = "activeTab=='organizations'">
<div *ngIf = "keyword.length > 0" class ="uk-animation-fade">
<div class = "uk-text-right" *ngIf = "fetchOrganizations.searchUtils.totalResults> 10">
<!--a [href] = "linkToSearchOrganizations"-->
<a [queryParams]="routerHelper.createQueryParam('keyword', keyword)"
routerLinkActive="router-link-active" [routerLink]="linkToSearchOrganizations" class="uk-button uk-button-text">
View all {{fetchOrganizations.searchUtils.totalResults}} results
</a>
</div>
<search-result [(results)]="fetchOrganizations.results"
[(status)]= "fetchOrganizations.searchUtils.status" showLoading = true
type="organization" urlParam="organizationId">
</search-result>
</div>
<div *ngIf = "keyword.length == 0" class ="uk-animation-fade">
<browse-entities entityName="organization" baseUrl="/search/find/organizations" [refineFields]=searchFields.ORGANIZATION_REFINE_FIELDS></browse-entities>
</div>
</div>
</div>
</div>
<!--/li>
</ul-->
</div>
</div>
</div>
</div>
`
templateUrl: 'search.component.html'
})
export class SearchComponent {
public sub: any; piwiksub: any;

56
portal-2/src/app/searchPages/searchUtils/advancedSearchForm.component.html Normal file
View File

@ -0,0 +1,56 @@
<form [class]="(isDisabled )?'uk-disabled advancedSearchForm uk-tile uk-tile-muted':'advancedSearchForm uk-tile uk-tile-muted'">
<table class=" uk-table uk-table-responsive" >
<tr *ngFor="let selectedField of selectedFields; let i = index" class="-row ">
<td *ngIf ="i==0 " class="">Search for:</td>
<td *ngIf = "i != 0" class=""><select [(ngModel)]="selectedField.operatorId" name="selectOp_{{i}}" >
<option *ngFor="let op of operators" (change)="fieldOperatorChanged(i, op.id, op.id)" (click)="fieldOperatorChanged(i, op.id, op.id)" [value]="op.id">{{op.id}}</option>
</select></td>
<td ><select [(ngModel)]="selectedField.id" name="selectField_{{i}}" (ngModelChange)="fieldIdsChanged(i,selectedField.id)" ><!--(click)="fieldIdsChanged(i)" -->
<option *ngFor="let id of fieldIds" [value]="id" >{{fieldIdsMap[id].name}} </option>
</select> </td>
<td *ngIf = "selectedField.type == 'keyword'" ><input type="text" class="form-control" placeholder="Type keywords..."
[(ngModel)]="selectedField.value" name="value[{{i}}]"></td>
<td *ngIf = "selectedField.type == 'date'" >
<date-filter [(dateValue)]=selectedField.dateValue ></date-filter>
</td>
<td *ngIf = " selectedField.id && selectedField.type == 'vocabulary'" >
<static-autocomplete *ngIf = " selectedField.id" [(vocabularyId)] = selectedField.param [fieldId]=selectedField.id
[(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [selectedValue]=selectedField.value [showSelected]=true
[placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
</td>
<td *ngIf = " selectedField.id && selectedField.type == 'refine'" >
<static-autocomplete [(list)] = this.fieldList[selectedField.id] [fieldId]=selectedField.id [entityName] = "entityType" [fieldName] = [selectedField.id] [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete></td>
<td *ngIf = "selectedField.type == 'entity'" ><entities-autocomplete [fieldId]=selectedField.id [entityType]=selectedField.param [selectedValue]=selectedField.value [showSelected]=true
[placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)" >
</entities-autocomplete></td>
<td *ngIf = "selectedField.type == 'boolean'" class="input-group" >
<span class="input-group-addon">
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="true">Yes<br>
</span>
<span class="input-group-addon">
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="false">No<br>
</span>
</td>
<td class=" " >
<span *ngIf="selectedFields.length > 1" type="button" class="uk-icon-button" (click)="removeField(i)">
<span class=""><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
</span>
<span *ngIf="selectedFields.length == 1" type="button" class="uk-icon-button" disabled>
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
</span>
</td>
<td *ngIf="i == selectedFields.length-1 " class=" "><span type="button" class="uk-icon-button" (click)="addField()">
<span><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span>
</span></td>
</tr>
</table>
<div class="-row uk-text-right">
<button (click)="queryChanged()" type="submit" class="uk-button uk-button-primary">Search</button>
</div>
</form>

59
portal-2/src/app/searchPages/searchUtils/advancedSearchForm.component.ts
View File

@ -8,64 +8,7 @@ import {Dates} from '../../utils/string-utils.class';
@Component({
selector: 'advanced-search-form',
template: `
<form [class]="(isDisabled )?'uk-disabled advancedSearchForm uk-tile uk-tile-muted':'advancedSearchForm uk-tile uk-tile-muted'">
<table class=" uk-table uk-table-responsive" >
<tr *ngFor="let selectedField of selectedFields; let i = index" class="-row ">
<td *ngIf ="i==0 " class="">Search for:</td>
<td *ngIf = "i != 0" class=""><select [(ngModel)]="selectedField.operatorId" name="selectOp_{{i}}" >
<option *ngFor="let op of operators" (change)="fieldOperatorChanged(i, op.id, op.id)" (click)="fieldOperatorChanged(i, op.id, op.id)" [value]="op.id">{{op.id}}</option>
</select></td>
<td ><select [(ngModel)]="selectedField.id" name="selectField_{{i}}" (ngModelChange)="fieldIdsChanged(i,selectedField.id)" ><!--(click)="fieldIdsChanged(i)" -->
<option *ngFor="let id of fieldIds" [value]="id" >{{fieldIdsMap[id].name}} </option>
</select> </td>
<td *ngIf = "selectedField.type == 'keyword'" ><input type="text" class="form-control" placeholder="Type keywords..."
[(ngModel)]="selectedField.value" name="value[{{i}}]"></td>
<td *ngIf = "selectedField.type == 'date'" >
<date-filter [(dateValue)]=selectedField.dateValue ></date-filter>
</td>
<td *ngIf = " selectedField.id && selectedField.type == 'vocabulary'" >
<static-autocomplete *ngIf = " selectedField.id" [(vocabularyId)] = selectedField.param [fieldId]=selectedField.id
[(list)] = this.fieldList[selectedField.id] [entityName] = "entityType" [selectedValue]=selectedField.value [showSelected]=true
[placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete>
</td>
<td *ngIf = " selectedField.id && selectedField.type == 'refine'" >
<static-autocomplete [(list)] = this.fieldList[selectedField.id] [fieldId]=selectedField.id [entityName] = "entityType" [fieldName] = [selectedField.id] [selectedValue]=selectedField.value [showSelected]=true [placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false (selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)"></static-autocomplete></td>
<td *ngIf = "selectedField.type == 'entity'" ><entities-autocomplete [fieldId]=selectedField.id [entityType]=selectedField.param [selectedValue]=selectedField.value [showSelected]=true
[placeHolderMessage] = "'Search for '+selectedField.name" [title] = "selectedField.name" [multipleSelections]=false
(selectedValueChanged)="valueChanged($event,i)" (listUpdated) = "listUpdated($event,selectedField.id)" >
</entities-autocomplete></td>
<td *ngIf = "selectedField.type == 'boolean'" class="input-group" >
<span class="input-group-addon">
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="true">Yes<br>
</span>
<span class="input-group-addon">
<input type="radio" [(ngModel)]="selectedField.value" [name]=selectedField.param value="false">No<br>
</span>
</td>
<td class=" " >
<span *ngIf="selectedFields.length > 1" type="button" class="uk-icon-button" (click)="removeField(i)">
<span class=""><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
</span>
<span *ngIf="selectedFields.length == 1" type="button" class="uk-icon-button" disabled>
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="minus" ratio="1"><rect height="1" width="18" y="9" x="1"></rect></svg></span>
</span>
</td>
<td *ngIf="i == selectedFields.length-1 " class=" "><span type="button" class="uk-icon-button" (click)="addField()">
<span><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="plus" ratio="1"><rect x="9" y="1" width="1" height="17"></rect><rect x="1" y="9" width="17" height="1"></rect></svg></span>
</span></td>
</tr>
</table>
<div class="-row uk-text-right">
<button (click)="queryChanged()" type="submit" class="uk-button uk-button-primary">Search</button>
</div>
</form>
`
templateUrl: 'advancedSearchForm.component.html'
})
export class AdvancedSearchFormComponent {
@Input() entityType;

49
portal-2/src/app/searchPages/searchUtils/advancedSearchPage.component.html Normal file
View File

@ -0,0 +1,49 @@
<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">
<div class="uk-article-title">
{{pageTitle}}
</div>
<div>
<a *ngIf = "simpleSearchLink && simpleSearchLink.length > 0" routerLinkActive="router-link-active" [routerLink]=simpleSearchLink [class]="(disableForms)?'uk-float-right uk-disabled uk-link-muted':'uk-float-right'" >Simple search <span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
</span></a>
<advanced-search-form
[entityType] = "entityType"
[(fieldIds)]="fieldIds"
[(fieldIdsMap)]="fieldIdsMap"
[(selectedFields)]="selectedFields"
(queryChange)="queryChanged($event)"
[isDisabled]="disableForms">
</advanced-search-form>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "searchUtils.baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" ></search-download>
<div class="uk-width-1-1 uk-grid helper-grid" >
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand uk-padding-remove-left">
<search-result [results]="results"
[status]=searchUtils.status
[type]="entityType" [urlParam]="urlParam"
[showLoading]="true">
</search-result>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<div class="uk-width-1-1">
<helper position="bottom"></helper>
</div>
</div>
</div>
<!--modal-loading [message]= "'Loading results...'"></modal-loading-->
</div>
</div>
</div>

52
portal-2/src/app/searchPages/searchUtils/advancedSearchPage.component.ts
View File

@ -14,57 +14,7 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
@Component({
selector: 'advanced-search-page',
template: `
<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">
<div class="uk-article-title">
{{pageTitle}}
</div>
<div>
<a *ngIf = "simpleSearchLink && simpleSearchLink.length > 0" routerLinkActive="router-link-active" [routerLink]=simpleSearchLink [class]="(disableForms)?'uk-float-right uk-disabled uk-link-muted':'uk-float-right'" >Simple search <span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
</span></a>
<advanced-search-form
[entityType] = "entityType"
[(fieldIds)]="fieldIds"
[(fieldIdsMap)]="fieldIdsMap"
[(selectedFields)]="selectedFields"
(queryChange)="queryChanged($event)"
[isDisabled]="disableForms">
</advanced-search-form>
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "searchUtils.baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" ></search-download>
<div class="uk-width-1-1 uk-grid helper-grid" >
<helper position="left" styleName=" uk-width-1-5 uk-padding-left"></helper>
<div class="uk-width-expand uk-padding-remove-left">
<search-result [results]="results"
[status]=searchUtils.status
[type]="entityType" [urlParam]="urlParam"
[showLoading]="true">
</search-result>
</div>
<helper position="right" styleName=" uk-width-1-5"></helper>
</div>
<div class="uk-width-1-1">
<helper position="bottom"></helper>
</div>
</div>
</div>
<!--modal-loading [message]= "'Loading results...'"></modal-loading-->
</div>
</div>
</div>
`
templateUrl: 'advancedSearchPage.component.html'
})
export class AdvancedSearchPageComponent {
@Input() pageTitle = "";

50
portal-2/src/app/searchPages/searchUtils/browseStatistic.component.html Normal file
View File

@ -0,0 +1,50 @@
<span class="uk-h6">{{filter.title}}</span>
<div *ngIf="filter.values.length == 0" class="uk-alert uk-alert-primary" role="alert">No {{filter.title}} statistics found</div>
<ul *ngIf="filter.values.length > 0 && !viewAll" class="uk-list browseFilters">
<li *ngFor= "let value of filter.values.slice(0,5)" class= " uk-margin-remove-top"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = " filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
<li *ngIf= " filter.values.length > 5 " class= " uk-margin-remove-top">
<a href="#modal-{{filter.filterId}}" uk-toggle><span class="uk-text-muted">View more </span><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a>
<!--
uk-toggle="target: modal-"
uk-toggle='{"target": modal-}'>
uk-toggle target="modal-"
-->
<!--span uk-toggle='{"target": modal-}'><span class="uk-text-muted clickable">View more </span><a><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a></span-->
</li>
</ul>
<ul *ngIf="filter.values.length > 0 && viewAll" class="uk-list uk-list-divider browseFilters">
<li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = " filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
<li *ngIf= " filter.values.length > 5 && viewAll " (click)="viewAll=false;">
<span ><span class="uk-text-muted clickable">View less </span><a><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-up" ratio="1"><polygon points="5 13 10 8 15 13"></polygon></svg></span></a></span>
</li>
</ul>
<!-- This is the modal -->
<div id="modal-{{filter.filterId}}" uk-modal>
<div class="uk-modal-dialog uk-modal-body">
<button class="uk-modal-close-default" type="button" uk-close></button>
<h4 class="tm-article-subtitle">{{filter.title}}</h4>
<ul *ngIf="filter.values.length > 0" class="uk-list uk-list-line browseFilters">
<li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = "uk-modal-close filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
</ul>
</div>
</div>

56
portal-2/src/app/searchPages/searchUtils/browseStatistic.component.ts
View File

@ -12,61 +12,7 @@ import {SearchUtilsClass} from '../searchUtils/searchUtils.class';
import {RouterHelper} from '../../utils/routerHelper.class';
@Component({
selector: 'browse-statistic',
template: `
<span class="uk-h6">{{filter.title}}</span>
<div *ngIf="filter.values.length == 0" class="uk-alert uk-alert-primary" role="alert">No {{filter.title}} statistics found</div>
<ul *ngIf="filter.values.length > 0 && !viewAll" class="uk-list browseFilters">
<li *ngFor= "let value of filter.values.slice(0,5)" class= " uk-margin-remove-top"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = " filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
<li *ngIf= " filter.values.length > 5 " class= " uk-margin-remove-top">
<a href="#modal-{{filter.filterId}}" uk-toggle><span class="uk-text-muted">View more </span><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a>
<!--
uk-toggle="target: modal-"
uk-toggle='{"target": modal-}'>
uk-toggle target="modal-"
-->
<!--span uk-toggle='{"target": modal-}'><span class="uk-text-muted clickable">View more </span><a><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a></span-->
</li>
</ul>
<ul *ngIf="filter.values.length > 0 && viewAll" class="uk-list uk-list-divider browseFilters">
<li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = " filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
<li *ngIf= " filter.values.length > 5 && viewAll " (click)="viewAll=false;">
<span ><span class="uk-text-muted clickable">View less </span><a><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-up" ratio="1"><polygon points="5 13 10 8 15 13"></polygon></svg></span></a></span>
</li>
</ul>
<!-- This is the modal -->
<div id="modal-{{filter.filterId}}" uk-modal>
<div class="uk-modal-dialog uk-modal-body">
<button class="uk-modal-close-default" type="button" uk-close></button>
<h4 class="tm-article-subtitle">{{filter.title}}</h4>
<ul *ngIf="filter.values.length > 0" class="uk-list uk-list-line browseFilters">
<li *ngFor= "let value of filter.values"><!--a [href]="baseUrl+'?'+filter.filterId+'='+value.id">{{_formatName(value)}} ({{value.number}})</a-->
<a class = "uk-modal-close filterItem" [queryParams]="routerHelper.createQueryParam(filter.filterId,quote(value.id))" routerLinkActive="router-link-active" [routerLink]=baseUrl>
<span class="filterName"><div title = "{{value.name}}">{{_formatName(value)}} </div></span> <span class="filterNumber" > ({{value.number}})</span></a>
</li>
</ul>
</div>
</div>
`
templateUrl: 'browseStatistic.component.html'
})
export class BrowseStatisticComponent {

67
portal-2/src/app/searchPages/searchUtils/searchFilter.component.html Normal file
View File

@ -0,0 +1,67 @@
<ul *ngIf= "filter.values.length >0" class="uk-list">
<li class="uk-open">
<h5 class="uk-margin-bottom-remove">{{_formatTitle(filter.title,filter.values.length)}}
</h5>
<div aria-expanded="false">
<div class="searchFilterBoxValues ">
<div *ngFor = "let value of getSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}">
<input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<!--div class="uk-grid-divider uk-margin-remove"></div-->
<hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
<div *ngFor = "let value of getNotSelectedValues(filter).slice(0,(!addShowMore?getNotSelectedValues(filter).length:5-getSelectedValues(filter).length))" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<!--a *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="toggle()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">Show More</a-->
<!--button *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5"
class="uk-button uk-button-link" (click)="toggle()" [disabled]="isDisabled">
Show More
</button-->
<a *ngIf=" addShowMore && (getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="open()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">View more<span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a>
<div *ngIf="addShowMore" [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" uk-modal [open]="!isOpen" id="modal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" bg-close="true">
<div class="filtersModal uk-modal-dialog uk-small-1-2 uk-width-medium-1-3 uk-width-1-3 uk-padding-small uk-padding-remove-top uk-padding-remove-horizontal">
<button type="button" class="uk-modal-close-default" uk-close (click)="close()"></button>
<h5 class="uk-margin-remove uk-padding uk-padding-remove-bottom">
{{filter.title}}
</h5>
<span *ngIf="filter.values.length >= 99" class="uk-article-meta uk-text-center">Showing top {{filter.values.length}} values. </span>
<div class="uk-modal-body uk-overflow-auto uk-height-medium uk-padding-remove
uk-margin-medium-left uk-margin-medium-right uk-margin-small-top uk-margin-bottom">
<div *ngFor = "let value of getSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}">
<input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
<div *ngFor = "let value of getNotSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>

70
portal-2/src/app/searchPages/searchUtils/searchFilter.component.ts
View File

@ -6,75 +6,7 @@ import {Open} from '../../utils/modal/open.component';
@Component({
selector: 'search-filter',
template: `
<ul *ngIf= "filter.values.length >0" class="uk-list">
<li class="uk-open">
<h5 class="uk-margin-bottom-remove">{{_formatTitle(filter.title,filter.values.length)}}
</h5>
<div aria-expanded="false">
<div class="searchFilterBoxValues ">
<div *ngFor = "let value of getSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}">
<input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<!--div class="uk-grid-divider uk-margin-remove"></div-->
<hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
<div *ngFor = "let value of getNotSelectedValues(filter).slice(0,(!addShowMore?getNotSelectedValues(filter).length:5-getSelectedValues(filter).length))" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<!--a *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="toggle()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">Show More</a-->
<!--button *ngIf="(getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5"
class="uk-button uk-button-link" (click)="toggle()" [disabled]="isDisabled">
Show More
</button-->
<a *ngIf=" addShowMore && (getSelectedValues(filter).length + getNotSelectedValues(filter).length) > 5" (click)="open()" [class]="(isDisabled)?'uk-disabled uk-link-muted':''">View more<span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="triangle-right" ratio="1"><polygon points="8 5 13 10 8 15"></polygon></svg>
</span></a>
<div *ngIf="addShowMore" [class]="(!isOpen)?'uk-modal ':'uk-modal uk-open uk-animation-fade'" uk-modal [open]="!isOpen" id="modal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" bg-close="true">
<div class="filtersModal uk-modal-dialog uk-small-1-2 uk-width-medium-1-3 uk-width-1-3 uk-padding-small uk-padding-remove-top uk-padding-remove-horizontal">
<button type="button" class="uk-modal-close-default" uk-close (click)="close()"></button>
<h5 class="uk-margin-remove uk-padding uk-padding-remove-bottom">
{{filter.title}}
</h5>
<span *ngIf="filter.values.length >= 99" class="uk-article-meta uk-text-center">Showing top {{filter.values.length}} values. </span>
<div class="uk-modal-body uk-overflow-auto uk-height-medium uk-padding-remove
uk-margin-medium-left uk-margin-medium-right uk-margin-small-top uk-margin-bottom">
<div *ngFor = "let value of getSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}">
<input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
<hr *ngIf="getSelectedValues(filter).length > 0 && getNotSelectedValues(filter).length > 0" class="uk-grid-divider uk-margin-remove">
<div *ngFor = "let value of getNotSelectedValues(filter)" class = "uk-animation-fade filterItem">
<span class="filterName"><div title = "{{value.name}}"> <input [disabled]="isDisabled" [(ngModel)]="value.selected" type="checkbox" (ngModelChange)="close(); filterChange(value.selected)" />
{{_formatName(value)}} </div></span>
<span class="filterNumber" *ngIf = "showResultCount === true" > ({{value.number}})</span>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
`
templateUrl: 'searchFilter.component.html'
})
export class SearchFilterComponent {

14
portal-2/src/app/searchPages/searchUtils/searchForm.component.ts
View File

@ -1,6 +1,7 @@
import {Component, Input, Output, EventEmitter} from '@angular/core';
import {Observable} from 'rxjs/Observable';
import {RouterHelper} from '../../utils/routerHelper.class';
import {Router} from '@angular/router';
@Component({
selector: 'search-form',
@ -13,16 +14,12 @@ import {RouterHelper} from '../../utils/routerHelper.class';
<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>
<a *ngIf="link" class=" uk-button uk-button-default" [queryParams]="routerHelper.createQueryParam('keyword',keyword)" routerLinkActive="router-link-active" routerLink="/search/find">
<button *ngIf="link" class=" uk-button uk-button-default" (click)="goTo()" type="submit" >
<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
</a>
</button>
</form>
`
})
@ -36,7 +33,7 @@ export class SearchFormComponent {
@Output() keywordChange = new EventEmitter();
constructor () {
constructor (private _router:Router) {
}
ngOnInit() {
@ -49,4 +46,7 @@ export class SearchFormComponent {
value: this.keyword
});
}
goTo() {
this._router.navigate(['/search/find'], { queryParams: this.routerHelper.createQueryParam('keyword',this.keyword) });
}
}

107
portal-2/src/app/searchPages/searchUtils/searchPage.component.html Normal file
View File

@ -0,0 +1,107 @@
<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="">
<div [class]="'uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle uk- light '+searchFormClass" >
<div class="uk-width-1-1">
<div class="uk-width-1-1">
<search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)" [placeholderText]="formPlaceholderText"></search-form>
</div>
<div class="uk-width-1-1 ">
<!--link to advanced search -->
<a *ngIf = "advancedSearchLink && advancedSearchLink.length > 0" routerLinkActive="router-link-active" [class]="(disableForms)?'uk-float-right uk-disabled uk-link-muted uk-light ':'uk-float-right uk-light'" [routerLink]=advancedSearchLink >More search options <span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
</span>
</a>
<div *ngIf="isFiltered()" class = "uk-container uk-width-1-2@m uk-width-1-2@s uk-align-center uk-text-center uk-text-small">
<span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span [innerHtml]="searchUtils.keyword"></span><a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
</span>
<span *ngFor="let filter of filters " >
<span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " ><span [innerHtml]="(value.name.length > 25)?value.name.substring(0,25)+'...':value.name" title="value.name"></span><a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span *ngIf="!end">, </span>
</span>
</span>
</span>
<a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
Clear All
</a>
</div>
<div *ngIf= "showUnknownFilters" class = " uk-text-center ">
<a (click) = "clearFilters() " >Try new Query</a>
</div>
</div>
</div>
</div>
<div class="uk-container">
<helper position="top"></helper>
<div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-align-center uk-margin-remove-bottom':'uk-width-1-1'">
<div *ngIf="showRefine" class="uk-offcanvas-content uk-hidden@m">
<a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
<div id="offcanvas-usage" uk-offcanvas>
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close" type="button" uk-close></button>
<div class="uk-text-large">Filter By:</div>
<search-filter *ngFor="let filter of filters " [addShowMore]=false [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
</div>
</div>
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
</div>
<div class="uk-grid uk-width-1-1 uk-margin">
<div *ngIf="showRefine" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<helper position="left"></helper>
<search-filter *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
<!--div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-first-column':''" -->
<div [class]="(showRefine)?'uk-width-expand@m uk-first-column':''" >
<search-result *ngIf="!tableView"
[results]="results"
[status]="searchUtils.status"
[type]="entityType" [urlParam]="urlParam"
[showLoading]="true">
</search-result>
</div>
<div *ngIf="tableViewLink || searchUtils.totalResults <=10000" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<span *ngIf="tableViewLink" class="uk-margin-medium-right">
<a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=tableViewLink >
<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
</a>
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
</span>
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults"></search-download>
<helper position="right"></helper>
</div>
<div *ngIf="!(tableViewLink || searchUtils.totalResults <=10000)" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<helper position="right"></helper>
</div>
<div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-align-center uk-margin-remove-bottom':'uk-width-1-1'">
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
</div>
<div class="uk-width-1-1">
<helper position="bottom"></helper>
</div>
</div>
</div>
</div>
</div>
</div>

114
portal-2/src/app/searchPages/searchUtils/searchPage.component.ts
View File

@ -19,118 +19,8 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
@Component({
selector: 'search-page',
template: `
<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="">
<div [class]="'uk-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle uk- light '+searchFormClass" >
<div class="uk-width-1-1">
<div class="uk-width-1-1">
<search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)" [placeholderText]="formPlaceholderText"></search-form>
</div>
<div class="uk-width-1-1 ">
<!--link to advanced search -->
<a *ngIf = "advancedSearchLink && advancedSearchLink.length > 0" routerLinkActive="router-link-active" [class]="(disableForms)?'uk-float-right uk-disabled uk-link-muted uk-light ':'uk-float-right uk-light'" [routerLink]=advancedSearchLink >More search options <span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="chevron-right" ratio="1"><polyline fill="none" stroke="#000" stroke-width="1.03" points="7 4 13 10 7 16"></polyline></svg>
</span>
</a>
<div *ngIf="isFiltered()" class = "uk-container uk-width-1-2@m uk-width-1-2@s uk-align-center uk-text-center uk-text-small">
<span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span [innerHtml]="searchUtils.keyword"></span><a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
</span>
<span *ngFor="let filter of filters " >
<span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " ><span [innerHtml]="(value.name.length > 25)?value.name.substring(0,25)+'...':value.name" title="value.name"></span><a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span *ngIf="!end">, </span>
</span>
</span>
</span>
<a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
Clear All
</a>
</div>
<div *ngIf= "showUnknownFilters" class = " uk-text-center ">
<a (click) = "clearFilters() " >Try new Query</a>
</div>
</div>
</div>
</div>
<div class="uk-container">
<helper position="top"></helper>
<div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-align-center uk-margin-remove-bottom':'uk-width-1-1'">
<div *ngIf="showRefine" class="uk-offcanvas-content uk-hidden@m">
<a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
<div id="offcanvas-usage" uk-offcanvas>
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close" type="button" uk-close></button>
<div class="uk-text-large">Filter By:</div>
<search-filter *ngFor="let filter of filters " [addShowMore]=false [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
</div>
</div>
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
</div>
<div class="uk-grid uk-width-1-1 uk-margin">
<div *ngIf="showRefine" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<helper position="left"></helper>
<search-filter *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
<!--div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-first-column':''" -->
<div [class]="(showRefine)?'uk-width-expand@m uk-first-column':''" >
<search-result *ngIf="!tableView"
[results]="results"
[status]="searchUtils.status"
[type]="entityType" [urlParam]="urlParam"
[showLoading]="true">
</search-result>
</div>
<div *ngIf="tableViewLink || searchUtils.totalResults <=10000" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<span *ngIf="tableViewLink" class="uk-margin-medium-right">
<a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=tableViewLink >
<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
</a>
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
</span>
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults"></search-download>
<helper position="right"></helper>
</div>
<div *ngIf="!(tableViewLink || searchUtils.totalResults <=10000)" class=" search-filters uk-width-1-5@l uk-width-1-5@m uk-width-1-1@s uk-visible@m">
<helper position="right"></helper>
</div>
<div [class]="(showRefine)?'uk-width-3-5@m uk-width-3-5@l uk-width-1-1@s uk-align-center uk-margin-remove-bottom':'uk-width-1-1'">
<search-paging [type]="type" [(searchUtils)] = "searchUtils" [(results)] = "results" [(baseUrl)] = "baseUrl" [(parameterNames)] = "parameterNames" [(parameterValues)] = "parameterValues" ></search-paging>
</div>
<div class="uk-width-1-1">
<helper position="bottom"></helper>
</div>
</div>
</div>
</div>
</div>
</div>
`
templateUrl: 'searchPage.component.html'
})
export class SearchPageComponent {
@Input() pageTitle = "";

168
portal-2/src/app/searchPages/searchUtils/searchPageTableView.component.html Normal file
View File

@ -0,0 +1,168 @@
<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-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle '+searchFormClass" >
<div class="uk-width-1-1">
<div class="uk-width-1-1">
<search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)" [placeholderText]="formPlaceholderText"></search-form>
</div>
<div class="uk-width-1-1 uk-light">
<div *ngIf="isFiltered()" class = "uk-container uk-text-center ">
<span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span>{{searchUtils.keyword}}<a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a></span>
</span>
<span *ngFor="let filter of filters " >
<span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " >{{value.name}}<a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span *ngIf="!end">, </span>
</span>
</span>
</span>
<a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
Clear All
</a>
</div>
</div>
</div>
</div>
<div class="uk-container">
<div *ngIf="searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade uk-margin-top" role="alert">No Results found</div>
<div *ngIf="searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade uk-margin-top" role="alert">An Error Occured</div>
<div *ngIf="searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade uk-margin-top" role="alert">Service not available</div>
<div *ngIf="searchUtils.status == errorCodes.LOADING" class="uk-alert uk-alert-primary uk-animation-fade uk-margin-top" role="alert"
class="uk-animation-fade uk-margin-large-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
</div>
<div class="uk-grid uk-width-1-1 uk-margin">
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div *ngIf="searchUtils.totalResults > 0" class="uk-offcanvas-content uk-hidden@m">
<a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
<div id="offcanvas-usage" uk-offcanvas>
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close" type="button" uk-close></button>
<div class="uk-text-large">Filter By:</div>
<search-filter *ngFor="let filter of filters " [addShowMore]=false [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
</div>
</div>
<div *ngIf="searchUtils.totalResults > 0" class=" search-filters uk-width-1-4@l uk-width-1-4@m uk-width-1-1@s uk-margin-large-top uk-visible@m">
<helper position="left"></helper>
<search-filter *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
<div class="uk-width-3-4@m uk-width-3-4@l uk-width-1-1@s uk-first-column" >
<div class="uk-overflow-container custom-dataTable-content">
<table class="uk-table uk-table-striped divider-table" #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage"
[mfData]="results | contentProvidersDatatable : [searchUtils, filters, triggerPipe]">
<thead *ngIf="searchUtils.totalResults > 0">
<tr><td colspan="5" class="uk-padding-remove-bottom uk-padding-remove-right">
<span class="uk-h6">
{{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}}
</span>
<paging-no-load class="uk-float-right" [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
</td></tr>
<!--tr><td colspan="5" class="uk-padding-remove">
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" (downloadClick)="downloadClicked($event)"></search-download>
</td></tr-->
<tr *ngIf="searchViewLink"><td colspan="5" class="uk-padding-remove-top uk-padding-remove-right uk-text-right">
<p>
<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
<a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=searchViewLink >
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
</a>
</p>
</td></tr>
<tr>
<!-- Name Type Country Institution Compatibility -->
<th class="uk-text-left"><mfDefaultSorter by="title.name">Name</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="type">Type</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="countries">Country</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter [by]="sortByOrganization">Institution</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="compatibility">Compatibility</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
</tr>
</thead>
<tbody *ngIf="searchUtils.totalResults > 0">
<tr class="uk-table-middle" *ngFor="let dataprovider of mf.data">
<td class="uk-width-1-5 uk-text-left">
<a [queryParams]="{datasourceId: dataprovider.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
<span *ngIf="dataprovider.title.name"
[innerHTML]="dataprovider.title.name">
</span>
<span *ngIf="!dataprovider.title.name">
[no title available]
</span>
</a>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngIf="dataprovider.type">{{dataprovider.type}}</span>
<span *ngIf="!dataprovider.type">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngFor="let country of dataprovider['countries'].slice(0,5) let i = index">{{country}}{{(i < ( dataprovider['countries'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['countries'].slice(0,5).length-1 && dataprovider['countries'].length > 5)?"...":""}}</span>
<span *ngIf="dataprovider.countries.length == 0">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngFor="let org of dataprovider['organizations'].slice(0,5) let i = index">
<a *ngIf="org.id" [queryParams]="{organizationId: org.id}" routerLinkActive="router-link-active" routerLink="/search/organization">{{org.name}}</a><span *ngIf="!org.id">{{org.name}}</span>{{(i < ( dataprovider['organizations'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['organizations'].slice(0,5).length-1 && dataprovider['organizations'].length > 5)?"...":""}}
</span>
<span *ngIf="dataprovider.organizations.length == 0">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngIf="dataprovider.compatibility">{{dataprovider.compatibility}}</span>
<span *ngIf="!dataprovider.compatibility">-</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<helper position="bottom"></helper>
</div>
<modal-search-filter [filter]="currentFilter" [showResultCount]=showResultCount (modalChange)="filterChanged($event)"></modal-search-filter>
</div>
</div>
</div>

172
portal-2/src/app/searchPages/searchUtils/searchPageTableView.component.ts
View File

@ -17,176 +17,8 @@ import {PiwikService} from '../../utils/piwik/piwik.service';
@Component({
selector: 'search-page-table',
template: `
<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-background-norepeat uk-background-cover uk-section uk-flex uk-flex-middle '+searchFormClass" >
<div class="uk-width-1-1">
<div class="uk-width-1-1">
<search-form [isDisabled]="disableForms" [(keyword)]="searchUtils.keyword" (keywordChange)="keywordChanged($event)" [placeholderText]="formPlaceholderText"></search-form>
</div>
<div class="uk-width-1-1 uk-light">
<div *ngIf="isFiltered()" class = "uk-container uk-text-center ">
<span *ngIf = "searchUtils.keyword.length > 0">Keywords: <span>{{searchUtils.keyword}}<a (click) = "clearKeywords() " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable " aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a></span>
</span>
<span *ngFor="let filter of filters " >
<span *ngIf = "filter.countSelectedValues > 0"> {{filter.title}}:
<span *ngFor="let value of getSelectedValues(filter); let i = index; let end = last; " >{{value.name}}<a (click) = "removeFilter(value, filter) " [class]="(disableForms)?'uk-icon-button uk-disabled':'uk-icon-button'"><span class=" clickable" aria-hidden="true"><span class="uk-icon">
<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="close" ratio="1"><path fill="none" stroke="#000" stroke-width="1.06" d="M16,16 L4,4"></path><path fill="none" stroke="#000" stroke-width="1.06" d="M16,4 L4,16"></path></svg>
</span></span></a>
<span *ngIf="!end">, </span>
</span>
</span>
</span>
<a (click)="clearFilters()" [class]="(disableForms)?'uk-disabled uk-link-muted':''">
Clear All
</a>
</div>
</div>
</div>
</div>
<div class="uk-container">
<div *ngIf="searchUtils.status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade uk-margin-top" role="alert">No Results found</div>
<div *ngIf="searchUtils.status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade uk-margin-top" role="alert">An Error Occured</div>
<div *ngIf="searchUtils.status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade uk-margin-top" role="alert">Service not available</div>
<div *ngIf="searchUtils.status == errorCodes.LOADING" class="uk-alert uk-alert-primary uk-animation-fade uk-margin-top" role="alert"
class="uk-animation-fade uk-margin-large-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading">
</div>
<div class="uk-grid uk-width-1-1 uk-margin">
<div class="uk-width-1-1">
<helper position="top"></helper>
</div>
<div *ngIf="searchUtils.totalResults > 0" class="uk-offcanvas-content uk-hidden@m">
<a href="#offcanvas-usage" uk-toggle><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="6" y="4" width="12" height="1"></rect><rect x="6" y="9" width="12" height="1"></rect><rect x="6" y="14" width="12" height="1"></rect><rect x="2" y="4" width="2" height="1"></rect><rect x="2" y="9" width="2" height="1"></rect><rect x="2" y="14" width="2" height="1"></rect></svg></a>
<div id="offcanvas-usage" uk-offcanvas>
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close" type="button" uk-close></button>
<div class="uk-text-large">Filter By:</div>
<search-filter *ngFor="let filter of filters " [addShowMore]=false [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
</div>
</div>
<div *ngIf="searchUtils.totalResults > 0" class=" search-filters uk-width-1-4@l uk-width-1-4@m uk-width-1-1@s uk-margin-large-top uk-visible@m">
<helper position="left"></helper>
<search-filter *ngFor="let filter of filters " [isDisabled]="disableForms" [filter]="filter" [showResultCount]=showResultCount (change)="filterChanged($event)" (toggleModal)="toggleModal($event)"></search-filter>
</div>
<div class="uk-width-3-4@m uk-width-3-4@l uk-width-1-1@s uk-first-column" >
<div class="uk-overflow-container custom-dataTable-content">
<table class="uk-table uk-table-striped divider-table" #mf="mfDataTable" [mfRowsOnPage]="rowsOnPage"
[mfData]="results | contentProvidersDatatable : [searchUtils, filters, triggerPipe]">
<thead *ngIf="searchUtils.totalResults > 0">
<tr><td colspan="5" class="uk-padding-remove-bottom uk-padding-remove-right">
<span class="uk-h6">
{{searchUtils.totalResults}} content providers, page {{searchUtils.page}} of {{(totalPages())}}
</span>
<paging-no-load class="uk-float-right" [currentPage]="searchUtils.page" [totalResults]="searchUtils.totalResults" [size]="rowsOnPage" (pageChange)="goTo($event.value, false)"></paging-no-load>
</td></tr>
<!--tr><td colspan="5" class="uk-padding-remove">
<search-download [type]="csvPath" [csvParams]="csvParams" [totalResults]="searchUtils.totalResults" (downloadClick)="downloadClicked($event)"></search-download>
</td></tr-->
<tr *ngIf="searchViewLink"><td colspan="5" class="uk-padding-remove-top uk-padding-remove-right uk-text-right">
<p>
<span class="uk-margin-small-right uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" ratio="1"><rect x="2" y="2" width="3" height="3"></rect><rect x="8" y="2" width="3" height="3"></rect><rect x="14" y="2" width="3" height="3"></rect><rect x="2" y="8" width="3" height="3"></rect><rect x="8" y="8" width="3" height="3"></rect><rect x="14" y="8" width="3" height="3"></rect><rect x="2" y="14" width="3" height="3"></rect><rect x="8" y="14" width="3" height="3"></rect><rect x="14" y="14" width="3" height="3"></rect></svg></span>
<a routerLinkActive="router-link-active" [class]="(disableForms)?'uk-disabled uk-link-muted':''" [routerLink]=searchViewLink >
<span class="uk-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="table" ratio="1"><rect x="1" y="3" width="18" height="1"></rect><rect x="1" y="7" width="18" height="1"></rect><rect x="1" y="11" width="18" height="1"></rect><rect x="1" y="15" width="18" height="1"></rect></svg></span>
</a>
</p>
</td></tr>
<tr>
<!-- Name Type Country Institution Compatibility -->
<th class="uk-text-left"><mfDefaultSorter by="title.name">Name</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="type">Type</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="countries">Country</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter [by]="sortByOrganization">Institution</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
<th class="uk-text-center"><mfDefaultSorter by="compatibility">Compatibility</mfDefaultSorter>
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
<polygon fill="#767779" points="4 1 1 6 7 6"></polygon>
<polygon fill="#767779" points="4 13 1 8 7 8"></polygon>
</svg>
</th>
</tr>
</thead>
<tbody *ngIf="searchUtils.totalResults > 0">
<tr class="uk-table-middle" *ngFor="let dataprovider of mf.data">
<td class="uk-width-1-5 uk-text-left">
<a [queryParams]="{datasourceId: dataprovider.id}" routerLinkActive="router-link-active" routerLink="/search/dataprovider">
<span *ngIf="dataprovider.title.name"
[innerHTML]="dataprovider.title.name">
</span>
<span *ngIf="!dataprovider.title.name">
[no title available]
</span>
</a>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngIf="dataprovider.type">{{dataprovider.type}}</span>
<span *ngIf="!dataprovider.type">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngFor="let country of dataprovider['countries'].slice(0,5) let i = index">{{country}}{{(i < ( dataprovider['countries'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['countries'].slice(0,5).length-1 && dataprovider['countries'].length > 5)?"...":""}}</span>
<span *ngIf="dataprovider.countries.length == 0">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngFor="let org of dataprovider['organizations'].slice(0,5) let i = index">
<a *ngIf="org.id" [queryParams]="{organizationId: org.id}" routerLinkActive="router-link-active" routerLink="/search/organization">{{org.name}}</a><span *ngIf="!org.id">{{org.name}}</span>{{(i < ( dataprovider['organizations'].slice(0,5).length-1))?", ":""}}{{(i == dataprovider['organizations'].slice(0,5).length-1 && dataprovider['organizations'].length > 5)?"...":""}}
</span>
<span *ngIf="dataprovider.organizations.length == 0">-</span>
</td>
<td class="uk-width-1-5 uk-text-center">
<span *ngIf="dataprovider.compatibility">{{dataprovider.compatibility}}</span>
<span *ngIf="!dataprovider.compatibility">-</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<helper position="bottom"></helper>
</div>
<modal-search-filter [filter]="currentFilter" [showResultCount]=showResultCount (modalChange)="filterChanged($event)"></modal-search-filter>
</div>
</div>
</div>
`
})
templateUrl:'searchPageTableView.component.html'
})
export class SearchPageTableViewComponent {
@Input() pageTitle = "";
@Input() results;

123
portal-2/src/app/searchPages/searchUtils/searchResult.component.html Normal file
View File

@ -0,0 +1,123 @@
<ul [class]="'uk-list uk-list-divider uk-margin '+custom_class">
<div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
<div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
<div *ngIf="status == errorCodes.OUT_OF_BOUND" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">Requested page out of bounds</div>
<div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
<div *ngIf="status == errorCodes.LOADING && showLoading" class="uk-animation-fade uk-margin-large-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
<li *ngFor="let result of results" class="uk-animation-fade">
<h4 class = "{{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode >
<a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
<p *ngIf="result['title'].name != undefined && result['title'].name != ''"
[innerHTML]="result['title'].name">
</p>
<p *ngIf="result['title'].name == undefined || result['title'].name == ''">
[no title available]
</p>
</a>
</h4>
<div>
<span *ngIf="result['authors'] != undefined">
<span *ngFor="let author of result['authors'].slice(0,15)">
<!--a href="{{author['url']}}"-->
<a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+type+'s'">
{{author['name']}};
</a>
</span>
<span *ngIf="result['authors'].length > 15">...</span>
</span>
<span *ngIf="result.year != undefined && result.year != ''">
({{result.year}})
</span>
</div>
<div *ngIf="result.publisher != undefined && result.publisher != ''"><span class="uk-text-bold">Publisher:</span> {{result.publisher}}</div>
<div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div>
<div *ngIf="result['projects'] != undefined">
<span> Project: </span>
<span *ngFor="let project of result['projects'].slice(0,15) let i=index">
<!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
<a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
{{project['funderShortname']?project['funderShortname']:project['funderName']}}
| {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}} ({{project.code}})</a><span
*ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
*ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}}</span><span
*ngIf="project.code">({{project.code}})</span></span><span
*ngIf="i < result['projects'].length-1">,</span>
</span>
<span *ngIf="result['projects'].length > 15">...</span>
</div>
<div *ngIf="result.description != undefined && result.description != ''">
<div class="text-justify descriptionText">
{{result.description}}
</div>
</div>
<mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
<div *ngIf="result['funders'] != undefined">
<span> Funder: </span>
<span *ngFor="let funder of result['funders'] let i=index">
<span *ngIf="funder.funderShortname">
{{funder.funderShortname}}</span><span
*ngIf="i < result['funders'].length-1">,</span>
</span>
<span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
</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.url != undefined" href="{{organization.url}}"-->
<a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
{{organization.name}}</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>
<div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div>
<div *ngIf="result['countries'] && result['countries'].length > 0">
Country: <span *ngFor="let country of result['countries'].slice(0,10) let i = index">{{country}}{{(i < ( result['countries'].slice(0,10).length-1))?", ":""}}{{(i == result['countries'].slice(0,10).length-1 && result['countries'].length > 10)?"...":""}}</span>
</div>
<div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
<span>Website URL: </span>
<span>
<a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
{{result['websiteURL']}}
</a>
</span>
</div>
<div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
<span>OAI-PMH URL: </span>
<span>
<a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
{{result['OAIPMHURL']}}
</a>
</span>
</div>
<div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
Compatibility: {{result.compatibility}}
</div>
<div *ngIf="showSubjects && result['subjects'] && result['subjects'].length > 0">
Subject: <span *ngFor="let subject of result['subjects'].slice(0,10) let i = index">{{subject}}{{(i < ( result['subjects'].slice(0,10).length-1))?", ":""}}{{(i == result['subjects'].slice(0,10).length-1 && result['subjects'].length > 10)?"...":""}}</span>
</div>
</li>
</ul>

125
portal-2/src/app/searchPages/searchUtils/searchResult.component.ts
View File

@ -5,130 +5,7 @@ import {RouterHelper} from '../../utils/routerHelper.class';
@Component({
selector: 'search-result',
template: `
<ul [class]="'uk-list uk-list-divider uk-margin '+custom_class">
<div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
<div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
<div *ngIf="status == errorCodes.OUT_OF_BOUND" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">Requested page out of bounds</div>
<div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
<div *ngIf="status == errorCodes.LOADING && showLoading" class="uk-animation-fade uk-margin-large-top uk-width-1-1" role="alert"><img src="./assets/loading.gif" class="uk-align-center" alt="Loading"></div>
<li *ngFor="let result of results" class="uk-animation-fade">
<h4 class = "{{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode >
<a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
<p *ngIf="result['title'].name != undefined && result['title'].name != ''"
[innerHTML]="result['title'].name">
</p>
<p *ngIf="result['title'].name == undefined || result['title'].name == ''">
[no title available]
</p>
</a>
</h4>
<div>
<span *ngIf="result['authors'] != undefined">
<span *ngFor="let author of result['authors'].slice(0,15)">
<!--a href="{{author['url']}}"-->
<a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+type+'s'">
{{author['name']}};
</a>
</span>
<span *ngIf="result['authors'].length > 15">...</span>
</span>
<span *ngIf="result.year != undefined && result.year != ''">
({{result.year}})
</span>
</div>
<div *ngIf="result.publisher != undefined && result.publisher != ''"><span class="uk-text-bold">Publisher:</span> {{result.publisher}}</div>
<div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div>
<div *ngIf="result['projects'] != undefined">
<span> Project: </span>
<span *ngFor="let project of result['projects'].slice(0,15) let i=index">
<!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
<a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
{{project['funderShortname']?project['funderShortname']:project['funderName']}}
| {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}} ({{project.code}})</a><span
*ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
*ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:(project['title'].length>25?project['title'].substring(0,25)+'...':project['title'])}}</span><span
*ngIf="project.code">({{project.code}})</span></span><span
*ngIf="i < result['projects'].length-1">,</span>
</span>
<span *ngIf="result['projects'].length > 15">...</span>
</div>
<div *ngIf="result.description != undefined && result.description != ''">
<div class="text-justify descriptionText">
{{result.description}}
</div>
</div>
<mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
<div *ngIf="result['funders'] != undefined">
<span> Funder: </span>
<span *ngFor="let funder of result['funders'] let i=index">
<span *ngIf="funder.funderShortname">
{{funder.funderShortname}}</span><span
*ngIf="i < result['funders'].length-1">,</span>
</span>
<span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
</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.url != undefined" href="{{organization.url}}"-->
<a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
{{organization.name}}</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>
<div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div>
<div *ngIf="result['countries'] && result['countries'].length > 0">
Country: <span *ngFor="let country of result['countries'].slice(0,10) let i = index">{{country}}{{(i < ( result['countries'].slice(0,10).length-1))?", ":""}}{{(i == result['countries'].slice(0,10).length-1 && result['countries'].length > 10)?"...":""}}</span>
</div>
<div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
<span>Website URL: </span>
<span>
<a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
{{result['websiteURL']}}
</a>
</span>
</div>
<div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
<span>OAI-PMH URL: </span>
<span>
<a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
{{result['OAIPMHURL']}}
</a>
</span>
</div>
<div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
Compatibility: {{result.compatibility}}
</div>
<div *ngIf="showSubjects && result['subjects'] && result['subjects'].length > 0">
Subject: <span *ngFor="let subject of result['subjects'].slice(0,10) let i = index">{{subject}}{{(i < ( result['subjects'].slice(0,10).length-1))?", ":""}}{{(i == result['subjects'].slice(0,10).length-1 && result['subjects'].length > 10)?"...":""}}</span>
</div>
</li>
</ul>
`
templateUrl:'searchResult.component.html'
})
export class SearchResultComponent {

121
portal-2/src/app/searchPages/searchUtils/tabResult.component.html Normal file
View File

@ -0,0 +1,121 @@
<ul class="uk-list uk-list-divider uk-margin">
<!--div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
<div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
<div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
<div *ngIf="status == errorCodes.LOADING && showLoading" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">Loading...</div-->
<li *ngFor="let result of results" class="uk-animation-fade">
<div class = "uk-text-large {{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode >
<!--a href="{{result['title'].url}}"-->
<!--a [queryParams]="{articleId: 'od_______908::3a5b2885656a91307156325644e73b92'}" routerLinkActive="router-link-active" routerLink="search/publication"-->
<a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
<span *ngIf="result['title'].name != undefined && result['title'].name != ''"
[innerHTML]="result['title'].name">
</span>
<!--p *ngIf="result['title'].name == undefined || result['title'].name == ''">
{{result['title'].url}}
</p-->
<span *ngIf="result['title'].name == undefined || result['title'].name == ''">
[no title available]
</span>
</a>
</div>
<div>
<span *ngIf="result['authors'] != undefined">
<span *ngFor="let author of result['authors'].slice(0,15)">
<a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+type+'s'">
{{author['name']}};
</a>
</span>
<span *ngIf="result['authors'].length > 15">...</span>
</span>
<span *ngIf="result.year != undefined && result.year != ''">
({{result.year}})
</span>
</div>
<div *ngIf="result.publisher != undefined && result.publisher != ''">Publisher: {{result.publisher}}</div>
<div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div>
<div *ngIf="result['projects'] != undefined">
<span> Project: </span>
<span *ngFor="let project of result['projects'].slice(0,15) let i=index">
<!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
<a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
{{project['funderShortname']?project['funderShortname']:project['funderName']}}
| {{ project['acronym']?project['acronym']:project['title']}} ({{project.code}})</a><span
*ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
*ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:project['title']}}</span><span
*ngIf="project.code">({{project.code}})</span></span><span
*ngIf="i < result['projects'].length-1">,</span>
</span>
<span *ngIf="result['projects'].length > 15">...</span>
</div>
<!--blockquote *ngIf="result.description != undefined && result.description != ''">
<div class="text-justify">
{{result.description}}
</div>
</blockquote-->
<mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
<div *ngIf="result['funders'] != undefined">
<!--span> Funders: </span-->
<span *ngFor="let funder of result['funders'] let i=index">
<span *ngIf="funder.funderShortname">
{{funder.funderShortname}}</span><span
*ngIf="i < result['funders'].length-1">,</span>
</span> <span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
</div>
<div *ngIf="showOrganizations && 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.url != undefined" href="{{organization.url}}"-->
<a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
{{organization.name}}</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>
<div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div>
<div *ngIf="result['countries'] && result['countries'].length > 0">
Country: {{result.countries}}
</div>
<div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
<span>Website URL: </span>
<span>
<a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
{{result['websiteURL']}}
</a>
</span>
</div>
<div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
<span>OAI-PMH URL: </span>
<span>
<a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
{{result['OAIPMHURL']}}
</a>
</span>
</div>
<div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
Compatibility: {{result.compatibility}}
</div>
</li>
</ul>

126
portal-2/src/app/searchPages/searchUtils/tabResult.component.ts
View File

@ -5,130 +5,8 @@ import {RouterHelper} from '../../utils/routerHelper.class';
@Component({
selector: 'tab-result',
template: `
<ul class="uk-list uk-list-divider uk-margin">
<!--div *ngIf="status == errorCodes.NONE" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">No Results found</div>
<div *ngIf="status == errorCodes.ERROR" class="uk-alert uk-alert-warning uk-animation-fade" role="alert">An Error Occured</div>
<div *ngIf="status == errorCodes.NOT_AVAILABLE" class="uk-alert uk-alert-danger uk-animation-fade" role="alert">Service not available</div>
<div *ngIf="status == errorCodes.LOADING && showLoading" class="uk-alert uk-alert-primary uk-animation-fade" role="alert">Loading...</div-->
<li *ngFor="let result of results" class="uk-animation-fade">
<div class = "uk-text-large {{result.title.accessMode}} {{result.title.sc39}}" [title] = result.title.accessMode >
<!--a href="{{result['title'].url}}"-->
<!--a [queryParams]="{articleId: 'od_______908::3a5b2885656a91307156325644e73b92'}" routerLinkActive="router-link-active" routerLink="search/publication"-->
<a [queryParams]="routerHelper.createQueryParam(urlParam,result.id)" routerLinkActive="router-link-active" routerLink="/search/{{type}}">
<span *ngIf="result['title'].name != undefined && result['title'].name != ''"
[innerHTML]="result['title'].name">
</span>
<!--p *ngIf="result['title'].name == undefined || result['title'].name == ''">
{{result['title'].url}}
</p-->
<span *ngIf="result['title'].name == undefined || result['title'].name == ''">
[no title available]
</span>
</a>
</div>
<div>
<span *ngIf="result['authors'] != undefined">
<span *ngFor="let author of result['authors'].slice(0,15)">
<a [queryParams]="routerHelper.createQueryParams(['author','au'],[quote(author['name']),'and'])" routerLinkActive="router-link-active" [routerLink]="'/search/advanced/'+type+'s'">
{{author['name']}};
</a>
</span>
<span *ngIf="result['authors'].length > 15">...</span>
</span>
<span *ngIf="result.year != undefined && result.year != ''">
({{result.year}})
</span>
</div>
<div *ngIf="result.publisher != undefined && result.publisher != ''">Publisher: {{result.publisher}}</div>
<div *ngIf="result.country != undefined && result.country != ''">Country: {{result.country}}</div>
<div *ngIf="result['projects'] != undefined">
<span> Project: </span>
<span *ngFor="let project of result['projects'].slice(0,15) let i=index">
<!--a *ngIf="project.url != undefined" href="{{project.url}}"-->
<a *ngIf="project.id" [queryParams]="{projectId: project.id}" routerLinkActive="router-link-active" routerLink="/search/project">
{{project['funderShortname']?project['funderShortname']:project['funderName']}}
| {{ project['acronym']?project['acronym']:project['title']}} ({{project.code}})</a><span
*ngIf="!project.id">{{project['funderShortname']?project['funderShortname']:project['funderName']}}<span
*ngIf="project['acronym'] || project['title']"> | {{ project['acronym']?project['acronym']:project['title']}}</span><span
*ngIf="project.code">({{project.code}})</span></span><span
*ngIf="i < result['projects'].length-1">,</span>
</span>
<span *ngIf="result['projects'].length > 15">...</span>
</div>
<!--blockquote *ngIf="result.description != undefined && result.description != ''">
<div class="text-justify">
{{result.description}}
</div>
</blockquote-->
<mark *ngIf="result.embargoEndDate != undefined && result.embargoEndDate != ''">Embargo End Date: {{result.embargoEndDate}}</mark>
<div *ngIf="result['funders'] != undefined">
<!--span> Funders: </span-->
<span *ngFor="let funder of result['funders'] let i=index">
<span *ngIf="funder.funderShortname">
{{funder.funderShortname}}</span><span
*ngIf="i < result['funders'].length-1">,</span>
</span> <span *ngIf="result.startYear && result.endYear"> (start {{result.startYear}} - end {{result.endYear}})</span>
</div>
<div *ngIf="showOrganizations && 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.url != undefined" href="{{organization.url}}"-->
<a *ngIf="organization.id" [queryParams]="{organizationId: organization.id}" routerLinkActive="router-link-active" routerLink="/search/organization">
{{organization.name}}</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>
<div *ngIf="result['type'] != undefined && result['type'] != ''">Type: {{result['type']}}</div>
<div *ngIf="result['countries'] && result['countries'].length > 0">
Country: {{result.countries}}
</div>
<div *ngIf="result['websiteURL'] != undefined && result['websiteURL'] != ''">
<span>Website URL: </span>
<span>
<a href="{{result['websiteURL']}}" target="_blank" class="custom-external custom-icon">
{{result['websiteURL']}}
</a>
</span>
</div>
<div *ngIf="result['OAIPMHURL'] != undefined && result['OAIPMHURL'] != ''">
<span>OAI-PMH URL: </span>
<span>
<a href="{{result['OAIPMHURL']}}" target="_blank" class="custom-external custom-icon">
{{result['OAIPMHURL']}}
</a>
</span>
</div>
<div *ngIf="result['compatibility'] != undefined && result['compatibility'] != ''">
Compatibility: {{result.compatibility}}
</div>
</li>
</ul>
`
})
templateUrl: 'tabResult.component.html'
})
export class TabResultComponent {
@Input() results: SearchResult[];

79
portal-2/src/app/sharedComponents/bottom.component.html Normal file
View File

@ -0,0 +1,79 @@
<div class="custom-footer">
<div class="uk-section-primary uk-section uk-section-small uk-padding-remove-bottom">
<div class="uk-container">
<div class="uk-grid-margin uk-grid" uk-grid="">
<div class="uk-width-expand@m uk-light uk-first-column">
<div class="uk-margin">
<div class="uk-child-width-auto uk-grid-small uk-grid" uk-grid="">
<div class="uk-first-column">
<a class="el-link uk-icon-link uk-icon" href="http://www.facebook.com/groups/openaire/" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="facebook" ratio="1"><path d="M11,10h2.6l0.4-3H11V5.3c0-0.9,0.2-1.5,1.5-1.5H14V1.1c-0.3,0-1-0.1-2.1-0.1C9.6,1,8,2.4,8,5v2H5.5v3H8v8h3V10z"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.twitter.com/OpenAIRE_eu" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="twitter" ratio="1"><path d="M19,4.74 C18.339,5.029 17.626,5.229 16.881,5.32 C17.644,4.86 18.227,4.139 18.503,3.28 C17.79,3.7 17.001,4.009 16.159,4.17 C15.485,3.45 14.526,3 13.464,3 C11.423,3 9.771,4.66 9.771,6.7 C9.771,6.99 9.804,7.269 9.868,7.539 C6.795,7.38 4.076,5.919 2.254,3.679 C1.936,4.219 1.754,4.86 1.754,5.539 C1.754,6.82 2.405,7.95 3.397,8.61 C2.79,8.589 2.22,8.429 1.723,8.149 L1.723,8.189 C1.723,9.978 2.997,11.478 4.686,11.82 C4.376,11.899 4.049,11.939 3.713,11.939 C3.475,11.939 3.245,11.919 3.018,11.88 C3.49,13.349 4.852,14.419 6.469,14.449 C5.205,15.429 3.612,16.019 1.882,16.019 C1.583,16.019 1.29,16.009 1,15.969 C2.635,17.019 4.576,17.629 6.662,17.629 C13.454,17.629 17.17,12 17.17,7.129 C17.17,6.969 17.166,6.809 17.157,6.649 C17.879,6.129 18.504,5.478 19,4.74"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.linkedin.com/groups/OpenAIRE-3893548" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="linkedin" ratio="1"><path d="M5.77,17.89 L5.77,7.17 L2.21,7.17 L2.21,17.89 L5.77,17.89 L5.77,17.89 Z M3.99,5.71 C5.23,5.71 6.01,4.89 6.01,3.86 C5.99,2.8 5.24,2 4.02,2 C2.8,2 2,2.8 2,3.85 C2,4.88 2.77,5.7 3.97,5.7 L3.99,5.7 L3.99,5.71 L3.99,5.71 Z"></path><path d="M7.75,17.89 L11.31,17.89 L11.31,11.9 C11.31,11.58 11.33,11.26 11.43,11.03 C11.69,10.39 12.27,9.73 13.26,9.73 C14.55,9.73 15.06,10.71 15.06,12.15 L15.06,17.89 L18.62,17.89 L18.62,11.74 C18.62,8.45 16.86,6.92 14.52,6.92 C12.6,6.92 11.75,7.99 11.28,8.73 L11.3,8.73 L11.3,7.17 L7.75,7.17 C7.79,8.17 7.75,17.89 7.75,17.89 L7.75,17.89 L7.75,17.89 Z"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.slideshare.net/OpenAIRE_eu" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="social" ratio="1"><line fill="none" stroke="#000" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line><line fill="none" stroke="#000" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://vimeo.com/openaire" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="vimeo" ratio="1"><path d="M2.065,7.59C1.84,7.367,1.654,7.082,1.468,6.838c-0.332-0.42-0.137-0.411,0.274-0.772c1.026-0.91,2.004-1.896,3.127-2.688 c1.017-0.713,2.365-1.173,3.286-0.039c0.849,1.045,0.869,2.629,1.084,3.891c0.215,1.309,0.421,2.648,0.88,3.901 c0.127,0.352,0.37,1.018,0.81,1.074c0.567,0.078,1.145-0.917,1.408-1.289c0.684-0.987,1.611-2.317,1.494-3.587 c-0.115-1.349-1.572-1.095-2.482-0.773c0.146-1.514,1.555-3.216,2.912-3.792c1.439-0.597,3.579-0.587,4.302,1.036 c0.772,1.759,0.078,3.802-0.763,5.396c-0.918,1.731-2.1,3.333-3.363,4.829c-1.114,1.329-2.432,2.787-4.093,3.422 c-1.897,0.723-3.021-0.686-3.667-2.318c-0.705-1.777-1.056-3.771-1.565-5.621C4.898,8.726,4.644,7.836,4.136,7.191 C3.473,6.358,2.72,7.141,2.065,7.59C1.977,7.502,2.115,7.551,2.065,7.59L2.065,7.59z"></path></svg></a>
</div>
</div>
</div>
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-left">
<img src="assets/common/ec_logo_inv_small.png" class="el-image" alt="European Commission">
</div>
</div>
<div class="uk-width-expand@m uk-light">
<div>
<ul class="uk-subnav uk-margin-remove-bottom uk-subnav-divider" uk-margin="">
<li class="el-item uk-first-column">
<a target="_blank" href="https://beta.openaire.eu/project-factsheets">About</a>
</li>
<li class="el-item">
<a target="_blank" >Services</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/news-events/">News</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/news-events/">Events</a>
</li>
<li class="el-item">
<a target="_blank" href="https://blogs.openaire.eu/">Blog</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/contact-us">Contact us</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="uk-section-primary uk-section uk-section-small">
<div class="uk-container">
<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-center">
<img src="assets/common/Logo_Horizontal_white_small.png" class="el-image" alt="OpenAIRE">
</div>
<div class="footer-license uk-margin uk-margin-remove-bottom uk-text-center uk-text-lead">
<div><a href="http://creativecommons.org/licenses/by/4.0/" rel="license"><img src="assets/common/80x15.png" alt="Creative" style="height: auto; max-width: 100%; vertical-align: middle;"></a>&nbsp;UNLESS OTHERWISE INDICATED, ALL MATERIALS CREATED BY THE OPENAIRE CONSORTIUM ARE LICENSED UNDER A&nbsp;<a href="http://creativecommons.org/licenses/by/4.0/" rel="license">CREATIVE COMMONS ATTRIBUTION 4.0 INTERNATIONAL LICENSE</a>.</div>
<div>OPENAIRE IS POWERED BY&nbsp;<a href="http://www.d-net.research-infrastructures.eu/">D-NET</a>.</div>
</div>
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-right">
<a href="#" uk-totop="" uk-scroll="" class="uk-totop uk-icon"></a>
</div>
</div>
</div>
</div>
</div>
</div>

84
portal-2/src/app/sharedComponents/bottom.component.ts
View File

@ -3,89 +3,7 @@ import 'rxjs/Rx';
@Component({
selector: 'bottom',
template: `
<div class="custom-footer">
<div class="uk-section-primary uk-section uk-section-small uk-padding-remove-bottom">
<div class="uk-container">
<div class="uk-grid-margin uk-grid" uk-grid="">
<div class="uk-width-expand@m uk-light uk-first-column">
<div class="uk-margin">
<div class="uk-child-width-auto uk-grid-small uk-grid" uk-grid="">
<div class="uk-first-column">
<a class="el-link uk-icon-link uk-icon" href="http://www.facebook.com/groups/openaire/" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="facebook" ratio="1"><path d="M11,10h2.6l0.4-3H11V5.3c0-0.9,0.2-1.5,1.5-1.5H14V1.1c-0.3,0-1-0.1-2.1-0.1C9.6,1,8,2.4,8,5v2H5.5v3H8v8h3V10z"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.twitter.com/OpenAIRE_eu" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="twitter" ratio="1"><path d="M19,4.74 C18.339,5.029 17.626,5.229 16.881,5.32 C17.644,4.86 18.227,4.139 18.503,3.28 C17.79,3.7 17.001,4.009 16.159,4.17 C15.485,3.45 14.526,3 13.464,3 C11.423,3 9.771,4.66 9.771,6.7 C9.771,6.99 9.804,7.269 9.868,7.539 C6.795,7.38 4.076,5.919 2.254,3.679 C1.936,4.219 1.754,4.86 1.754,5.539 C1.754,6.82 2.405,7.95 3.397,8.61 C2.79,8.589 2.22,8.429 1.723,8.149 L1.723,8.189 C1.723,9.978 2.997,11.478 4.686,11.82 C4.376,11.899 4.049,11.939 3.713,11.939 C3.475,11.939 3.245,11.919 3.018,11.88 C3.49,13.349 4.852,14.419 6.469,14.449 C5.205,15.429 3.612,16.019 1.882,16.019 C1.583,16.019 1.29,16.009 1,15.969 C2.635,17.019 4.576,17.629 6.662,17.629 C13.454,17.629 17.17,12 17.17,7.129 C17.17,6.969 17.166,6.809 17.157,6.649 C17.879,6.129 18.504,5.478 19,4.74"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.linkedin.com/groups/OpenAIRE-3893548" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="linkedin" ratio="1"><path d="M5.77,17.89 L5.77,7.17 L2.21,7.17 L2.21,17.89 L5.77,17.89 L5.77,17.89 Z M3.99,5.71 C5.23,5.71 6.01,4.89 6.01,3.86 C5.99,2.8 5.24,2 4.02,2 C2.8,2 2,2.8 2,3.85 C2,4.88 2.77,5.7 3.97,5.7 L3.99,5.7 L3.99,5.71 L3.99,5.71 Z"></path><path d="M7.75,17.89 L11.31,17.89 L11.31,11.9 C11.31,11.58 11.33,11.26 11.43,11.03 C11.69,10.39 12.27,9.73 13.26,9.73 C14.55,9.73 15.06,10.71 15.06,12.15 L15.06,17.89 L18.62,17.89 L18.62,11.74 C18.62,8.45 16.86,6.92 14.52,6.92 C12.6,6.92 11.75,7.99 11.28,8.73 L11.3,8.73 L11.3,7.17 L7.75,7.17 C7.79,8.17 7.75,17.89 7.75,17.89 L7.75,17.89 L7.75,17.89 Z"></path></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://www.slideshare.net/OpenAIRE_eu" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="social" ratio="1"><line fill="none" stroke="#000" stroke-width="1.1" x1="13.4" y1="14" x2="6.3" y2="10.7"></line><line fill="none" stroke="#000" stroke-width="1.1" x1="13.5" y1="5.5" x2="6.5" y2="8.8"></line><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="4.6" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="15.5" cy="14.8" r="2.3"></circle><circle fill="none" stroke="#000" stroke-width="1.1" cx="4.5" cy="9.8" r="2.3"></circle></svg></a>
</div>
<div>
<a class="el-link uk-icon-link uk-icon" href="http://vimeo.com/openaire" target="_blank" ><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" icon="vimeo" ratio="1"><path d="M2.065,7.59C1.84,7.367,1.654,7.082,1.468,6.838c-0.332-0.42-0.137-0.411,0.274-0.772c1.026-0.91,2.004-1.896,3.127-2.688 c1.017-0.713,2.365-1.173,3.286-0.039c0.849,1.045,0.869,2.629,1.084,3.891c0.215,1.309,0.421,2.648,0.88,3.901 c0.127,0.352,0.37,1.018,0.81,1.074c0.567,0.078,1.145-0.917,1.408-1.289c0.684-0.987,1.611-2.317,1.494-3.587 c-0.115-1.349-1.572-1.095-2.482-0.773c0.146-1.514,1.555-3.216,2.912-3.792c1.439-0.597,3.579-0.587,4.302,1.036 c0.772,1.759,0.078,3.802-0.763,5.396c-0.918,1.731-2.1,3.333-3.363,4.829c-1.114,1.329-2.432,2.787-4.093,3.422 c-1.897,0.723-3.021-0.686-3.667-2.318c-0.705-1.777-1.056-3.771-1.565-5.621C4.898,8.726,4.644,7.836,4.136,7.191 C3.473,6.358,2.72,7.141,2.065,7.59C1.977,7.502,2.115,7.551,2.065,7.59L2.065,7.59z"></path></svg></a>
</div>
</div>
</div>
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-left">
<img src="assets/common/ec_logo_inv_small.png" class="el-image" alt="European Commission">
</div>
</div>
<div class="uk-width-expand@m uk-light">
<div>
<ul class="uk-subnav uk-margin-remove-bottom uk-subnav-divider" uk-margin="">
<li class="el-item uk-first-column">
<a target="_blank" href="https://beta.openaire.eu/project-factsheets">About</a>
</li>
<li class="el-item">
<a target="_blank" >Services</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/news-events/">News</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/news-events/">Events</a>
</li>
<li class="el-item">
<a target="_blank" href="https://blogs.openaire.eu/">Blog</a>
</li>
<li class="el-item">
<a target="_blank" href="https://beta.openaire.eu/contact-us">Contact us</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="uk-section-primary uk-section uk-section-small">
<div class="uk-container">
<div class="uk-grid-margin uk-grid uk-grid-stack" uk-grid="">
<div class="uk-width-1-1@m uk-first-column">
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-center">
<img src="assets/common/Logo_Horizontal_white_small.png" class="el-image" alt="OpenAIRE">
</div>
<div class="footer-license uk-margin uk-margin-remove-bottom uk-text-center uk-text-lead">
<div><a href="http://creativecommons.org/licenses/by/4.0/" rel="license"><img src="assets/common/80x15.png" alt="Creative" style="height: auto; max-width: 100%; vertical-align: middle;"></a>&nbsp;UNLESS OTHERWISE INDICATED, ALL MATERIALS CREATED BY THE OPENAIRE CONSORTIUM ARE LICENSED UNDER A&nbsp;<a href="http://creativecommons.org/licenses/by/4.0/" rel="license">CREATIVE COMMONS ATTRIBUTION 4.0 INTERNATIONAL LICENSE</a>.</div>
<div>OPENAIRE IS POWERED BY&nbsp;<a href="http://www.d-net.research-infrastructures.eu/">D-NET</a>.</div>
</div>
<div class="uk-margin uk-margin-remove-top uk-margin-remove-bottom uk-text-right">
<a href="#" uk-totop="" uk-scroll="" class="uk-totop uk-icon"></a>
</div>
</div>
</div>
</div>
</div>
</div>
`
templateUrl: 'bottom.component.html'
})
export class BottomComponent {

194
portal-2/src/app/sharedComponents/navigationBar.component.html Normal file
View File

@ -0,0 +1,194 @@
<div class="tm-header-mobile uk-hidden@m">
<nav class="uk-navbar-container uk-navbar" uk-navbar="">
<div class="uk-navbar-left">
<a class="uk-navbar-toggle" href="#tm-mobile" uk-toggle="" style="z-index:1000;">
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"> </div>
</a>
</div>
<div class="uk-navbar-center">
<a class="uk-navbar-item uk-logo" routerLinkActive="uk-link" routerLink="/" >
<img src="assets/OA DISCOVER_A.png" alt="OpenAIRE" class="uk-responsive-height"> </a>
</div>
<!--div class="uk-navbar-right uk-margin-xlarge-top">
<user-mini></user-mini>
</div-->
</nav>
<div id="tm-mobile" uk-offcanvas="" mode="slide" overlay="" class="uk-offcanvas">
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close uk-close uk-icon" type="button" uk-close=""></button>
<div class="uk-child-width-1-1 uk-grid" uk-grid="">
<div>
<div *ngIf= "isClient" class="uk-panel" id="module-0">
<ul class="uk-nav uk-nav-default">
<li class="uk-nav-header uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/find" class="uk-offcanvas-close custom-offcanvas-close">Search</a>
<ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/search/find/publications" class="uk-offcanvas-close custom-offcanvas-close">Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/datasets" class="uk-offcanvas-close custom-offcanvas-close">Research Data</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/projects" class="uk-offcanvas-close custom-offcanvas-close">Projects</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders" class="uk-offcanvas-close custom-offcanvas-close">Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/organizations" class="uk-offcanvas-close custom-offcanvas-close">Organizations</a></li>
</ul>
</li>
<li class="uk-nav-header uk-parent">
Deposit
<ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-publications" class="uk-offcanvas-close custom-offcanvas-close" >Deposit Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-datasets" class="uk-offcanvas-close custom-offcanvas-close" >Deposit Research Data</a></li>
</ul>
</li>
<li class="uk-nav-header uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/claim" class="" aria-expanded="false">Link</a>
<!--ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/participate/claim" class="uk-offcanvas-close custom-offcanvas-close" >Link</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims" class="uk-offcanvas-close custom-offcanvas-close">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims" class="uk-offcanvas-close custom-offcanvas-close">Manage all Claims</a></li>
</ul-->
</li>
<li class="uk-nav-header uk-parent">
Resources
<ul class="uk-nav-sub">
<li><a href="https://beta.openaire.eu/oa-policies-mandates" class="uk-offcanvas-close custom-offcanvas-close" >Policies and mandates</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/content-providers" class="uk-offcanvas-close custom-offcanvas-close" >OpenAIRE Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/entity-registries" class="uk-offcanvas-close custom-offcanvas-close" >Registries/ Databases</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/journals" class="uk-offcanvas-close custom-offcanvas-close" >Journals</a></li>
</ul>
</li>
<user-mini mobileView=true></user-mini>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-toolbar custom-discover-toolbar uk-visible@m">
<div class="uk-container uk-flex uk-flex-middle uk-container-expand">
<div class="uk-margin-auto-left">
<div class="uk-grid-medium uk-child-width-auto uk-flex-middle uk-grid uk-grid-stack" uk-grid="margin: uk-margin-small-top">
<div class="uk-first-column">
<div class="uk-panel inner" id="module-119">
<ul class="uk-subnav uk-subnav-line">
<li ><a href="https://beta.openaire.eu" class="home-icon"><span class="uk-responsive-height" >
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 20 20" height="20px" id="Layer_1" version="1.1" viewBox="0 0 48 48" width="20px" xml:space="preserve"><path id="home" clip-rule="evenodd" d="M44.715,23.711c-0.381,0.382-1,0.382-1.381,0l-8.939-8.938 c-0.064-0.051-0.119-0.106-0.17-0.171l-3.83-3.829c-0.064-0.051-0.119-0.106-0.17-0.171L24,4.377L4.667,23.711 c-0.381,0.382-1,0.382-1.381,0c-0.381-0.381-0.381-1,0-1.381L23.191,2.425c0.031-0.047,0.053-0.101,0.094-0.144 C23.482,2.085,23.742,1.994,24,2c0.258-0.006,0.518,0.084,0.715,0.281c0.043,0.042,0.062,0.096,0.096,0.144L30,7.616V4.997 c0,0,0,0,0,0c0-0.552,0.447-1,1-1h4c0.277,0,0.527,0.112,0.707,0.293C35.889,4.471,36,4.721,36,4.997v8.619l8.715,8.714 C45.096,22.711,45.096,23.33,44.715,23.711z M34,5.997h-2v3.619l2,2V5.997z M10,21.997c0.552,0,1,0.448,1,1v19c0,1.105,0.896,2,2,2 h6l0,0v-13c0-0.553,0.447-1,1-1h8c0.553,0,1,0.447,1,1v13l0,0h6c1.105,0,2-0.895,2-2v-19c0-0.552,0.447-1,1-1s1,0.448,1,1v19 c0,2.209-1.791,4-4,4H13c-2.209,0-4-1.791-4-4v-19C9,22.444,9.448,21.997,10,21.997z M27,43.996v-12h-6v12l0,0H27L27,43.996z" fill-rule="evenodd" fill="#fff"/></svg>
<!--img class="uk-responsive-height" src="assets/Home_24white.svg" alt="home"-->
</span></a></li>
<li class="custom-discover-li"><a routerLinkActive="uk-link" routerLink="/" >Discover</a></li>
<li><a >Join</a></li>
<li><a >Connect</a></li>
<li><a >Monitor</a></li>
<li><a >Develop</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-header uk-visible@m tm-header-transparent" uk-header="">
<div class="uk-navbar-container uk-sticky uk-navbar-transparent uk-light" uk-sticky="" media="768" cls-active="uk-active uk-navbar-sticky" animation="uk-animation-slide-top" top=".tm-header + [class*=&quot;uk-section&quot;]" cls-inactive="uk-navbar-transparent uk-light" style="">
<div class="uk-container uk-container-expand">
<nav class="uk-navbar" uk-navbar="{&quot;align&quot;:&quot;left&quot;}">
<div class="uk-navbar-left uk-visible@l ">
<a routerLinkActive="uk-link" routerLink="/" class="uk-logo uk-navbar-item">
<img src="assets/OA DISCOVER_B.png" alt="OpenAIRE" class="uk-responsive-height"></a>
</div>
<div class="uk-navbar-left uk-visible@m uk-hidden@l">
<a routerLinkActive="uk-link" routerLink="/" class="uk-logo uk-navbar-item">
<img src="assets/OA DISCOVER_A.png" alt="OpenAIRE" class="uk-responsive-height"></a>
</div>
<div class="uk-navbar-center">
<ul *ngIf= "isClient" class="uk-navbar-nav">
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/find" class="" aria-expanded="false">Search</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 0px;" id="searchMenu" (click)="onClick('searchMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/search/find/publications">Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/datasets">Research Data</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/projects">Projects</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders">Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/organizations">Organizations</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/deposit-publications" class="" aria-expanded="false">Deposit</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 240px;" id="depositMenu" (click)="onClick('depositMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-publications">Deposit Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-datasets">Deposit Research Data</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/claim" class="" aria-expanded="false">Link</a>
<!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 358px;" id="linkingMenu" (click)="onClick('linkingMenu')" >
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/participate/claim">Link</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
</ul>
</div>
</div>
</div-->
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Resources</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 113px;" id="dpMenu" (click)="onClick('dpMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a href="https://beta.openaire.eu/oa-policies-mandates" class="uk-offcanvas-close custom-offcanvas-close" >Policies and mandates</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/content-providers">OpenAIRE Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/entity-registries">Registries/ Databases</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/journals">Journals</a></li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
<div *ngIf= "isClient" class="uk-navbar-right">
<!--ul class="uk-navbar-nav">
<li class="uk-parent"-->
<user-mini ></user-mini>
<!--a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Resources</a-->
<!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" id="userMenu" (click)="onClick('userMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a href="" class="uk-offcanvas-close custom-offcanvas-close" >My profile</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
<li><a routerLinkActive="uk-link" routerLink="/login">Log out</a></li>
</ul>
</div>
</div>
</div-->
<!--/li>
</ul-->
</div>
</nav>
</div>
</div>
<!--div class="uk-sticky-placeholder" style="height: 80px; margin: 0px;" hidden="hidden"></div>
<div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" hidden="hidden"></div-->
</div>
<div class="first_page_section uk-section-default uk-section uk-padding-remove-vertical">
<div class="first_page_banner_headline uk-grid-collapse uk-flex-middle uk-margin-remove-vertical uk-grid uk-grid-stack" uk-grid="">
</div>
</div>

208
portal-2/src/app/sharedComponents/navigationBar.component.ts
View File

@ -6,213 +6,7 @@ import {Session} from '../login/utils/helper.class';
@Component({
selector: 'navbar',
template: `
<div class="tm-header-mobile uk-hidden@m">
<nav class="uk-navbar-container uk-navbar" uk-navbar="">
<div class="uk-navbar-left">
<a class="uk-navbar-toggle" href="#tm-mobile" uk-toggle="" style="z-index:1000;">
<div uk-navbar-toggle-icon="" class="uk-navbar-toggle-icon uk-icon custom-navbar-toggle-icon"> </div>
</a>
</div>
<div class="uk-navbar-center">
<a class="uk-navbar-item uk-logo" routerLinkActive="uk-link" routerLink="/" >
<img src="assets/OA DISCOVER_A.png" alt="OpenAIRE" class="uk-responsive-height"> </a>
</div>
<!--div class="uk-navbar-right uk-margin-xlarge-top">
<user-mini></user-mini>
</div-->
</nav>
<div id="tm-mobile" uk-offcanvas="" mode="slide" overlay="" class="uk-offcanvas">
<div class="uk-offcanvas-bar">
<button class="uk-offcanvas-close uk-close uk-icon" type="button" uk-close=""></button>
<div class="uk-child-width-1-1 uk-grid" uk-grid="">
<div>
<div *ngIf= "isClient" class="uk-panel" id="module-0">
<ul class="uk-nav uk-nav-default">
<li class="uk-nav-header uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/find" class="uk-offcanvas-close custom-offcanvas-close">Search</a>
<ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/search/find/publications" class="uk-offcanvas-close custom-offcanvas-close">Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/datasets" class="uk-offcanvas-close custom-offcanvas-close">Research Data</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/projects" class="uk-offcanvas-close custom-offcanvas-close">Projects</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders" class="uk-offcanvas-close custom-offcanvas-close">Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/organizations" class="uk-offcanvas-close custom-offcanvas-close">Organizations</a></li>
</ul>
</li>
<li class="uk-nav-header uk-parent">
Deposit
<ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-publications" class="uk-offcanvas-close custom-offcanvas-close" >Deposit Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-datasets" class="uk-offcanvas-close custom-offcanvas-close" >Deposit Research Data</a></li>
</ul>
</li>
<li class="uk-nav-header uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/claim" class="" aria-expanded="false">Link</a>
<!--ul class="uk-nav-sub">
<li><a routerLinkActive="uk-link" routerLink="/participate/claim" class="uk-offcanvas-close custom-offcanvas-close" >Link</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims" class="uk-offcanvas-close custom-offcanvas-close">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims" class="uk-offcanvas-close custom-offcanvas-close">Manage all Claims</a></li>
</ul-->
</li>
<li class="uk-nav-header uk-parent">
Resources
<ul class="uk-nav-sub">
<li><a href="https://beta.openaire.eu/oa-policies-mandates" class="uk-offcanvas-close custom-offcanvas-close" >Policies and mandates</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/content-providers" class="uk-offcanvas-close custom-offcanvas-close" >OpenAIRE Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/entity-registries" class="uk-offcanvas-close custom-offcanvas-close" >Registries/ Databases</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/journals" class="uk-offcanvas-close custom-offcanvas-close" >Journals</a></li>
</ul>
</li>
<user-mini mobileView=true></user-mini>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-toolbar custom-discover-toolbar uk-visible@m">
<div class="uk-container uk-flex uk-flex-middle uk-container-expand">
<div class="uk-margin-auto-left">
<div class="uk-grid-medium uk-child-width-auto uk-flex-middle uk-grid uk-grid-stack" uk-grid="margin: uk-margin-small-top">
<div class="uk-first-column">
<div class="uk-panel inner" id="module-119">
<ul class="uk-subnav uk-subnav-line">
<li ><a href="https://beta.openaire.eu" class="home-icon"><span class="uk-responsive-height" >
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 20 20" height="20px" id="Layer_1" version="1.1" viewBox="0 0 48 48" width="20px" xml:space="preserve"><path id="home" clip-rule="evenodd" d="M44.715,23.711c-0.381,0.382-1,0.382-1.381,0l-8.939-8.938 c-0.064-0.051-0.119-0.106-0.17-0.171l-3.83-3.829c-0.064-0.051-0.119-0.106-0.17-0.171L24,4.377L4.667,23.711 c-0.381,0.382-1,0.382-1.381,0c-0.381-0.381-0.381-1,0-1.381L23.191,2.425c0.031-0.047,0.053-0.101,0.094-0.144 C23.482,2.085,23.742,1.994,24,2c0.258-0.006,0.518,0.084,0.715,0.281c0.043,0.042,0.062,0.096,0.096,0.144L30,7.616V4.997 c0,0,0,0,0,0c0-0.552,0.447-1,1-1h4c0.277,0,0.527,0.112,0.707,0.293C35.889,4.471,36,4.721,36,4.997v8.619l8.715,8.714 C45.096,22.711,45.096,23.33,44.715,23.711z M34,5.997h-2v3.619l2,2V5.997z M10,21.997c0.552,0,1,0.448,1,1v19c0,1.105,0.896,2,2,2 h6l0,0v-13c0-0.553,0.447-1,1-1h8c0.553,0,1,0.447,1,1v13l0,0h6c1.105,0,2-0.895,2-2v-19c0-0.552,0.447-1,1-1s1,0.448,1,1v19 c0,2.209-1.791,4-4,4H13c-2.209,0-4-1.791-4-4v-19C9,22.444,9.448,21.997,10,21.997z M27,43.996v-12h-6v12l0,0H27L27,43.996z" fill-rule="evenodd" fill="#fff"/></svg>
<!--img class="uk-responsive-height" src="assets/Home_24white.svg" alt="home"-->
</span></a></li>
<li class="custom-discover-li"><a routerLinkActive="uk-link" routerLink="/" >Discover</a></li>
<li><a >Join</a></li>
<li><a >Connect</a></li>
<li><a >Monitor</a></li>
<li><a >Develop</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tm-header uk-visible@m tm-header-transparent" uk-header="">
<div class="uk-navbar-container uk-sticky uk-navbar-transparent uk-light" uk-sticky="" media="768" cls-active="uk-active uk-navbar-sticky" animation="uk-animation-slide-top" top=".tm-header + [class*=&quot;uk-section&quot;]" cls-inactive="uk-navbar-transparent uk-light" style="">
<div class="uk-container uk-container-expand">
<nav class="uk-navbar" uk-navbar="{&quot;align&quot;:&quot;left&quot;}">
<div class="uk-navbar-left uk-visible@l ">
<a routerLinkActive="uk-link" routerLink="/" class="uk-logo uk-navbar-item">
<img src="assets/OA DISCOVER_B.png" alt="OpenAIRE" class="uk-responsive-height"></a>
</div>
<div class="uk-navbar-left uk-visible@m uk-hidden@l">
<a routerLinkActive="uk-link" routerLink="/" class="uk-logo uk-navbar-item">
<img src="assets/OA DISCOVER_A.png" alt="OpenAIRE" class="uk-responsive-height"></a>
</div>
<div class="uk-navbar-center">
<ul *ngIf= "isClient" class="uk-navbar-nav">
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/find" class="" aria-expanded="false">Search</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 0px;" id="searchMenu" (click)="onClick('searchMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/search/find/publications">Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/datasets">Research Data</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/projects">Projects</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/dataproviders">Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/find/organizations">Organizations</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/deposit-publications" class="" aria-expanded="false">Deposit</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 240px;" id="depositMenu" (click)="onClick('depositMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-publications">Deposit Publications</a></li>
<li><a routerLinkActive="uk-link" routerLink="/participate/deposit-datasets">Deposit Research Data</a></li>
</ul>
</div>
</div>
</div>
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/participate/claim" class="" aria-expanded="false">Link</a>
<!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 358px;" id="linkingMenu" (click)="onClick('linkingMenu')" >
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a routerLinkActive="uk-link" routerLink="/participate/claim">Link</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
</ul>
</div>
</div>
</div-->
</li>
<li class="uk-parent">
<a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Resources</a>
<div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" style="top: 80px; left: 113px;" id="dpMenu" (click)="onClick('dpMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a href="https://beta.openaire.eu/oa-policies-mandates" class="uk-offcanvas-close custom-offcanvas-close" >Policies and mandates</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/content-providers">OpenAIRE Content Providers</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/entity-registries">Registries/ Databases</a></li>
<li><a routerLinkActive="uk-link" routerLink="/search/journals">Journals</a></li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
<div *ngIf= "isClient" class="uk-navbar-right">
<!--ul class="uk-navbar-nav">
<li class="uk-parent"-->
<user-mini ></user-mini>
<!--a routerLinkActive="uk-link" routerLink="/search/content-providers" class="" aria-expanded="false">Resources</a-->
<!--div class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left" id="userMenu" (click)="onClick('userMenu')">
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column">
<ul class="uk-nav uk-navbar-dropdown-nav">
<li><a href="" class="uk-offcanvas-close custom-offcanvas-close" >My profile</a></li>
<li><a routerLinkActive="uk-link" routerLink="/myclaims">My Claims</a></li>
<li *ngIf="isAuthorized"><a routerLinkActive="uk-link" routerLink="/claims">Manage all Claims</a></li>
<li><a routerLinkActive="uk-link" routerLink="/login">Log out</a></li>
</ul>
</div>
</div>
</div-->
<!--/li>
</ul-->
</div>
</nav>
</div>
</div>
<!--div class="uk-sticky-placeholder" style="height: 80px; margin: 0px;" hidden="hidden"></div>
<div class="uk-sticky-placeholder" style="height: 84px; margin: 0px;" hidden="hidden"></div-->
</div>
<div class="first_page_section uk-section-default uk-section uk-padding-remove-vertical">
<div class="first_page_banner_headline uk-grid-collapse uk-flex-middle uk-margin-remove-vertical uk-grid uk-grid-stack" uk-grid="">
</div>
</div>
`
templateUrl: 'navigationBar.component.html'
})
export class NavigationBarComponent {
public isAuthorized: boolean = false;

3
portal-2/src/app/utils/helper/helper.component.ts
View File

@ -6,13 +6,10 @@ import {OpenaireProperties} from '../properties/openaireProperties';
@Component({
selector: 'helper',
template: `
<div *ngIf=" texts && texts.length > 0" [ngClass]=styleName>
<div *ngFor="let text of texts " [innerHTML]="text.content">
</div>
</div>
`
})
export class HelperComponent {