hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 10:04:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

add loading indicator to infinite scroll, few style tweaks

Browse Source
This commit is contained in:
Art Lowel
2020-10-30 13:36:39 +01:00
parent 18577f016c
commit 48c7fff930
15 changed files with 52 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/core/shared/context.model.ts
View File

@@ -14,4 +14,5 @@ export enum Context {
AdminSearch = 'adminSearch',
AdminWorkflowSearch = 'adminWorkflowSearch',
SideBarSearchModal = 'sideBarSearchModal',
SideBarSearchModalCurrent = 'sideBarSearchModalCurrent',
}

1
src/app/entity-groups/journal-entities/item-list-elements/sidebar-search-list-elements/journal-issue/journal-issue-sidebar-search-list-element.component.ts
View File

@@ -8,6 +8,7 @@ import { Item } from '../../../../../core/shared/item.model';
import { isNotEmpty } from '../../../../../shared/empty.util';
@listableObjectComponent('JournalIssueSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('JournalIssueSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-journal-issue-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

1
src/app/entity-groups/journal-entities/item-list-elements/sidebar-search-list-elements/journal-volume/journal-volume-sidebar-search-list-element.component.ts
View File

@@ -8,6 +8,7 @@ import { Item } from '../../../../../core/shared/item.model';
import { isNotEmpty } from '../../../../../shared/empty.util';
@listableObjectComponent('JournalVolumeSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('JournalVolumeSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-journal-volume-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

1
src/app/entity-groups/journal-entities/item-list-elements/sidebar-search-list-elements/journal/journal-sidebar-search-list-element.component.ts
View File

@@ -8,6 +8,7 @@ import { Item } from '../../../../../core/shared/item.model';
import { isNotEmpty } from '../../../../../shared/empty.util';
@listableObjectComponent('JournalSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('JournalSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-journal-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

1
src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/org-unit/org-unit-sidebar-search-list-element.component.ts
View File

@@ -8,6 +8,7 @@ import { Item } from '../../../../../core/shared/item.model';
import { isNotEmpty } from '../../../../../shared/empty.util';
@listableObjectComponent('OrgUnitSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('OrgUnitSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-org-unit-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

1
src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/person/person-sidebar-search-list-element.component.ts
View File

@@ -11,6 +11,7 @@ import { LinkService } from '../../../../../core/cache/builders/link.service';
import { TranslateService } from '@ngx-translate/core';
@listableObjectComponent('PersonSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('PersonSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-person-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

1
src/app/entity-groups/research-entities/item-list-elements/sidebar-search-list-elements/project/project-sidebar-search-list-element.component.ts
View File

@@ -8,6 +8,7 @@ import { Item } from '../../../../../core/shared/item.model';
import { isNotEmpty } from '../../../../../shared/empty.util';
@listableObjectComponent('ProjectSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('ProjectSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-project-sidebar-search-list-element',
templateUrl: '../../../../../shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html'

8
src/app/shared/dso-selector/dso-selector/dso-selector.component.html
View File

@@ -20,11 +20,15 @@
</button>
<button *ngFor="let listEntry of listEntries"
class="list-group-item list-group-item-action border-0 list-entry"
[ngClass]="{'current': listEntry.indexableObject.id === currentDSOId}"
[ngClass]="{'bg-primary': listEntry.indexableObject.id === currentDSOId}"
title="{{ listEntry.indexableObject.name }}"
(click)="onSelect.emit(listEntry.indexableObject)" #listEntryElement>
<ds-listable-object-component-loader [object]="listEntry" [viewMode]="viewMode"
[linkType]=linkTypes.None [context]="context"></ds-listable-object-component-loader>
[linkType]=linkTypes.None [context]="getContext(listEntry.indexableObject.id)"></ds-listable-object-component-loader>
</button>
<button *ngIf="hasNextPage"
class="list-group-item list-group-item-action border-0 list-entry">
<ds-loading [showMessage]="false"></ds-loading>
</button>
</div>
</div>

9
src/app/shared/dso-selector/dso-selector/dso-selector.component.scss
View File

@@ -1,12 +1,5 @@
.scrollable-menu {
height: auto;
max-height: $dso-selector-list-max-height;
max-height: min(70vh, 475px);
overflow-x: hidden;
}
.current {
background-color: $dso-selector-current-background-color;
&:hover {
background-color: $dso-selector-current-background-hover-color;
}
}

16
src/app/shared/dso-selector/dso-selector/dso-selector.component.ts
View File

@@ -107,11 +107,6 @@ export class DSOSelectorComponent implements OnInit, OnDestroy {
*/
linkTypes = CollectionElementLinkType;
/**
* This component's context to display listable objects for
*/
context = Context.SideBarSearchModal;
/**
* Array to track all subscriptions and unsubscribe them onDestroy
* @type {Array}
@@ -212,6 +207,17 @@ export class DSOSelectorComponent implements OnInit, OnDestroy {
}
}
/**
* Get the context for element with the given id
*/
getContext(id: string) {
if (id === this.currentDSOId) {
return Context.SideBarSearchModalCurrent;
} else {
return Context.SideBarSearchModal;
}
}
/**
* Unsubscribe from all subscriptions
*/

1
src/app/shared/object-list/sidebar-search-list-element/collection/collection-sidebar-search-list-element.component.ts
View File

@@ -7,6 +7,7 @@ import { ViewMode } from '../../../../core/shared/view-mode.model';
import { SidebarSearchListElementComponent } from '../sidebar-search-list-element.component';
@listableObjectComponent(CollectionSearchResult, ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent(CollectionSearchResult, ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-collection-sidebar-search-list-element',
templateUrl: '../sidebar-search-list-element.component.html'

1
src/app/shared/object-list/sidebar-search-list-element/community/community-sidebar-search-list-element.component.ts
View File

@@ -7,6 +7,7 @@ import { CommunitySearchResult } from '../../../object-collection/shared/communi
import { Community } from '../../../../core/shared/community.model';
@listableObjectComponent(CommunitySearchResult, ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent(CommunitySearchResult, ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-collection-sidebar-search-list-element',
templateUrl: '../sidebar-search-list-element.component.html'

2
src/app/shared/object-list/sidebar-search-list-element/item-types/publication/publication-sidebar-search-list-element.component.ts
View File

@@ -7,7 +7,9 @@ import { Item } from '../../../../../core/shared/item.model';
import { SidebarSearchListElementComponent } from '../../sidebar-search-list-element.component';
@listableObjectComponent('PublicationSearchResult', ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent('PublicationSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@listableObjectComponent(ItemSearchResult, ViewMode.ListElement, Context.SideBarSearchModal)
@listableObjectComponent(ItemSearchResult, ViewMode.ListElement, Context.SideBarSearchModalCurrent)
@Component({
selector: 'ds-publication-sidebar-search-list-element',
templateUrl: '../../sidebar-search-list-element.component.html'

17
src/app/shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html
View File

@@ -1,3 +1,14 @@
<ds-truncatable-part *ngIf="parentTitle$ && parentTitle$ | async" [maxLines]="1"><div class="text-secondary" [innerHTML]="parentTitle$ | async"></div></ds-truncatable-part>
<ds-truncatable-part *ngIf="title" [maxLines]="1"><div class="text-primary" [innerHTML]="title"></div></ds-truncatable-part>
<ds-truncatable-part *ngIf="description" [maxLines]="1"><div class="text-secondary" [innerHTML]="description"></div></ds-truncatable-part>
<ds-truncatable-part *ngIf="parentTitle$ && parentTitle$ | async" [maxLines]="1">
<div [ngClass]="isCurrent() ? 'text-light' : 'text-body'"
[innerHTML]="parentTitle$ | async"></div>
</ds-truncatable-part>
<ds-truncatable-part *ngIf="title" [maxLines]="1">
<div class="font-weight-bold"
[ngClass]="isCurrent() ? 'text-light' : 'text-primary'"
[innerHTML]="title"></div>
</ds-truncatable-part>
<ds-truncatable-part *ngIf="description" [maxLines]="1">
<div class="text-secondary"
[ngClass]="isCurrent() ? 'text-light' : 'text-secondary'"
[innerHTML]="description"></div>
</ds-truncatable-part>

10
src/app/shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.ts
View File

@@ -11,6 +11,7 @@ import { ChildHALResource } from '../../../core/shared/child-hal-resource.model'
import { followLink } from '../../utils/follow-link-config.model';
import { RemoteData } from '../../../core/data/remote-data';
import { of as observableOf } from 'rxjs';
import { Context } from '../../../core/shared/context.model';
@Component({
selector: 'ds-sidebar-search-list-element',
@@ -54,6 +55,13 @@ export class SidebarSearchListElementComponent<T extends SearchResult<K>, K exte
}
}
/**
* returns true if this element represents the current dso
*/
isCurrent(): boolean {
return this.context === Context.SideBarSearchModalCurrent;
}
/**
* Get the title of the object's parent
* Retrieve the parent by using the object's parent link and retrieving its 'dc.title' metadata
@@ -61,7 +69,7 @@ export class SidebarSearchListElementComponent<T extends SearchResult<K>, K exte
getParentTitle(): Observable<string> {
return this.getParent().pipe(
map((parentRD: RemoteData<DSpaceObject>) => {
return parentRD ? parentRD.payload.firstMetadataValue('dc.title') : undefined;
return hasValue(parentRD) && hasValue(parentRD.payload) ? parentRD.payload.firstMetadataValue('dc.title') : undefined;
})
);
}