Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme

This commit is contained in:
Konstantinos Triantafyllou 2022-05-05 10:42:51 +03:00
commit 58edff9177
14 changed files with 193 additions and 150 deletions

View File

@ -49,9 +49,9 @@
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2 graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="uk-text-primary">OpenAIRE Research Graph</a>
</span>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span><a href="https://graph.openaire.eu" target="_blank">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
@ -125,7 +125,7 @@
</div>
<div id="main-tabs-div"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<showTitle *ngIf="stickyHeader" [titleName]="dataProviderInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>

View File

@ -124,6 +124,9 @@ export class DataProviderComponent {
public graph_offset: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
private observer: IntersectionObserver;
subscriptions = [];
properties: EnvProperties = properties;
public openaireEntities = OpenaireEntities;
@ -185,6 +188,15 @@ export class DataProviderComponent {
ngAfterViewInit() {
if (typeof document !== 'undefined') {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--navbar-height'));
let bottom = document.getElementById('bottom');
if(bottom) {
this.observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.observer.observe(bottom);
}
}
}
@ -242,6 +254,10 @@ export class DataProviderComponent {
this.fetchPublications.clearSubscriptions();
this.fetchDataproviders.clearSubscriptions();
this.fetchProjects.clearSubscriptions();
if(this.observer) {
this.observer.disconnect();
}
}
private getDataProviderInfo(id: string) {

View File

@ -153,8 +153,6 @@ export class DataProviderService {
}
}
console.log(this.dataProviderInfo.provenance);
this.dataProviderInfo.subjects = [];
length = Array.isArray(data[0]['subjects']) ? data[0]['subjects'].length : 1;
for(let i=0; i<length; i++) {

View File

@ -20,13 +20,15 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
<div class="uk-padding uk-padding-remove-top">
<div class="uk-card uk-card-default uk-card-body">
<div *ngIf=" properties && !properties.useNewStatistisTool" class="uk-text-center uk-text-large">Produced {{openaireEntities.RESULTS}} per year</div>
<i-frame [url]=docsTimelineUrl ></i-frame>
<i-frame [url]=docsTimelineUrl
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply"></i-frame>
</div>
</div>
<div class="uk-padding uk-padding-remove-top">
<div class="uk-card uk-card-default uk-card-body">
<div *ngIf=" properties && !properties.useNewStatistisTool" class="uk-text-center uk-text-large">{{openaireEntities.RESULTS}} Types</div>
<i-frame [url]=docsTypesUrl ></i-frame>
<i-frame [url]=docsTypesUrl
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply"></i-frame>
</div>
</div>
<!-- </ng-container>-->
@ -36,7 +38,8 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
<div class="uk-padding uk-padding-remove-top">
<div class="uk-card uk-card-default uk-card-body">
<div *ngIf=" properties && !properties.useNewStatistisTool" class="uk-text-center uk-text-large">{{openaireEntities.RESULTS}} per funder</div>
<i-frame [url]=docsFunderUrl ></i-frame>
<i-frame [url]=docsFunderUrl
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply"></i-frame>
</div>
</div>
@ -44,7 +47,8 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
class="uk-padding uk-padding-remove-top">
<div class="uk-card uk-card-default uk-card-body">
<div *ngIf=" properties && !properties.useNewStatistisTool" class="uk-text-center uk-text-large">{{openaireEntities.PROJECTS}} with most {{openaireEntities.PUBLICATIONS}}</div>
<i-frame [url]=pubsProjectsUrl ></i-frame>
<i-frame [url]=pubsProjectsUrl
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply"></i-frame>
</div>
</div>
@ -52,7 +56,8 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
class="uk-padding uk-padding-remove-top">
<div class="uk-card uk-card-default uk-card-body">
<div *ngIf=" properties && !properties.useNewStatistisTool" class="uk-text-center uk-text-large">{{openaireEntities.PROJECTS}} with most {{openaireEntities.DATASETS}}</div>
<i-frame [url]=dataProjectsUrl></i-frame>
<i-frame [url]=dataProjectsUrl
customContainerClass="uk-background-default" customIframeClass="uk-blend-multiply"></i-frame>
</div>
</div>
</div>

View File

@ -116,7 +116,7 @@ import {OpenaireEntities} from "../../../utils/properties/searchFields";
</div>
</div>
<div class="uk-flex uk-flex-center uk-flex-middle">
<span class="uk-margin-small-right">Powered by</span>
<span class="uk-margin-small-right uk-text-small uk-text-meta">Powered by</span>
<a href="https://usagecounts.openaire.eu" target="_blank">
<img width="120" src="assets/common-assets/logo-large-usage-counts.png" loading="lazy" alt="usage counts">
</a>

View File

@ -21,21 +21,11 @@
</span>
</a>
</li>
<!-- Download content lists -->
<!-- Download -->
<li class="uk-text-center"
[title]="'Download content lists'"
[title]="'Download reports'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon>
</span>
</a>
</li>
<!-- Download project lists -->
<li class="uk-text-center"
[title]="'Download project lists'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadFunderReportModal()">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon>
</span>
@ -53,8 +43,8 @@
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2 graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="uk-text-primary">OpenAIRE Research Graph</a>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span><a href="https://graph.openaire.eu" target="_blank">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
@ -113,28 +103,28 @@
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>
<my-tabs (selectedActiveTab)="onSelectActiveTab($event)" [offsetForSticky]="offset" [(isSticky)]="stickyHeader">
<my-tab [active]="true" [tabTitle]="'Funding / Projects'" [tabId]="'projects'"
<my-tab [active]="true" [tabTitle]="'Funding / ' +openaireEntities.PROJECTS" [tabId]="'projects'"
[tabNumber]="fetchProjects.searchUtils.totalResults > 0 ? fetchProjects.searchUtils.totalResults : ''">
</my-tab>
<my-tab *ngIf="fetchDataproviders && fetchDataproviders.searchUtils.totalResults > 0"
[tabTitle]="'Content Providers'" [tabId]="'dataProviders'"
[tabTitle]="openaireEntities.DATASOURCES" [tabId]="'dataProviders'"
[tabNumber]="fetchDataproviders.searchUtils.totalResults">
</my-tab>
<my-tab *ngIf="fetchPublications && fetchPublications.searchUtils.totalResults > 0"
[tabNumber]="fetchPublications.searchUtils.totalResults"
[tabTitle]="'Publications'" [tabId]="'publications'">
[tabTitle]="openaireEntities.PUBLICATIONS" [tabId]="'publications'">
</my-tab>
<my-tab *ngIf="fetchDatasets && fetchDatasets.searchUtils.totalResults > 0"
[tabNumber]="fetchDatasets.searchUtils.totalResults"
[tabTitle]="'Research Data'" [tabId]="'datasets'">
[tabTitle]="openaireEntities.DATASETS" [tabId]="'datasets'">
</my-tab>
<my-tab *ngIf="fetchSoftware && fetchSoftware.searchUtils.totalResults > 0"
[tabNumber]="fetchSoftware.searchUtils.totalResults"
[tabTitle]="'Software'" [tabId]="'software'">
[tabTitle]="openaireEntities.SOFTWARE" [tabId]="'software'">
</my-tab>
<my-tab *ngIf="fetchOrps && fetchOrps.searchUtils.totalResults > 0"
[tabNumber]="fetchOrps.searchUtils.totalResults"
[tabTitle]="'Other Research'" [tabId]="'other'">
[tabTitle]="openaireEntities.OTHER" [tabId]="'other'">
</my-tab>
</my-tabs>
</div>
@ -187,6 +177,13 @@
</search-tab>
</div>
</div>
<div class="uk-text-xsmall uk-hidden@m">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div>
<!-- Helper -->
<helper *ngIf="pageContents && pageContents['bottom'] && pageContents['bottom'].length > 0"
[texts]="pageContents['bottom']">
</helper>
</div>
</div>
</div>
@ -212,89 +209,93 @@
<modal-alert #addThisModal classBody="uk-flex uk-flex-center uk-flex-middle">
<addThis></addThis>
</modal-alert>
<!-- Download content lists -->
<modal-alert #downloadReportModal>
<!-- Download -->
<modal-alert #downloadReportsModal large="true">
<div class="uk-padding-small uk-margin-small-left uk-margin-small-right">
<div class="uk-padding-small uk-padding-remove-vertical">
<div class="uk-animation-slide-top-small">
<ul class="uk-list uk-margin-remove-bottom" *ngIf="total > 0">
<li [attr.uk-tooltip]="total > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="total > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('results'), 'results' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
all research outcomes (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchPublications.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchPublications.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('publications'), 'publications' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
publications (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchDatasets.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchDatasets.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('datasets'), 'datasets' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
research data (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchSoftware.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchSoftware.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('software'), 'software' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
software (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchOrps.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchOrps.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('other'), 'other' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
other research products (CSV)
</div>
</li>
</ul>
<div *ngIf="total == 0" class="uk-text-muted">
No reports available
</div>
</div>
</div>
</div>
</modal-alert>
<!-- Download project lists -->
<modal-alert #downloadFunderReportModal>
<div class="uk-padding-small uk-margin-small-left uk-margin-small-right">
<div class="uk-padding-small uk-padding-remove-vertical" *ngIf="fetchProjects.funders && fetchProjects.funders.length > 0">
<div input type="select" placeholder="Select a funder to download report" inputClass="flat x-small"
[options]="fetchProjects.funders" [(value)]="funder"></div>
<div class="uk-animation-slide-top-small uk-margin-medium-top" *ngIf="funder && funder != ''">
<ul class="uk-list uk-margin-remove-bottom">
<li>
<div class="uk-grid uk-grid-divider uk-child-width-1-2@m" uk-grid uk-height-match=".subtitle">
<div class="uk-animation-slide-top-small">
<div class="subtitle">
<span class="uk-text-nowrap">Content report</span>
</div>
<ul class="uk-list uk-margin-remove-bottom" *ngIf="total > 0">
<li [attr.uk-tooltip]="total > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
(click)="downloadFile(getFunderProjects(), funder.name + '-projects-report')">
[class]="total > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('results'), 'results' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
projects (CSV)
all {{openaireEntities.RESULTS}} (CSV)
</div>
</li>
<li *ngFor="let contentType of contentTypes">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
(click)="confirmOpenApplyAll(contentType[0])">
<li [attr.uk-tooltip]="fetchPublications.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchPublications.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('publications'), 'publications' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{contentType[1]}} (CSV)
{{openaireEntities.PUBLICATIONS}} (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchDatasets.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchDatasets.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('datasets'), 'datasets' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{openaireEntities.DATASETS}} (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchSoftware.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchSoftware.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('software'), 'software' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{openaireEntities.SOFTWARE}} (CSV)
</div>
</li>
<li [attr.uk-tooltip]="fetchOrps.searchUtils.totalResults > 0 ? 'cls: uk-invisible' : 'cls: uk-active'"
title="No report available">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
[class]="fetchOrps.searchUtils.totalResults > 0 ? '' : 'uk-disabled uk-text-muted'"
(click)="downloadFile(getCSVAffiliated('other'), 'other' + '-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{openaireEntities.OTHER}} (CSV)
</div>
</li>
</ul>
<div *ngIf="total == 0" class="uk-text-muted">
No reports available
</div>
</div>
<div *ngIf="fetchProjects.funders && fetchProjects.funders.length > 0">
<div class="subtitle uk-flex uk-flex-middle">
<span class="uk-text-nowrap">Funder report</span>
<div input type="select" placeholder="Select a funder to download report" inputClass="flat x-small" class="uk-width-1-1 uk-margin-small-left"
[options]="fetchProjects.funders" [(value)]="funder">
</div>
</div>
<div class="uk-animation-slide-top-small uk-margin-top" *ngIf="funder && funder != ''">
<ul class="uk-list uk-margin-remove-bottom">
<li>
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
(click)="downloadFile(getFunderProjects(), funder.name + '-projects-report')">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{openaireEntities.PROJECTS}} (CSV)
</div>
</li>
<li *ngFor="let contentType of contentTypes">
<div class="uk-flex uk-flex-middle uk-button uk-button-link uk-text-normal"
(click)="confirmOpenApplyAll(contentType[0])">
<icon name="download" flex="true" class="uk-margin-small-right"></icon>
{{contentType[1]}} (CSV)
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</modal-alert>

View File

@ -24,6 +24,7 @@ import {FetchDataproviders} from "../../utils/fetchEntitiesClasses/fetchDataprov
import {IndexInfoService} from "../../utils/indexInfo.service";
import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment";
import {OpenaireEntities} from '../../utils/properties/searchFields';
@Component({
selector: 'organization',
@ -52,7 +53,7 @@ export class OrganizationComponent {
public fetchDatasets: FetchResearchResults;
public fetchSoftware: FetchResearchResults;
public fetchOrps: FetchResearchResults;
public fetchDataproviders: FetchDataproviders
public fetchDataproviders: FetchDataproviders;
public searchNumber: number = 5;
// Request results of each tab only the one time (first time tab is clicked)
@ -64,7 +65,8 @@ export class OrganizationComponent {
// Active tab variable for responsiveness
public activeTab: string = "";
@ViewChild('downloadReportsModal') downloadReportsModal;
@ViewChild('downloadReportModal') downloadReportModal;
@ViewChild('downloadFunderReportModal') downloadFunderReportModal;
@ViewChild('addThisModal') addThisModal;
@ -82,11 +84,11 @@ export class OrganizationComponent {
// Helper variables to specify funder in downloadPublicationsFile function
public contentTypes: [string, string][] = [
['results', 'all research outcomes'],
['publications', 'publications'],
['datasets', 'research data'],
['software', 'software'],
['other', 'other research products'],
['results', 'all ' + OpenaireEntities.RESULTS],
['publications', OpenaireEntities.PUBLICATIONS],
['datasets', OpenaireEntities.DATASETS],
['software', OpenaireEntities.SOFTWARE],
['other', OpenaireEntities.OTHER],
];
public funderContentType: string = '';
public funder: any = "";
@ -101,6 +103,7 @@ export class OrganizationComponent {
subscriptions = [];
innerReportSubscriptions = [];
properties: EnvProperties;
public openaireEntities = OpenaireEntities
public indexUpdateDate: Date;
public showFeedback: boolean = false;
public feedbackFields: string [] = ['Name', 'Country', 'Other'];
@ -545,8 +548,7 @@ export class OrganizationComponent {
}
private openLoading() {
this.closeDownloadReportModal();
this.closeDownloadFunderReportModal();
this.closeDownloadReportsModal();
if (this.loading) {
this.loading.open();
@ -626,27 +628,16 @@ export class OrganizationComponent {
console.log(value);
}
openDownloadReportModal() {
this.downloadReportModal.cancelButton = false;
this.downloadReportModal.okButton = false;
this.downloadReportModal.alertTitle = "Download content report";
this.downloadReportModal.open();
}
openDownloadReportsModal() {
this.funder = this.fetchProjects.funders[0];
this.downloadReportsModal.cancelButton = false;
this.downloadReportsModal.okButton = false;
this.downloadReportsModal.alertTitle = "Download";
this.downloadReportsModal.open();
}
closeDownloadReportModal() {
this.downloadReportModal.cancel();
}
openDownloadFunderReportModal() {
this.funder = this.fetchProjects.funders[0];
this.downloadFunderReportModal.cancelButton = false;
this.downloadFunderReportModal.okButton = false;
this.downloadFunderReportModal.alertTitle = "Download funder report";
this.downloadFunderReportModal.open();
}
closeDownloadFunderReportModal() {
this.downloadFunderReportModal.cancel();
closeDownloadReportsModal() {
this.downloadReportsModal.cancel();
}
public openAddThisModal() {

View File

@ -88,9 +88,9 @@
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2 graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="uk-text-primary">OpenAIRE Research Graph</a>
</span>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span><a href="https://graph.openaire.eu" target="_blank">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
@ -235,7 +235,7 @@
</div>
<div id="main-tabs-div"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>

View File

@ -151,6 +151,9 @@ export class ProjectComponent {
public graph_offset: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
private observer: IntersectionObserver;
subscriptions = [];
properties: EnvProperties;
public openaireEntities = OpenaireEntities;
@ -227,6 +230,15 @@ export class ProjectComponent {
ngAfterViewInit() {
if (typeof document !== 'undefined') {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--navbar-height'));
let bottom = document.getElementById('bottom');
if(bottom) {
this.observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.observer.observe(bottom);
}
}
}
@ -314,6 +326,10 @@ export class ProjectComponent {
this.fetchSoftware.clearSubscriptions();
this.fetchOrps.clearSubscriptions();
this.fetchDmps.clearSubscriptions();
if(this.observer) {
this.observer.disconnect();
}
}
private createClipboard() {

View File

@ -78,9 +78,9 @@
<!-- Last Index Info-->
<div class="uk-width-2-3@m uk-width-1-2 graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-meta">
Powered by <a href="https://graph.openaire.eu" target="_blank" class="uk-text-primary">OpenAIRE Research Graph</a>
</span>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span><a href="https://graph.openaire.eu" target="_blank">OpenAIRE Research Graph</a>
</span>
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-meta">
. Last update of records in OpenAIRE: {{indexUpdateDate | date: 'MMM dd, yyyy'}}
</span>
@ -160,7 +160,7 @@
</div>
<div id="main-tabs-div"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<showTitle *ngIf="stickyHeader" [titleName]="resultLandingInfo.title" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>

View File

@ -1,4 +1,4 @@
import {ChangeDetectorRef, Component, Input, ViewChild} from '@angular/core';
import {ChangeDetectorRef, Component, EventEmitter, Input, Output, ViewChild} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router';
import {Meta, Title} from '@angular/platform-browser';
@ -129,6 +129,9 @@ export class ResultLandingComponent {
public graph_offset: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
private observer: IntersectionObserver;
public viewAll: string = "";
public noCommunities: boolean = false;
@ -219,6 +222,15 @@ export class ResultLandingComponent {
ngAfterViewInit() {
if (typeof document !== 'undefined') {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--navbar-height'));
let bottom = document.getElementById('bottom');
if(bottom) {
this.observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.observer.observe(bottom);
}
}
}
@ -290,6 +302,9 @@ export class ResultLandingComponent {
}
});
this._vocabulariesService.clearSubscriptions();
if(this.observer) {
this.observer.disconnect();
}
}
public pidInit(event) {

View File

@ -155,7 +155,7 @@
</div>
<schema2jsonld *ngIf="url" [URL]="url" type="search" [name]=pageTitleWithFilters
[searchAction]=false [description]="metaDescription"></schema2jsonld>
<div id="tm-main" class="uk-margin-large-top" [class.uk-margin-top]="stickyForm">
<div id="tm-main" class="uk-margin-medium-top" [class.uk-margin-top]="stickyForm">
<ng-template #loading>
<loading></loading>
</ng-template>
@ -211,7 +211,7 @@
search
</a>
</div>
<div class="uk-grid uk-margin-medium-top uk-margin-large-bottom" uk-grid>
<div class="uk-grid uk-margin-large-top uk-margin-large-bottom" uk-grid>
<div *ngIf="showRefine && (results.length > 0
|| (searchUtils.refineStatus == errorCodes.LOADING && searchUtils.status != errorCodes.LOADING)
|| (!hideFilters &&
@ -340,8 +340,9 @@
<!-- Last Index Info-->
<div class="graph">
<icon name="graph" customClass="uk-text-primary"></icon>
<span class="uk-margin-small-left uk-text-baseline uk-text-muted">
Powered by <a href="https://graph.openaire.eu" class="uk-link">OpenAIRE Research Graph</a></span>
<span class="uk-margin-small-left uk-text-baseline">
<span class="uk-text-meta">Powered by </span><a href="https://graph.openaire.eu" target="_blank">OpenAIRE Research Graph</a>
</span>
</div>
<div class="uk-text-right">
<span *ngIf="indexUpdateDate" class="uk-text-baseline uk-text-muted">

View File

@ -11,7 +11,7 @@ import {OpenaireEntities} from "../../utils/properties/searchFields";
@Component({
selector: 'quick-selections',
template: `
<div *ngIf="quickFilter" class="uk-margin-small-bottom">
<div *ngIf="quickFilter" class="uk-margin-bottom">
<mat-slide-toggle name="qf" [(ngModel)]="quickFilter.selected" (ngModelChange)="quickFilterChanged()">
<span class="uk-text-bold">{{quickFilter.value}}</span>
</mat-slide-toggle>

View File

@ -85,8 +85,8 @@ import {properties} from "../../../../environments/environment";
</a>
</span>
</div>
<div *ngIf="viewAll && lessBtn" (click)="viewAll = !viewAll; lessBtn=false;" class="uk-width-1-1 uk-text-right uk-text-small">
<a>View less authors</a>
<div *ngIf="viewAll && lessBtn" class="uk-width-1-1 uk-text-right uk-text-small">
<a (click)="viewAll = !viewAll; lessBtn=false;">View less authors</a>
</div>
<modal-alert #authorsModal>