Add button to display full list in About page
This commit is contained in:
parent
5721fd8374
commit
49c4dd7ec3
|
@ -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>
|
<h1 class="sr-only" i18n>Follows</h1>
|
||||||
<div class="col-xl-6 col-md-12">
|
<div class="col-xl-6 col-md-12">
|
||||||
<h2 i18n class="subtitle">Followers instances</h2>
|
<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">
|
<a *ngFor="let follower of followers" [href]="buildLink(follower)" target="_blank" rel="noopener noreferrer">
|
||||||
{{ follower }}
|
{{ follower }}
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
|
<a id="showMore" href="javascript:;" *ngIf="!showMoreFollowers" (click)="loadAllFollowers()" (click)= "showMoreFollowers=true">Show full list</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="col-xl-6 col-md-12">
|
<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">
|
<a *ngFor="let following of followings" [href]="buildLink(following)" target="_blank" rel="noopener noreferrer">
|
||||||
{{ following }}
|
{{ following }}
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
|
<a id="showMore" href="javascript:;" *ngIf="!showMoreFollowings" (click)="loadAllFollowings()" (click)= "showMoreFollowings=true">Show full list</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -16,3 +16,7 @@ a {
|
||||||
.no-results {
|
.no-results {
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#showMore {
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
|
@ -14,6 +14,9 @@ export class AboutFollowsComponent implements OnInit {
|
||||||
followers: string[] = []
|
followers: string[] = []
|
||||||
followings: string[] = []
|
followings: string[] = []
|
||||||
|
|
||||||
|
showMoreFollowers = false;
|
||||||
|
showMoreFollowings = false;
|
||||||
|
|
||||||
followersPagination: ComponentPagination = {
|
followersPagination: ComponentPagination = {
|
||||||
currentPage: 1,
|
currentPage: 1,
|
||||||
itemsPerPage: 20,
|
itemsPerPage: 20,
|
||||||
|
@ -45,24 +48,20 @@ export class AboutFollowsComponent implements OnInit {
|
||||||
this.loadMoreFollowings()
|
this.loadMoreFollowings()
|
||||||
}
|
}
|
||||||
|
|
||||||
onNearOfBottom () {
|
loadAllFollowings () {
|
||||||
this.onNearOfFollowersBottom()
|
while(hasMoreItems(this.followingsPagination)) {
|
||||||
|
this.followingsPagination.currentPage += 1
|
||||||
|
|
||||||
this.onNearOfFollowingsBottom()
|
this.loadMoreFollowings()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
onNearOfFollowersBottom () {
|
loadAllFollowers () {
|
||||||
if (!hasMoreItems(this.followersPagination)) return
|
while(hasMoreItems(this.followersPagination)) {
|
||||||
|
this.followersPagination.currentPage += 1
|
||||||
|
|
||||||
this.followersPagination.currentPage += 1
|
this.loadMoreFollowers();
|
||||||
this.loadMoreFollowers()
|
}
|
||||||
}
|
|
||||||
|
|
||||||
onNearOfFollowingsBottom () {
|
|
||||||
if (!hasMoreItems(this.followingsPagination)) return
|
|
||||||
|
|
||||||
this.followingsPagination.currentPage += 1
|
|
||||||
this.loadMoreFollowings()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
buildLink (host: string) {
|
buildLink (host: string) {
|
||||||
|
|
Loading…
Reference in New Issue