diff options
Diffstat (limited to 'client/src/app/shared/user-subscription/subscribe-button.component.html')
-rw-r--r-- | client/src/app/shared/user-subscription/subscribe-button.component.html | 52 |
1 files changed, 32 insertions, 20 deletions
diff --git a/client/src/app/shared/user-subscription/subscribe-button.component.html b/client/src/app/shared/user-subscription/subscribe-button.component.html index 25f3be215..a119beff6 100644 --- a/client/src/app/shared/user-subscription/subscribe-button.component.html +++ b/client/src/app/shared/user-subscription/subscribe-button.component.html | |||
@@ -1,34 +1,46 @@ | |||
1 | <div class="btn-group-subscribe btn-group" | 1 | <div class="btn-group-subscribe btn-group" |
2 | [ngClass]="{'subscribe-button': subscribed !== true, 'unsubscribe-button': subscribed === true}"> | 2 | [ngClass]="{'subscribe-button': !isAllChannelsSubscribed(), 'unsubscribe-button': isAllChannelsSubscribed()}"> |
3 | <button *ngIf="subscribed === false && isUserLoggedIn()" type="button" | 3 | |
4 | class="btn btn-sm" role="button" | 4 | <ng-template #userLoggedOut> |
5 | (click)="subscribe()"> | 5 | <span> |
6 | <span i18n> | 6 | <ng-container *ngIf="account; then multiple; else single"></ng-container> |
7 | Subscribe | 7 | <ng-template i18n #single>Subscribe</ng-template> |
8 | <ng-template i18n #multiple>Subscribe to all channels</ng-template> | ||
8 | </span> | 9 | </span> |
9 | <span *ngIf="displayFollowers && videoChannel.followersCount !== 0" class="followers-count"> | 10 | <span *ngIf="displayFollowers && videoChannel.followersCount !== 0" class="followers-count"> |
10 | {{ videoChannel.followersCount | myNumberFormatter }} | 11 | {{ videoChannel.followersCount | myNumberFormatter }} |
11 | </span> | 12 | </span> |
12 | </button> | 13 | </ng-template> |
14 | |||
15 | <ng-template #userLoggedIn> | ||
16 | <button *ngIf="!isAllChannelsSubscribed()" type="button" | ||
17 | class="btn btn-sm" role="button" | ||
18 | (click)="subscribe()"> | ||
19 | <ng-template [ngTemplateOutlet]="userLoggedOut"></ng-template> | ||
20 | </button> | ||
21 | |||
22 | <button | ||
23 | *ngIf="isAllChannelsSubscribed()" type="button" | ||
24 | class="btn btn-sm" role="button" | ||
25 | (click)="unsubscribe()" i18n | ||
26 | > | ||
27 | <ng-container *ngIf="account; then multiple; else single"></ng-container> | ||
28 | <ng-template i18n #single>Unsubscribe</ng-template> | ||
29 | <ng-template i18n #multiple>Unsubscribe from all channels</ng-template> | ||
30 | </button> | ||
31 | </ng-template> | ||
13 | 32 | ||
14 | <button | 33 | <ng-container |
15 | *ngIf="subscribed === true" type="button" | 34 | *ngIf="isUserLoggedIn(); then userLoggedIn"> |
16 | class="btn btn-sm" role="button" | 35 | </ng-container> |
17 | (click)="unsubscribe()" i18n | ||
18 | > | ||
19 | Unsubscribe | ||
20 | </button> | ||
21 | 36 | ||
22 | <div class="btn-group" ngbDropdown autoClose="outside" | 37 | <div class="btn-group" ngbDropdown autoClose="outside" |
23 | placement="bottom-right" role="group" | 38 | placement="bottom-right" role="group" |
24 | aria-label="Multiple ways to subscribe to the current channel"> | 39 | aria-label="Multiple ways to subscribe to the current channel"> |
25 | <button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle> | 40 | <button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle> |
26 | <span *ngIf="!isUserLoggedIn()" i18n> | 41 | <ng-container |
27 | Subscribe | 42 | *ngIf="!isUserLoggedIn(); then userLoggedOut"> |
28 | </span> | 43 | </ng-container> |
29 | <span *ngIf="displayFollowers && videoChannel.followersCount !== 0" class="followers-count"> | ||
30 | {{ videoChannel.followersCount | myNumberFormatter }} | ||
31 | </span> | ||
32 | </button> | 44 | </button> |
33 | 45 | ||
34 | <div class="dropdown-menu" ngbDropdownMenu> | 46 | <div class="dropdown-menu" ngbDropdownMenu> |