MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

search page: make tabs (entities) sticky on scroll

This commit is contained in:
Alex Martzios 2023-05-11 12:42:28 +03:00
parent aca0de0fc1
commit cf42f3a122
2 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
searchPages/find/searchAll.component.html
View File

@ -27,8 +27,9 @@
<schema2jsonld *ngIf="name && logoURL" [URL]="properties.domain+ properties.baseLink +'/search/find'" <schema2jsonld *ngIf="name && logoURL" [URL]="properties.domain+ properties.baseLink +'/search/find'"
[logoURL]="properties.domain + properties.baseLink+logoURL" type="search" [name]=name [logoURL]="properties.domain + properties.baseLink+logoURL" type="search" [name]=name
description="Search for {{openaireEntities.RESULTS}} ({{openaireEntities.PUBLICATIONS}}, {{openaireEntities.DATASETS}}, {{openaireEntities.SOFTWARE}}, {{openaireEntities.OTHER}}), {{openaireEntities.PROJECTS}}, {{openaireEntities.ORGANIZATIONS}}, {{openaireEntities.DATASOURCES}} in the OpenAIRE Research Graph. "></schema2jsonld> description="Search for {{openaireEntities.RESULTS}} ({{openaireEntities.PUBLICATIONS}}, {{openaireEntities.DATASETS}}, {{openaireEntities.SOFTWARE}}, {{openaireEntities.OTHER}}), {{openaireEntities.PROJECTS}}, {{openaireEntities.ORGANIZATIONS}}, {{openaireEntities.DATASOURCES}} in the OpenAIRE Research Graph. "></schema2jsonld>
<div class="uk-container-large uk-container uk-margin-large-top uk-margin-medium-bottom"> <div class="uk-container-large uk-container uk-margin-medium-top uk-margin-medium-bottom">
<div class="uk-width-1-1" uk-slider="finite: true"> <div class="uk-width-1-1 uk-background-default uk-padding-small uk-padding-remove-bottom uk-padding-remove-horizontal"
uk-slider="finite: true" uk-sticky="media: @m" [attr.offset]="offset">
<div class="uk-position-relative"> <div class="uk-position-relative">
<div class="uk-slider-container"> <div class="uk-slider-container">
<ul class="uk-slider-items uk-flex uk-flex-center" style="flex-wrap: nowrap !important;"> <ul class="uk-slider-items uk-flex uk-flex-center" style="flex-wrap: nowrap !important;">

14
searchPages/find/searchAll.component.ts
View File

@ -80,6 +80,7 @@ export class SearchAllComponent {
showOrganizations: boolean = false; showOrganizations: boolean = false;
advancedSearchLink: string = "/search/advanced/publications"; advancedSearchLink: string = "/search/advanced/publications";
properties: EnvProperties; properties: EnvProperties;
offset: number;
public openaireEntities = OpenaireEntities; public openaireEntities = OpenaireEntities;
@Input() logoURL; @Input() logoURL;
@Input() name; @Input() name;
@ -142,7 +143,6 @@ export class SearchAllComponent {
public ngOnInit() { public ngOnInit() {
var description = "Search for "+OpenaireEntities.RESULTS+" ("+OpenaireEntities.PUBLICATIONS+", "+OpenaireEntities.DATASETS+", "+OpenaireEntities.SOFTWARE+", "+OpenaireEntities.OTHER+"), "+OpenaireEntities.PROJECTS+", "+OpenaireEntities.ORGANIZATIONS+", "+OpenaireEntities.DATASOURCES+" in the OpenAIRE Research Graph. "; var description = "Search for "+OpenaireEntities.RESULTS+" ("+OpenaireEntities.PUBLICATIONS+", "+OpenaireEntities.DATASETS+", "+OpenaireEntities.SOFTWARE+", "+OpenaireEntities.OTHER+"), "+OpenaireEntities.PROJECTS+", "+OpenaireEntities.ORGANIZATIONS+", "+OpenaireEntities.DATASOURCES+" in the OpenAIRE Research Graph. ";
var title = "OpenAIRE |Search for "+OpenaireEntities.RESULTS+", "+OpenaireEntities.PROJECTS+", "+OpenaireEntities.DATASOURCES+" & "+OpenaireEntities.ORGANIZATIONS; var title = "OpenAIRE |Search for "+OpenaireEntities.RESULTS+", "+OpenaireEntities.PROJECTS+", "+OpenaireEntities.DATASOURCES+" & "+OpenaireEntities.ORGANIZATIONS;
this.properties = properties; this.properties = properties;
@ -201,6 +201,18 @@ export class SearchAllComponent {
} }
ngAfterViewInit() {
if (typeof document !== 'undefined') {
if(document.getElementById("main-menu")) {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height'));
this.cdr.detectChanges();
} else {
this.offset = 0;
this.cdr.detectChanges();
}
}
}
loadAll() { loadAll() {
this.reloadTabs(); this.reloadTabs();
this.subs.push(this.route.queryParams.subscribe(queryParams => { this.subs.push(this.route.queryParams.subscribe(queryParams => {