2018-08-21 14:18:59 +00:00
|
|
|
import { Component, Input, OnInit } from '@angular/core'
|
2018-09-25 13:42:58 +00:00
|
|
|
import { Router } from '@angular/router'
|
2018-12-19 15:04:34 +00:00
|
|
|
import { AuthService, Notifier } from '@app/core'
|
2018-08-21 14:18:59 +00:00
|
|
|
import { UserSubscriptionService } from '@app/shared/user-subscription/user-subscription.service'
|
|
|
|
import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
|
|
|
|
import { I18n } from '@ngx-translate/i18n-polyfill'
|
2018-09-26 07:39:41 +00:00
|
|
|
import { VideoService } from '@app/shared/video/video.service'
|
|
|
|
import { FeedFormat } from '../../../../../shared/models/feeds'
|
2020-01-07 22:51:14 +00:00
|
|
|
import { Account } from '@app/shared/account/account.model'
|
2020-01-10 10:15:07 +00:00
|
|
|
import { concat, forkJoin, merge } from 'rxjs'
|
|
|
|
import { toArray } from 'rxjs/operators'
|
2018-08-21 14:18:59 +00:00
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'my-subscribe-button',
|
|
|
|
templateUrl: './subscribe-button.component.html',
|
|
|
|
styleUrls: [ './subscribe-button.component.scss' ]
|
|
|
|
})
|
|
|
|
export class SubscribeButtonComponent implements OnInit {
|
2020-01-07 23:46:38 +00:00
|
|
|
/**
|
|
|
|
* SubscribeButtonComponent can be used with a single VideoChannel passed as [VideoChannel],
|
|
|
|
* or with an account and a full list of that account's videoChannels. The latter is intended
|
|
|
|
* to allow mass un/subscription from an account's page, while keeping the channel-centric
|
|
|
|
* subscription model.
|
|
|
|
*/
|
2020-01-07 22:51:14 +00:00
|
|
|
@Input() account: Account
|
|
|
|
@Input() videoChannels: VideoChannel[]
|
2018-08-21 14:18:59 +00:00
|
|
|
@Input() displayFollowers = false
|
2018-08-23 15:58:39 +00:00
|
|
|
@Input() size: 'small' | 'normal' = 'normal'
|
2018-08-21 14:18:59 +00:00
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
subscribed = new Map<string, boolean>()
|
2018-08-21 14:18:59 +00:00
|
|
|
|
|
|
|
constructor (
|
2018-09-25 13:42:58 +00:00
|
|
|
private authService: AuthService,
|
|
|
|
private router: Router,
|
2018-12-19 15:04:34 +00:00
|
|
|
private notifier: Notifier,
|
2018-08-21 14:18:59 +00:00
|
|
|
private userSubscriptionService: UserSubscriptionService,
|
2018-09-26 07:39:41 +00:00
|
|
|
private i18n: I18n,
|
|
|
|
private videoService: VideoService
|
2020-01-08 21:13:47 +00:00
|
|
|
) { }
|
2020-01-07 22:51:14 +00:00
|
|
|
|
|
|
|
get handle () {
|
|
|
|
return this.account
|
|
|
|
? this.account.nameWithHost
|
2020-01-10 10:14:57 +00:00
|
|
|
: this.videoChannel.name + '@' + this.videoChannel.host
|
2020-01-07 22:51:14 +00:00
|
|
|
}
|
2018-08-21 14:18:59 +00:00
|
|
|
|
2019-06-07 08:56:59 +00:00
|
|
|
get channelHandle () {
|
2020-01-10 10:14:57 +00:00
|
|
|
return this.getChannelHandler(this.videoChannel)
|
2018-08-21 14:18:59 +00:00
|
|
|
}
|
|
|
|
|
2020-01-07 22:51:14 +00:00
|
|
|
get uri () {
|
|
|
|
return this.account
|
|
|
|
? this.account.url
|
|
|
|
: this.videoChannels[0].url
|
2018-09-25 13:42:58 +00:00
|
|
|
}
|
|
|
|
|
2019-09-24 12:43:11 +00:00
|
|
|
get rssUri () {
|
2020-01-07 22:51:14 +00:00
|
|
|
const rssFeed = this.account
|
|
|
|
? this.videoService
|
|
|
|
.getAccountFeedUrls(this.account.id)
|
|
|
|
.find(i => i.format === FeedFormat.RSS)
|
|
|
|
: this.videoService
|
|
|
|
.getVideoChannelFeedUrls(this.videoChannels[0].id)
|
|
|
|
.find(i => i.format === FeedFormat.RSS)
|
2019-09-24 12:43:11 +00:00
|
|
|
|
|
|
|
return rssFeed.url
|
|
|
|
}
|
|
|
|
|
2020-01-10 10:14:57 +00:00
|
|
|
get videoChannel () {
|
|
|
|
return this.videoChannels[0]
|
|
|
|
}
|
|
|
|
|
2018-08-21 14:18:59 +00:00
|
|
|
ngOnInit () {
|
2020-01-08 21:13:47 +00:00
|
|
|
this.loadSubscribedStatus()
|
2018-08-21 14:18:59 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
subscribe () {
|
2018-09-25 13:42:58 +00:00
|
|
|
if (this.isUserLoggedIn()) {
|
2018-12-11 14:27:46 +00:00
|
|
|
return this.localSubscribe()
|
2018-09-25 13:42:58 +00:00
|
|
|
}
|
2018-12-11 14:27:46 +00:00
|
|
|
|
|
|
|
return this.gotoLogin()
|
2018-09-25 13:42:58 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
localSubscribe () {
|
2020-01-10 10:15:07 +00:00
|
|
|
const subscribedStatus = this.subscribeStatus(false)
|
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
const observableBatch = this.videoChannels
|
|
|
|
.map(videoChannel => this.getChannelHandler(videoChannel))
|
2020-01-10 10:15:07 +00:00
|
|
|
.filter(handle => subscribedStatus.includes(handle))
|
2020-01-08 21:13:47 +00:00
|
|
|
.map(handle => this.userSubscriptionService.addSubscription(handle))
|
2020-01-07 22:51:14 +00:00
|
|
|
|
2020-01-10 10:15:07 +00:00
|
|
|
forkJoin(observableBatch)
|
2018-08-21 14:18:59 +00:00
|
|
|
.subscribe(
|
|
|
|
() => {
|
2018-12-19 15:04:34 +00:00
|
|
|
this.notifier.success(
|
2020-01-07 22:51:14 +00:00
|
|
|
this.account
|
|
|
|
? this.i18n(
|
2020-01-08 21:13:47 +00:00
|
|
|
'Subscribed to all current channels of {{nameWithHost}}. You will be notified of all their new videos.',
|
2020-01-07 22:51:14 +00:00
|
|
|
{ nameWithHost: this.account.displayName }
|
|
|
|
)
|
|
|
|
: this.i18n(
|
2020-01-08 21:13:47 +00:00
|
|
|
'Subscribed to {{nameWithHost}}. You will be notified of all their new videos.',
|
2020-01-07 22:51:14 +00:00
|
|
|
{ nameWithHost: this.videoChannels[0].displayName }
|
|
|
|
)
|
|
|
|
,
|
2018-12-19 15:04:34 +00:00
|
|
|
this.i18n('Subscribed')
|
2018-08-21 14:18:59 +00:00
|
|
|
)
|
|
|
|
},
|
|
|
|
|
2018-12-19 15:04:34 +00:00
|
|
|
err => this.notifier.error(err.message)
|
2018-08-21 14:18:59 +00:00
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
unsubscribe () {
|
2018-09-25 13:42:58 +00:00
|
|
|
if (this.isUserLoggedIn()) {
|
|
|
|
this.localUnsubscribe()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
localUnsubscribe () {
|
2020-01-10 10:15:07 +00:00
|
|
|
const subscribeStatus = this.subscribeStatus(true)
|
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
const observableBatch = this.videoChannels
|
2020-01-10 10:15:07 +00:00
|
|
|
.map(videoChannel => this.getChannelHandler(videoChannel))
|
|
|
|
.filter(handle => subscribeStatus.includes(handle))
|
|
|
|
.map(handle => this.userSubscriptionService.deleteSubscription(handle))
|
2020-01-07 22:51:14 +00:00
|
|
|
|
2020-01-10 10:15:07 +00:00
|
|
|
concat(...observableBatch)
|
|
|
|
.subscribe({
|
|
|
|
complete: () => {
|
|
|
|
this.notifier.success(
|
|
|
|
this.account
|
|
|
|
? this.i18n('Unsubscribed from all channels of {{nameWithHost}}', { nameWithHost: this.account.nameWithHost })
|
|
|
|
: this.i18n('Unsubscribed from {{nameWithHost}}', { nameWithHost: this.videoChannels[ 0 ].nameWithHost })
|
|
|
|
,
|
|
|
|
this.i18n('Unsubscribed')
|
|
|
|
)
|
|
|
|
},
|
2018-08-21 14:18:59 +00:00
|
|
|
|
2020-01-10 10:15:07 +00:00
|
|
|
error: err => this.notifier.error(err.message)
|
|
|
|
})
|
2018-08-21 14:18:59 +00:00
|
|
|
}
|
2018-09-25 13:42:58 +00:00
|
|
|
|
|
|
|
isUserLoggedIn () {
|
|
|
|
return this.authService.isLoggedIn()
|
|
|
|
}
|
|
|
|
|
2020-01-07 22:51:14 +00:00
|
|
|
isAllChannelsSubscribed () {
|
|
|
|
return !Array.from(this.subscribed.values()).includes(false)
|
|
|
|
}
|
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
isAtLeastOneChannelSubscribed () {
|
|
|
|
return this.subscribeStatus(true).length > 0
|
|
|
|
}
|
|
|
|
|
|
|
|
isBigButton () {
|
2020-01-10 10:42:53 +00:00
|
|
|
return this.isUserLoggedIn() && this.videoChannels.length > 1 && this.isAtLeastOneChannelSubscribed()
|
2020-01-08 21:13:47 +00:00
|
|
|
}
|
|
|
|
|
2018-09-25 13:42:58 +00:00
|
|
|
gotoLogin () {
|
|
|
|
this.router.navigate([ '/login' ])
|
|
|
|
}
|
2020-01-07 22:51:14 +00:00
|
|
|
|
2020-01-10 10:14:57 +00:00
|
|
|
subscribeStatus (subscribed: boolean) {
|
2020-01-08 21:13:47 +00:00
|
|
|
const accumulator: string[] = []
|
2020-01-07 22:51:14 +00:00
|
|
|
for (const [key, value] of this.subscribed.entries()) {
|
|
|
|
if (value === subscribed) accumulator.push(key)
|
|
|
|
}
|
2020-01-10 10:14:57 +00:00
|
|
|
|
2020-01-07 22:51:14 +00:00
|
|
|
return accumulator
|
|
|
|
}
|
2020-01-08 21:13:47 +00:00
|
|
|
|
2020-01-10 10:14:57 +00:00
|
|
|
private getChannelHandler (videoChannel: VideoChannel) {
|
|
|
|
return videoChannel.name + '@' + videoChannel.host
|
|
|
|
}
|
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
private loadSubscribedStatus () {
|
|
|
|
if (!this.isUserLoggedIn()) return
|
|
|
|
|
|
|
|
for (const videoChannel of this.videoChannels) {
|
|
|
|
const handle = this.getChannelHandler(videoChannel)
|
|
|
|
this.subscribed.set(handle, false)
|
2020-01-10 10:15:07 +00:00
|
|
|
|
2020-01-08 21:13:47 +00:00
|
|
|
merge(
|
|
|
|
this.userSubscriptionService.listenToSubscriptionCacheChange(handle),
|
|
|
|
this.userSubscriptionService.doesSubscriptionExist(handle)
|
2020-01-10 10:15:07 +00:00
|
|
|
).subscribe(
|
|
|
|
res => this.subscribed.set(handle, res),
|
2020-01-08 21:13:47 +00:00
|
|
|
|
2020-01-10 10:15:07 +00:00
|
|
|
err => this.notifier.error(err.message)
|
|
|
|
)
|
2020-01-08 21:13:47 +00:00
|
|
|
}
|
|
|
|
}
|
2018-08-21 14:18:59 +00:00
|
|
|
}
|