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

[Library | explore-redesign]: Added/ updated how filters appear in mobile screens | Updated search forms. 

1. general.less: Added fixed position for .filters-toggle-button.
2. newSearchPage.component.html: Added floating button for filters in mobile screens.
3. advancedSearchForm.component.html: Re-introduced commented out <entities-selection> inside <advanced-search-input> | Removed iconPosition and commented button for filters inside search form.
4. home.module.ts: Imported SearchInputModule.
5. home.component.html: Replaced <advanced-search-input> with <div search-input>
6. searchDataProviders.component.ts: Set entitiesSelection to false for <new-search-page>
7. newSearchPage.component.ts & searchAll.component.html: Set entitiesSelection to false for <advanced-search-form>
This commit is contained in:
Konstantina Galouni 2023-05-08 17:10:51 +03:00
parent 2963589359
commit ef742be1b2
5 changed files with 25 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -15,7 +15,7 @@
[isDisabled]="disableForms" [isDisabled]="disableForms"
[simpleView]="true" [formPlaceholderText]="formPlaceholderText" [simpleView]="true" [formPlaceholderText]="formPlaceholderText"
[selectedFields]="selectedFields" [showSwitchSearchLink]="true" [dark]="searchForm.dark" [selectedFields]="selectedFields" [showSwitchSearchLink]="true" [dark]="searchForm.dark"
[fieldIdsMap]="fieldIdsMap" [fieldIds]="fieldIds" [entitiesSelection]="true" [customFilter]="customFilter" [fieldIdsMap]="fieldIdsMap" [fieldIds]="fieldIds" [entitiesSelection]="false" [customFilter]="customFilter"
> >
</advanced-search-form> </advanced-search-form>
</div> </div>

2
searchPages/searchDataProviders.component.ts
View File

@ -35,7 +35,7 @@ import {properties} from "../../../environments/environment";
[includeOnlyResultsAndFilter]="includeOnlyResultsAndFilter" [includeOnlyResultsAndFilter]="includeOnlyResultsAndFilter"
[piwikSiteId]=piwikSiteId [hasPrefix]="hasPrefix" [piwikSiteId]=piwikSiteId [hasPrefix]="hasPrefix"
[searchForm]="searchForm" [searchForm]="searchForm"
[entitiesSelection]="type=='all' || type == 'services'" [showSwitchSearchLink]="showSwitchSearchLink" [entitiesSelection]="false" [showSwitchSearchLink]="showSwitchSearchLink"
[filters]="filters" [filters]="filters"
[simpleView]="simpleView" formPlaceholderText="Search by name, description, subject..." [simpleView]="simpleView" formPlaceholderText="Search by name, description, subject..."
[showResultCount]="true" [showIndexInfo]="type!='deposit'" [showResultCount]="true" [showIndexInfo]="type!='deposit'"

26
searchPages/searchUtils/advancedSearchForm.component.html
View File

@ -164,28 +164,28 @@
<div class="uk-flex uk-flex-center uk-child-width-1-1"> <div class="uk-flex uk-flex-center uk-child-width-1-1">
<ng-container *ngIf="entitiesSelection"> <ng-container *ngIf="entitiesSelection">
<!-- [class.uk-hidden]="disableSelect" --> <!-- [class.uk-hidden]="disableSelect" -->
<advanced-search-input [dark]="dark" [iconPosition]="isMobile?'left':'right'" [disabled]="isDisabled" (searchEmitter)="simpleKeywordChanged()"> <advanced-search-input [dark]="dark" [disabled]="isDisabled" (searchEmitter)="simpleKeywordChanged()">
<!-- <entities-selection [simpleView]="true" [currentEntity]="entityType" <entities-selection [simpleView]="true" [currentEntity]="entityType"
(selectionChange)="simpleEntityChanged($event)" (disableSelectEmitter)="disableSelectChange($event)" (selectionChange)="simpleEntityChanged($event)" (disableSelectEmitter)="disableSelectChange($event)"
[onChangeNavigate]="true" [customFilter]="customFilter" class="uk-width-2-5"></entities-selection> --> [onChangeNavigate]="true" [customFilter]="customFilter" class="uk-width-2-5"></entities-selection> -->
<div class="uk-width-expand" input placeholder="Search in Explore" [searchable]="true" [hint]="formPlaceholderText" <div class="uk-width-expand" input placeholder="Search in Explore" [searchable]="true" [hint]="formPlaceholderText"
[(value)]="selectedFields[0].value" tooltip="true"></div> [(value)]="selectedFields[0].value" tooltip="true"></div>
<a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle> <!-- <a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>-->
<icon name="filters"></icon> <!-- <icon name="filters"></icon>-->
</a> <!-- </a>-->
</advanced-search-input> </advanced-search-input>
<div *ngIf="selectedFields[0] && disableSelect" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value" <div *ngIf="selectedFields[0] && disableSelect" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value"
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()" [iconPosition]="isMobile?'left':'right'"> [placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()">
<a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle> <!-- <a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>-->
<icon name="filters"></icon> <!-- <icon name="filters"></icon>-->
</a> <!-- </a>-->
</div> </div>
</ng-container> </ng-container>
<div *ngIf="selectedFields[0] && !entitiesSelection" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value" <div *ngIf="selectedFields[0] && !entitiesSelection" search-input [disabled]="isDisabled" [(value)]="selectedFields[0].value"
[placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()" [iconPosition]="isMobile?'left':'right'"> [placeholder]="formPlaceholderText" (searchEmitter)="simpleKeywordChanged()">
<a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle> <!-- <a *ngIf="isMobile" href="#mobile-filters" filters-toggle (click)="filtersClicked.emit(true)" uk-toggle>-->
<icon name="filters"></icon> <!-- <icon name="filters"></icon>-->
</a> <!-- </a>-->
</div> </div>
</div> </div>
</div> </div>

10
searchPages/searchUtils/newSearchPage.component.html
View File

@ -139,6 +139,14 @@
</div> </div>
</ng-template> </ng-template>
<ng-template #main let-mobile="mobile"> <ng-template #main let-mobile="mobile">
<div *ngIf="mobile" class="filters-toggle-button">
<button href="#mobile-filters" uk-toggle="target: #mobile-filters"
class="uk-icon-button uk-button-secondary uk-flex uk-flex-middle"
(click)="showOffCanvas = true" [disabled]="disabled" [class.uk-disabled]="disabled">
<icon name="filters" [flex]="true" ratio="1.2" visuallyHidden="filters"></icon>
</button>
</div>
<!-- TODO - Clean up --> <!-- TODO - Clean up -->
<div *ngIf="!includeOnlyResultsAndFilter" [class]="usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ? <div *ngIf="!includeOnlyResultsAndFilter" [class]="usedBy != 'deposit' && usedBy != 'orcid' && (!customFilter || customFilter.queryFieldName != 'communityId') ?
(stickyForm?'':' ') : (stickyForm?'':' ') :
@ -171,7 +179,7 @@
[advancedSearchLinkParameters]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)" [advancedSearchLinkParameters]="this.routerHelper.createQueryParams(this.parameterNames, this.parameterValues)"
[simpleView]="simpleView" [formPlaceholderText]="formPlaceholderText" [isMobile]="mobile" [simpleView]="simpleView" [formPlaceholderText]="formPlaceholderText" [isMobile]="mobile"
[resultTypes]="resultTypes" [quickFilter]="quickFilter" [entitiesSelection]="entitiesSelection" [resultTypes]="resultTypes" [quickFilter]="quickFilter" [entitiesSelection]="entitiesSelection"
[showSwitchSearchLink]="showSwitchSearchLink" [customFilter]="customFilter" (filtersClicked)="showOffCanvas = $event" [showSwitchSearchLink]="showSwitchSearchLink" [customFilter]="customFilter"
> >
</advanced-search-form> </advanced-search-form>
</div> </div>

2
searchPages/searchUtils/newSearchPage.component.ts
View File

@ -132,7 +132,7 @@ export class NewSearchPageComponent implements OnInit, OnDestroy, OnChanges {
public pageOptions: number[] = [5, 10, 20, 50]; public pageOptions: number[] = [5, 10, 20, 50];
@Input() basicMetaDescription = []; @Input() basicMetaDescription = [];
@Input() entitiesSelection: boolean = true; @Input() entitiesSelection: boolean = false;
@Input() showSwitchSearchLink: boolean = true; @Input() showSwitchSearchLink: boolean = true;
// on 1st load, do not show filters until results query returns. // on 1st load, do not show filters until results query returns.