Add button to display full list in About page

This commit is contained in:
MahdiTurki 2020-04-27 11:18:24 +01:00 committed by Chocobozzz
parent 5721fd8374
commit 49c4dd7ec3
No known key found for this signature in database
GPG Key ID: 583A612D890159BE
3 changed files with 23 additions and 16 deletions

View File

@ -1,4 +1,4 @@
<div class="row" myInfiniteScroller [autoInit]="true" (nearOfBottom)="onNearOfBottom()" [dataObservable]="onDataSubject.asObservable()">
<div class="row">
<h1 class="sr-only" i18n>Follows</h1>
<div class="col-xl-6 col-md-12">
<h2 i18n class="subtitle">Followers instances</h2>
@ -8,6 +8,8 @@
<a *ngFor="let follower of followers" [href]="buildLink(follower)" target="_blank" rel="noopener noreferrer">
{{ follower }}
</a>
<a id="showMore" href="javascript:;" *ngIf="!showMoreFollowers" (click)="loadAllFollowers()" (click)= "showMoreFollowers=true">Show full list</a>
</div>
<div class="col-xl-6 col-md-12">
@ -18,6 +20,8 @@
<a *ngFor="let following of followings" [href]="buildLink(following)" target="_blank" rel="noopener noreferrer">
{{ following }}
</a>
<a id="showMore" href="javascript:;" *ngIf="!showMoreFollowings" (click)="loadAllFollowings()" (click)= "showMoreFollowings=true">Show full list</a>
</div>
</div>

View File

@ -16,3 +16,7 @@ a {
.no-results {
justify-content: flex-start;
}
#showMore {
color: black;
}

View File

@ -14,6 +14,9 @@ export class AboutFollowsComponent implements OnInit {
followers: string[] = []
followings: string[] = []
showMoreFollowers = false;
showMoreFollowings = false;
followersPagination: ComponentPagination = {
currentPage: 1,
itemsPerPage: 20,
@ -45,24 +48,20 @@ export class AboutFollowsComponent implements OnInit {
this.loadMoreFollowings()
}
onNearOfBottom () {
this.onNearOfFollowersBottom()
loadAllFollowings () {
while(hasMoreItems(this.followingsPagination)) {
this.followingsPagination.currentPage += 1
this.onNearOfFollowingsBottom()
this.loadMoreFollowings()
}
}
onNearOfFollowersBottom () {
if (!hasMoreItems(this.followersPagination)) return
loadAllFollowers () {
while(hasMoreItems(this.followersPagination)) {
this.followersPagination.currentPage += 1
this.followersPagination.currentPage += 1
this.loadMoreFollowers()
}
onNearOfFollowingsBottom () {
if (!hasMoreItems(this.followingsPagination)) return
this.followingsPagination.currentPage += 1
this.loadMoreFollowings()
this.loadMoreFollowers();
}
}
buildLink (host: string) {