Files
dspace-angular/src/app/community-list-page/community-list/community-list.component.ts
Marie Verdonck 9bd1933548 66391: expandedNodes (&loadingNode) is now retrieved/sent to the store
at component initialisation/destruction so the state of the tree persists
& documentation
2019-11-26 17:23:49 +01:00

105 lines
4.0 KiB
TypeScript

import { Component, OnDestroy, OnInit } from '@angular/core';
import { take } from 'rxjs/operators';
import { CommunityListService, FlatNode } from '../community-list-service';
import { CommunityListDatasource } from '../community-list-datasource';
import { FlatTreeControl } from '@angular/cdk/tree';
import { isEmpty } from '../../shared/empty.util';
/**
* A tree-structured list of nodes representing the communities, their subCommunities and collections.
* Initially only the page-restricted top communities are shown.
* Each node can be expanded to show its children and all children are also page-limited.
* More pages of a page-limited result can be shown by pressing a show more node/link.
* Which nodes were expanded is kept in the store, so this persists across pages.
*/
@Component({
selector: 'ds-community-list',
templateUrl: './community-list.component.html',
})
export class CommunityListComponent implements OnInit, OnDestroy {
private expandedNodes: FlatNode[] = [];
public loadingNode: FlatNode;
treeControl = new FlatTreeControl<FlatNode>(
(node) => node.level, (node) => true
);
dataSource: CommunityListDatasource;
constructor(private communityListService: CommunityListService) {
}
ngOnInit() {
this.dataSource = new CommunityListDatasource(this.communityListService);
this.communityListService.getLoadingNodeFromStore().pipe(take(1)).subscribe((result) => {
this.loadingNode = result;
});
this.communityListService.getExpandedNodesFromStore().pipe(take(1)).subscribe((result) => {
this.expandedNodes = [...result];
this.dataSource.loadCommunities(this.expandedNodes);
});
}
ngOnDestroy(): void {
this.communityListService.saveCommunityListStateToStore(this.expandedNodes, this.loadingNode);
}
// whether or not this node has children (subcommunities or collections)
hasChild(_: number, node: FlatNode) {
return node.isExpandable$;
}
// whether or not it is a show more node (contains no data, but is indication that there are more topcoms, subcoms or collections
isShowMore(_: number, node: FlatNode) {
return node.isShowMoreNode;
}
/**
* Toggles the expanded variable of a node, adds it to the exapanded nodes list and reloads the tree so this node is expanded
* @param node Node we want to expand
*/
toggleExpanded(node: FlatNode) {
this.loadingNode = node;
if (node.isExpanded) {
this.expandedNodes = this.expandedNodes.filter((node2) => node2.name !== node.name);
node.isExpanded = false;
} else {
this.expandedNodes.push(node);
node.isExpanded = true;
if (isEmpty(node.currentCollectionPage)) {
node.currentCollectionPage = 1;
}
if (isEmpty(node.currentCommunityPage)) {
node.currentCommunityPage = 1;
}
}
this.dataSource.loadCommunities(this.expandedNodes);
}
/**
* Makes sure the next page of a node is added to the tree (top community, sub community of collection)
* > Finds its parent (if not top community) and increases its corresponding collection/subcommunity currentPage
* > Reloads tree with new page added to corresponding top community lis, sub community list or collection list
* @param node The show more node indicating whether it's an increase in top communities, sub communities or collections
*/
getNextPage(node: FlatNode): void {
this.loadingNode = node;
if (node.parent != null) {
if (node.id === 'collection') {
const parentNodeInExpandedNodes = this.expandedNodes.find((node2: FlatNode) => node.parent.id === node2.id);
parentNodeInExpandedNodes.currentCollectionPage++;
}
if (node.id === 'community') {
const parentNodeInExpandedNodes = this.expandedNodes.find((node2: FlatNode) => node.parent.id === node2.id);
parentNodeInExpandedNodes.currentCommunityPage++;
}
this.dataSource.loadCommunities(this.expandedNodes);
} else {
this.communityListService.getNextPageTopCommunities();
this.dataSource.loadCommunities(this.expandedNodes);
}
}
}