[Library | explore-redesign]: Bug fix in sticky tabs of search all | Updated formPlaceholderText of search form in search all - different for each entity | Search form not sticky in advanced search page.

1. searchAll.component.ts:
   a. [Bug fix] Subscribe to layoutService.isMobile and calculate there the "offset" (for sticky tabs).
   b. Updated "formPlaceholderText" - different for each entity.
2. newSearchPage.component.html: Added check, so that search form is not sticky in advanced search pages.

searchPages/find/searchAll.component.ts

@@ -32,12 +32,15 @@ import {SearchDataProvidersComponent} from "../searchDataProviders.component";
 import {NewSearchPageComponent, SearchForm} from "../searchUtils/newSearchPage.component";
 import {properties} from "../../../../environments/environment";
 import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
+import {LayoutService} from "../../dashboard/sharedComponents/sidebar/layout.service";
 
 @Component({
   selector: 'search-all',
   templateUrl: 'searchAll.component.html'
 })
 export class SearchAllComponent {
+  isMobile: boolean = false;
+
   reload:{result:boolean, projects:boolean, datasources: boolean, services: boolean, organizations:boolean} =
     {result:true, projects:true, datasources: true, services: true, organizations:true};
   public pageTitle = "Search in OpenAIRE"
@@ -86,7 +89,7 @@ export class SearchAllComponent {
   @Input() name;
   @Input() customFilter: SearchCustomFilter   = null;
   @Input() piwikSiteId = null;
-  @Input() formPlaceholderText = "What are you looking for?"
+  @Input() formPlaceholderText = "Search in Explore"
   // @Input() formPlaceholderText = "Search for "+OpenaireEntities.RESULTS+", "+OpenaireEntities.PROJECTS+", "+OpenaireEntities.DATASOURCES+" & "+OpenaireEntities.ORGANIZATIONS+" in OpenAIRE";
   @Input() searchForm: SearchForm = {class: 'search-form', dark: true}
   @Input() breadcrumbs: Breadcrumb[] = [];
@@ -127,6 +130,7 @@ export class SearchAllComponent {
               private _title: Title,
               private _piwikService: PiwikService,
               private config: ConfigurationService,
+              private layoutService: LayoutService,
               private seoService: SEOService, private router: Router, private cdr:ChangeDetectorRef) {
     this.fetchPublications = new FetchResearchResults(this._searchResearchResultsService);
     this.fetchDataproviders = new FetchDataproviders(this._searchDataprovidersService);
@@ -199,18 +203,19 @@ export class SearchAllComponent {
           this.loadAll();
         }
 
-  }
+    this.subs.push(this.layoutService.isMobile.subscribe(isMobile => {
+      this.isMobile = isMobile;
 
-  ngAfterViewInit() {
+      if (typeof document !== 'undefined') {
-    if (typeof document !== 'undefined') {
+        if(!this.isMobile && document.getElementById("main-menu")) {
-      if(document.getElementById("main-menu")) {
+          this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height'));
-        this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height'));
+          this.cdr.detectChanges();
-        this.cdr.detectChanges();
+        } else {
-      } else {
+          this.offset = 0;
-        this.offset = 0;
+          this.cdr.detectChanges();
-        this.cdr.detectChanges();
+        }
       }
-    }
+    }))
   }
 
   loadAll() {
@@ -302,6 +307,7 @@ export class SearchAllComponent {
       this.fetchPublications.searchUtils.status != this.errorCodes.NONE) {
       this.reload[this.activeEntity] = false;
       this.linkToSearchPublications = this.properties.searchLinkToPublications;// + "?keyword="  + this.keyword;
+      this.formPlaceholderText = "Search by title, author, abstract, DOI, orcid...";
     }
   }
 
@@ -312,6 +318,7 @@ export class SearchAllComponent {
       this.fetchProjects.searchUtils.status != this.errorCodes.NONE ) {
       this.reload[this.activeEntity]  = false;
       this.linkToSearchProjects = this.properties.searchLinkToProjects;// + "?keyword="  + this.keyword;
+      this.formPlaceholderText = "Search by title, acronym, project code...";
     }
   }
 
@@ -321,6 +328,7 @@ export class SearchAllComponent {
       this.fetchDataproviders.searchUtils.status != this.errorCodes.NONE) {
       this.reload[this.activeEntity] = false;
       this.linkToSearchDataproviders = this.properties.searchLinkToDataProviders;// + "?keyword="  + this.keyword;
+      this.formPlaceholderText = "Search by name, description, subject...";
     }
   }
 
@@ -330,6 +338,7 @@ export class SearchAllComponent {
       this.fetchServices.searchUtils.status != this.errorCodes.NONE) {
       this.reload[this.activeEntity] = false;
       this.linkToSearchDataproviders = this.properties.searchLinkToServices;// + "?keyword="  + this.keyword;
+      this.formPlaceholderText = "Search by name, description, subject...";
     }
   }
 
@@ -339,6 +348,7 @@ export class SearchAllComponent {
       this.fetchOrganizations.searchUtils.status != this.errorCodes.NONE) {
       this.reload[this.activeEntity] = false;
       this.linkToSearchOrganizations = this.properties.searchLinkToOrganizations;// + "?keyword="  + this.keyword;
+      this.formPlaceholderText = "Search by organization name...";
     }
   }
   private prepareKeywordParam(keyword){

searchPages/searchUtils/newSearchPage.component.html

@@ -182,7 +182,7 @@
 		(stickyForm?'':'  ') :
     (+ (stickyForm?'':' uk-section') +' uk-padding-remove-bottom  uk-padding-remove-top ' +
     ((usedBy == 'deposit' || usedBy == 'orcid') ? ' uk-padding-remove-top ' : ' '))"
-       [attr.uk-sticky]="((stickyForm || mobile)?'{offset:100;top:90;cls-active:uk-active uk-sticky-below;cls-inactive:uk-sticky '+
+       [attr.uk-sticky]="((stickyForm || (simpleView && mobile))?'{offset:100;top:90;cls-active:uk-active uk-sticky-below;cls-inactive:uk-sticky '+
 		(usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
     '  uk-position-relative ' :(' uk-section '  ))+'}':null)">
     <div class="uk-background-norepeat uk-background-bottom-center" [ngClass]="searchForm.class">