[Library | new-theme]: In landing pages, title & tabs sticky even when bottom is in viewport | Other versions modals title updated | DMPs tab updated.

1. dataProvider.component.html & project.component.html & resultLanding.component.html: Removed "shouldSticky" check from id="main-tabs-div" - title & tabs sticky even when bottom is in viewport.
2. dataProvider.component.ts & organization.component.ts & project.component.ts & resultLanding.component.ts: Commented shouldSticky and observer for bottom - title & tabs sticky even when bottom is in viewport.
3. organization.component.ts & resultLanding.component.ts: In modal for other versions, title updated without "of".
4. project.component.html: In <search-tab> for DMPs added resultType="DMPs" | Title in DMPs tab changed to Data Management Plans.
5. search-tab.component.ts: Moved <errorMessages> after tab title and <ng-content> | In method "getEntityName()" return "this.resultType" if exists and no other condition matches.
This commit is contained in:
Konstantina Galouni 2022-05-06 16:31:40 +03:00
parent b851b3e60b
commit 84cb6b6d96
8 changed files with 57 additions and 54 deletions

View File

@ -127,7 +127,7 @@
</div>
<div id="main-tabs-div"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
uk-sticky="bottom: true; media: @m" [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

@ -127,7 +127,7 @@ export class DataProviderComponent {
public graph_height: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
// public shouldSticky: boolean = true;
subscriptions = [];
properties: EnvProperties = properties;
@ -191,16 +191,16 @@ 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) {
let observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.subscriptions.push(observer);
observer.observe(bottom);
}
// let bottom = document.getElementById('bottom');
// if(bottom) {
// let observer = new IntersectionObserver(entries => {
// entries.forEach(entry => {
// this.shouldSticky = !entry.isIntersecting;
// })
// });
// this.subscriptions.push(observer);
// observer.observe(bottom);
// }
if(this.graph_and_feedback) {
this.observeGraphAndFeedback();
}

View File

@ -107,7 +107,7 @@ export class OrganizationComponent {
public graph_height: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
// public shouldSticky: boolean = true;
subscriptions = [];
innerReportSubscriptions = [];
@ -191,16 +191,16 @@ export class OrganizationComponent {
ngAfterViewInit() {
if (typeof document !== 'undefined') {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--navbar-height'));
let bottom = document.getElementById('bottom');
if(bottom) {
let observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.subscriptions.push(observer);
observer.observe(bottom);
}
// let bottom = document.getElementById('bottom');
// if(bottom) {
// let observer = new IntersectionObserver(entries => {
// entries.forEach(entry => {
// this.shouldSticky = !entry.isIntersecting;
// })
// });
// this.subscriptions.push(observer);
// observer.observe(bottom);
// }
if(this.graph_and_feedback) {
this.observeGraphAndFeedback();
}
@ -652,7 +652,7 @@ export class OrganizationComponent {
this.deleteByInferenceOpened = true;
this.alertModalDeletedByInference.cancelButton = false;
this.alertModalDeletedByInference.okButton = false;
this.alertModalDeletedByInference.alertTitle = "Other versions of";
this.alertModalDeletedByInference.alertTitle = "Other versions";
this.alertModalDeletedByInference.open();
}

View File

@ -237,7 +237,7 @@
</div>
<div id="main-tabs-div"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
uk-sticky="bottom: true; media: @m" [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>
@ -346,8 +346,8 @@
</ng-container>
<ng-container>
<div id="dmps" class="landing-section uk-padding uk-padding-remove-horizontal">
<search-tab [fetch]="fetchDmps" customTitle="DMPs"
[properties]="properties">
<search-tab [fetch]="fetchDmps" customTitle="Data Management Plans"
[properties]="properties" resultType="DMPs">
<div class="uk-margin-medium-top uk-margin-bottom uk-width-1-1 uk-flex uk-flex-center uk-flex-middle">
<a *ngIf="fetchDmps.searchUtils.totalResults > 0" class="uk-button uk-button-text uk-margin-right"
[queryParams]="getParamsForSearchLink('publications', 'Data Management Plan')"

View File

@ -154,7 +154,7 @@ export class ProjectComponent {
public graph_height: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
// public shouldSticky: boolean = true;
subscriptions = [];
properties: EnvProperties;
@ -233,16 +233,16 @@ 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) {
let observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.subscriptions.push(observer);
observer.observe(bottom);
}
// let bottom = document.getElementById('bottom');
// if(bottom) {
// let observer = new IntersectionObserver(entries => {
// entries.forEach(entry => {
// this.shouldSticky = !entry.isIntersecting;
// })
// });
// this.subscriptions.push(observer);
// observer.observe(bottom);
// }
if(this.graph_and_feedback) {
this.observeGraphAndFeedback();
}

View File

@ -164,7 +164,7 @@
</div>
<div id="main-tabs-div"
[attr.uk-sticky]="shouldSticky ? 'bottom: true; media: @m': null" [attr.offset]="offset"
uk-sticky="bottom: true; media: @m" [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

@ -130,7 +130,7 @@ export class ResultLandingComponent {
public graph_height: number = 0;
@ViewChild("graph_and_feedback") graph_and_feedback;
public shouldSticky: boolean = true;
// public shouldSticky: boolean = true;
public viewAll: string = "";
public noCommunities: boolean = false;
@ -222,16 +222,16 @@ 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) {
let observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
this.shouldSticky = !entry.isIntersecting;
})
});
this.subscriptions.push(observer);
observer.observe(bottom);
}
// let bottom = document.getElementById('bottom');
// if(bottom) {
// let observer = new IntersectionObserver(entries => {
// entries.forEach(entry => {
// this.shouldSticky = !entry.isIntersecting;
// })
// });
// this.subscriptions.push(observer);
// observer.observe(bottom);
// }
if(this.graph_and_feedback) {
this.observeGraphAndFeedback();
}
@ -685,7 +685,7 @@ export class ResultLandingComponent {
this.deleteByInferenceOpened = true;
this.alertModalDeletedByInference.cancelButton = false;
this.alertModalDeletedByInference.okButton = false;
this.alertModalDeletedByInference.alertTitle = "Other versions of";
this.alertModalDeletedByInference.alertTitle = "Other versions";
this.alertModalDeletedByInference.open();
}

View File

@ -10,9 +10,6 @@ import {OpenaireEntities} from "../../properties/searchFields";
[queryParams]="params" [routerLink]="searchLinkToAdvancedPage"></a>
<ng-container *ngIf="fetch.searchUtils.status != errorCodes.LOADING">
<errorMessages *ngIf="resultType" [status]="[fetch.searchUtils.status]" [type]="getEntityName(resultType)"
tab_error_class=true></errorMessages>
<div class="uk-flex uk-flex-between uk-flex-middle uk-margin-bottom">
<div class="uk-text-meta uk-text-large uk-text-uppercase">
<span *ngIf="!customTitle && resultType"><span *ngIf="resultType != 'organization' && resultType != 'dataprovider' && resultType != 'project'">Recent</span>
@ -29,6 +26,10 @@ import {OpenaireEntities} from "../../properties/searchFields";
</div>
<ng-content></ng-content>
<errorMessages *ngIf="resultType" [status]="[fetch.searchUtils.status]" [type]="getEntityName(resultType)"
tab_error_class=true></errorMessages>
</ng-container>
<ng-container *ngIf="fetch.searchUtils.status == errorCodes.DONE">
@ -76,6 +77,8 @@ export class SearchTabComponent {
return OpenaireEntities.PROJECTS;
} else if (entityType == "dataprovider") {
return OpenaireEntities.DATASOURCES;
} else if (this.resultType) {
return this.resultType;
}
}
}