[plugins-functionality | WIP]

This commit is contained in:
argirok 2024-03-11 13:27:26 +02:00
parent 2bb981c489
commit e177918b5d
4 changed files with 167 additions and 155 deletions

View File

@ -1,90 +1,95 @@
<div *ngIf="!community " class="uk-text-muted uk-text-center">
No community info available
</div>
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-1@s">
<div *ngIf="portal && community" class=""> <!-- this div will have the
customized color or image -->
<div class="uk-container uk-container-large uk-flex uk-flex-center">
<div class="uk-margin-large-top uk-margin-large-bottom">
<h1 *ngIf="pluginObject.showShortTitle" class="uk-text-center uk-h2 uk-margin-remove">
{{community.shortTitle}}
</h1>
<div *ngIf="pluginObject.showTitle"
class="uk-text-center uk-margin-top">
{{community.title}}
</div>
<div *ngIf="pluginObject.description" [innerHTML]="community.description"></div>
<div *ngIf="pluginObject.searchbar && isRouteEnabled(searchLinkToResults)" [class.uk-invisible]="disableSelect" class="uk-margin-medium-top">
<advanced-search-input #advanced (searchEmitter)="goTo(true)">
<entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result"
[selectedEntity]="selectedEntity"
(selectionChange)="entityChanged($event);advanced.focusNext(input, $event)"
(disableSelectEmitter)="disableSelectChange($event)"
[onChangeNavigate]="false"></entities-selection>
<div input #input class="uk-width-expand" placeholder="Scholary works" [searchable]="true"
[hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
</advanced-search-input>
<div *ngIf="selectedEntity === 'result' && input.focused"
(click)="$event.stopPropagation();advanced.focusNext(input, $event)"
class="uk-dropdown uk-display-block uk-margin-small-top uk-width-auto" uk-dropdown="mode: click">
<div class="uk-padding-small">
<quick-selections [resultTypes]="resultTypes" [quickFilter]="resultsQuickFilter"></quick-selections>
</div>
<div class="uk-section uk-container ">
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-1@s ">
<div *ngIf="portal && community" class="">
<div *ngIf="pluginObject.showShortTitle"
class="uk-text-primary">
{{community.shortTitle}}
</div>
<h1 *ngIf="pluginObject.showTitle" class=" uk-h2 uk-margin-remove">
{{community.title}}
</h1>
<div *ngIf="pluginObject.description" [innerHTML]="community.description"></div>
<div *ngIf="pluginObject.searchbar && isRouteEnabled(searchLinkToResults)" [class.uk-invisible]="disableSelect"
class="uk-margin-medium-top">
<advanced-search-input #advanced (searchEmitter)="goTo(true)">
<entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result"
[selectedEntity]="selectedEntity"
(selectionChange)="entityChanged($event);advanced.focusNext(input, $event)"
(disableSelectEmitter)="disableSelectChange($event)"
[onChangeNavigate]="false"></entities-selection>
<div input #input class="uk-width-expand" placeholder="Scholary works" [searchable]="true"
[hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
</advanced-search-input>
<div *ngIf="selectedEntity === 'result' && input.focused"
(click)="$event.stopPropagation();advanced.focusNext(input, $event)"
class="uk-dropdown uk-display-block uk-margin-small-top uk-width-auto" uk-dropdown="mode: click">
<div class="uk-padding-small">
<quick-selections [resultTypes]="resultTypes" [quickFilter]="resultsQuickFilter"></quick-selections>
</div>
</div>
<div *ngIf="(pluginObject.fos && isRouteEnabled('/fields-of-science')) || (pluginObject.sdgs && isRouteEnabled('/sdgs'))" class="uk-padding-small uk-margin-small-top">
<div class="uk-text-meta">
Try browsing by:
</div>
<div class="link-actions uk-flex uk-flex-column uk-flex-top uk-margin-small-top">
<a *ngIf="pluginObject.sdgs && isRouteEnabled('/sdgs')" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-small-bottom"
routerLinkActive="router-link-active" routerLink="/sdgs">
</div>
<div
*ngIf="(pluginObject.fos && isRouteEnabled('/fields-of-science')) || (pluginObject.sdgs && isRouteEnabled('/sdgs'))"
class="uk-padding-small uk-margin-small-top">
<div class="uk-text-meta">
Try browsing by:
</div>
<div class="link-actions uk-flex uk-flex-column uk-flex-top uk-margin-small-top">
<a *ngIf="pluginObject.sdgs && isRouteEnabled('/sdgs')"
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-small-bottom"
routerLinkActive="router-link-active" routerLink="/sdgs">
<span class="uk-flex uk-flex-middle">
<img src="assets/common-assets/sdg/sdg-dot-img.svg" alt="SDGs logo" loading="lazy" width="17px" height="17px">
<img src="assets/common-assets/sdg/sdg-dot-img.svg" alt="SDGs logo" loading="lazy" width="17px"
height="17px">
<span class="uk-margin-small-left">Sustainable Development Goals (SDG<span
class="uk-text-lowercase">s</span>)</span>
</span>
</a>
<a *ngIf="pluginObject.fos&& isRouteEnabled('/fields-of-science') " class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
routerLinkActive="router-link-active" routerLink="/fields-of-science">
</a>
<a *ngIf="pluginObject.fos&& isRouteEnabled('/fields-of-science') "
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
routerLinkActive="router-link-active" routerLink="/fields-of-science">
<span class="uk-flex uk-flex-middle">
<img src="assets/common-assets/fos/fos-icon.svg" alt="FOS logo" loading="lazy" width="17px" height="8px">
<img src="assets/common-assets/fos/fos-icon.svg" alt="FOS logo" loading="lazy" width="17px"
height="8px">
<span class="uk-margin-small-left">Fields of Science (FoS)</span>
</span>
</a>
</div>
</a>
</div>
</div>
</div>
</div>
<div>
<div class="plugin-gateway-information uk-border-rounded uk-padding uk-margin-medium-bottom">
<img class="plugin-background" src="assets/common-assets/connect_image_faded.png">
<div class="plugin-content">
<div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom">
{{ pluginObject.title}}
</div>
<ng-container *ngIf="community">
<div *ngIf="isRouteEnabled('/curators') && isVisible('curators')"
class="uk-text-small uk-margin-xsmall-bottom">
<curators [longView]="false"></curators>
</div>
<div>
<div class="heroBackground generalSearchForm uk-border-rounded uk-padding uk-margin-medium-bottom">
<!-- <img class="plugin-background" src="assets/common-assets/connect_image_faded.png">-->
<div class="plugin-content">
<div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom">
{{ pluginObject.title}}
</div>
<div *ngIf="community.date && isVisible('date')" class="uk-text-small">
<span>Created: </span> {{community.date | date:'dd-MMM-yyyy'}}
</div>
<div class="uk-grid uk-grid-large uk-grid-stack uk-margin-top" uk-grid uk-height-match=".info-number">
<div>
<div *ngIf="projectTotal && projectTotal > 0 && isEntityEnabled('project')
<ng-container *ngIf="community">
<div *ngIf="isRouteEnabled('/curators') && isVisible('curators')"
class="uk-text-small uk-margin-xsmall-bottom">
<curators [longView]="false"></curators>
</div>
<div *ngIf="community.date && isVisible('date')" class="uk-text-small">
<span>Created: </span> {{community.date | date:'dd-MMM-yyyy'}}
</div>
<div class="uk-grid uk-grid-large uk-grid-stack uk-margin-top" uk-grid uk-height-match=".info-number">
<div>
<div *ngIf="projectTotal && projectTotal > 0 && isEntityEnabled('project')
&& isRouteEnabled(searchLinkToProjects) && isVisible('projects')"
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active"
[routerLink]="searchLinkToProjects">
{{projectTotal|number}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active"
[routerLink]="searchLinkToProjects">
{{projectTotal|number}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
Projects
<a *ngIf="projectsCalculated && (projectTotal && projectTotal > 0 && isEntityEnabled('project') && isRouteEnabled(searchLinkToProjects))"
[title]="buildProjectsTooltip()"
@ -94,16 +99,16 @@
[customClass]="'uk-text-muted'"></icon>
</a>
</span>
</div>
<div *ngIf="contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') &&
</div>
<div *ngIf="contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') &&
isRouteEnabled(searchLinkToDataProviders) && isVisible('datasources')"
class="uk-flex uk-flex-column info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active"
[routerLink]="searchLinkToDataProviders">
{{contentProviderTotal|number}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
class="uk-flex uk-flex-column info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active"
[routerLink]="searchLinkToDataProviders">
{{contentProviderTotal|number}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
Content Providers
<a *ngIf="contentProvidersCalculated && (contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') && isRouteEnabled(searchLinkToDataProviders))"
[title]="buildContentProvidersTooltip()"
@ -113,17 +118,17 @@
[customClass]="'uk-text-muted'"></icon>
</a>
</span>
</div>
</div>
</div>
<div>
<div *ngIf="(zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0) > 0) && isRouteEnabled(shareInZenodoPage)
<div>
<div *ngIf="(zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0) > 0) && isRouteEnabled(shareInZenodoPage)
&& isVisible('communities')"
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active" [routerLink]="shareInZenodoPage">
{{zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0)}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active" [routerLink]="shareInZenodoPage">
{{zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0)}}
</a>
<span class="uk-flex uk-flex-middle uk-text-small">
Linked Zenodo Communities
<a [title]="buildZenodoCommunitiesTooltip()"
[attr.uk-tooltip]="'pos: bottom-right; delay: 10;'"
@ -132,95 +137,98 @@
[customClass]="'uk-text-muted'"></icon>
</a>
</span>
</div>
<div
*ngIf="isRouteEnabled('/subjects') && displayedAllSubjects && displayedAllSubjects.length > 0 && isVisible('subjects')"
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove"
routerLinkActive="router-link-active" [routerLink]="'/subjects'">
{{displayedAllSubjects.length}}
</a>
<span class="uk-text-small">
</div>
<div
*ngIf="isRouteEnabled('/subjects') && displayedAllSubjects && displayedAllSubjects.length > 0 && isVisible('subjects')"
class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove"
routerLinkActive="router-link-active" [routerLink]="'/subjects'">
{{displayedAllSubjects.length}}
</a>
<span class="uk-text-small">
Subjects
</span>
</div>
</div>
</div>
</div>
</ng-container>
</div>
</ng-container>
</div>
</div>
<div *ngIf="community" class="plugin2 uk-flex uk-flex-middle uk-flex-wrap" style="grid-gap: 30px;">
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.publications > 0 && isEntityEnabled('publication')
</div>
<div *ngIf="community" class="plugin2 uk-flex uk-flex-middle uk-flex-wrap" style="grid-gap: 30px;">
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.publications > 0 && isEntityEnabled('publication')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('publications')">
<icon [name]="'description'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('publications')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<icon [name]="'description'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('publications')"
[routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.PUBLICATIONS}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.publications | numberRound: 1:1">
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.publications | numberRound: 1:1">
</span>
</a>
</div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
</a>
</div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('datasets')">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.DATASETS}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.datasets | numberRound: 1:1">
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.datasets | numberRound: 1:1">
</span>
</a>
</div>
<!--<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('datasets')">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true" [customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults" class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.DATASETS}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.datasets | numberRound: 1:1">
</span>
</a>
</div>-->
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.software > 0 && isEntityEnabled('software')
</a>
</div>
<!--<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('datasets')">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true" [customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults" class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.DATASETS}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.datasets | numberRound: 1:1">
</span>
</a>
</div>-->
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.software > 0 && isEntityEnabled('software')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('software')">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('software')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('software')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.SOFTWARE}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.software | numberRound: 1:1">
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.software | numberRound: 1:1">
</span>
</a>
</div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.other > 0 && isEntityEnabled('orp')
</a>
</div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.other > 0 && isEntityEnabled('orp')
&& isRouteEnabled(searchLinkToResults) &&
isVisible('other')">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('other')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('other')" [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall">
{{openaireEntities.OTHER}}
</span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.other | numberRound: 1:1">
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.other | numberRound: 1:1">
</span>
</a>
</a>
</div>
</div>
</div>
</div>

View File

@ -12,7 +12,7 @@ export class PluginOpenAIREProducts extends PluginBaseInfo{
@Component({
selector: 'plugin-openaire-products',
template: `
<div *ngIf="pluginObject">
<div *ngIf="pluginObject" class="uk-container uk-section">
<h3>{{pluginObject.title}} </h3>
<div *ngIf="services" uk-slider class="uk-slider">

View File

@ -1,7 +1,7 @@
<div *ngIf="pluginObject" #parent class="uk-section ">
<div class="uk-container uk-container-large uk-margin-large-bottom">
<div *ngIf="pluginObject" #parent class="heroBackground generalSearchForm ">
<div class="uk-section uk-container ">
<div class="uk-width-1-1 uk-margin-medium-bottom">
<h2 class="uk-margin-remove-top ">
<h2 class="uk-margin-remove-top uk-text-center ">
{{pluginObject.title}}<span class="uk-text-primary">.</span>
</h2>
</div>
@ -12,10 +12,10 @@
<ng-container *ngIf="card.show">
<slider-nav-item [start]="i">
<div class="uk-text-primary">{{card.tag}}</div>
<h5 class="uk-margin-remove">
<div class="uk-margin-remove uk-text-large uk-text-bold">
{{card.title}}
</h5>
<div>{{card.description}}</div>
</div>
<div class="uk-text-small">{{card.description}}</div>
</slider-nav-item>
</ng-container>
</ng-container>

View File

@ -1,3 +1,7 @@
//slider-column slider-nav-item .uk-active{
// border-left: solid 2px @primary-color;
//}
@slider-nav-item-background-active: white;
@slider-nav-item-action-background: rgba(255, 255, 255, 0.50);