aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2018-09-26 09:39:41 +0200
committerChocobozzz <me@florianbigard.com>2018-09-26 09:39:41 +0200
commit39ba2e8e3a71961cd0087c57d25905f6a97a6b69 (patch)
treed97d835d1448af796370dc7fe361af5f72582e41 /client/src/app/shared
parenta71de50bbc63a3d1d977abf8ad5e154a632a2d71 (diff)
downloadPeerTube-39ba2e8e3a71961cd0087c57d25905f6a97a6b69.tar.gz
PeerTube-39ba2e8e3a71961cd0087c57d25905f6a97a6b69.tar.zst
PeerTube-39ba2e8e3a71961cd0087c57d25905f6a97a6b69.zip
Add RSS feed to subscribe button
Diffstat (limited to 'client/src/app/shared')
-rw-r--r--client/src/app/shared/user-subscription/remote-subscribe.component.html11
-rw-r--r--client/src/app/shared/user-subscription/remote-subscribe.component.scss1
-rw-r--r--client/src/app/shared/user-subscription/subscribe-button.component.html17
-rw-r--r--client/src/app/shared/user-subscription/subscribe-button.component.scss35
-rw-r--r--client/src/app/shared/user-subscription/subscribe-button.component.ts11
-rw-r--r--client/src/app/shared/video/video.service.ts5
6 files changed, 62 insertions, 18 deletions
diff --git a/client/src/app/shared/user-subscription/remote-subscribe.component.html b/client/src/app/shared/user-subscription/remote-subscribe.component.html
index 3762142f2..ec3636b3e 100644
--- a/client/src/app/shared/user-subscription/remote-subscribe.component.html
+++ b/client/src/app/shared/user-subscription/remote-subscribe.component.html
@@ -1,5 +1,4 @@
1<form novalidate [formGroup]="form" 1<form novalidate [formGroup]="form" (ngSubmit)="formValidated()">
2 (ngSubmit)="formValidated()">
3 <div class="form-group"> 2 <div class="form-group">
4 <input type="email" 3 <input type="email"
5 formControlName="text" 4 formControlName="text"
@@ -7,17 +6,17 @@
7 (keyup.control.enter)="onValidKey()" (keyup.meta.enter)="onValidKey()" 6 (keyup.control.enter)="onValidKey()" (keyup.meta.enter)="onValidKey()"
8 placeholder="jane_doe@example.com"> 7 placeholder="jane_doe@example.com">
9 </div> 8 </div>
10 <button type="submit" 9
11 [disabled]="!form.valid" 10 <button type="submit" [disabled]="!form.valid" class="btn btn-sm btn-remote-follow" i18n>
12 class="btn btn-sm btn-remote-follow"
13 i18n>
14 <span *ngIf="!interact">Remote subscribe</span> 11 <span *ngIf="!interact">Remote subscribe</span>
15 <span *ngIf="interact">Remote interact</span> 12 <span *ngIf="interact">Remote interact</span>
16 </button> 13 </button>
14
17 <my-help *ngIf="!interact && showHelp" 15 <my-help *ngIf="!interact && showHelp"
18 helpType="custom" 16 helpType="custom"
19 i18n-customHtml customHtml="You can subscribe to the channel via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type the channel URL in the search box and subscribe there."> 17 i18n-customHtml customHtml="You can subscribe to the channel via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type the channel URL in the search box and subscribe there.">
20 </my-help> 18 </my-help>
19
21 <my-help *ngIf="showHelp && interact" 20 <my-help *ngIf="showHelp && interact"
22 helpType="custom" 21 helpType="custom"
23 i18n-customHtml customHtml="You can interact with this via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type the current URL in the search box and interact with it there."> 22 i18n-customHtml customHtml="You can interact with this via any ActivityPub-capable fediverse instance. For instance with Mastodon or Pleroma you can type the current URL in the search box and interact with it there.">
diff --git a/client/src/app/shared/user-subscription/remote-subscribe.component.scss b/client/src/app/shared/user-subscription/remote-subscribe.component.scss
index e49271079..698c5866a 100644
--- a/client/src/app/shared/user-subscription/remote-subscribe.component.scss
+++ b/client/src/app/shared/user-subscription/remote-subscribe.component.scss
@@ -1,5 +1,6 @@
1@import '_mixins'; 1@import '_mixins';
2 2
3.btn-remote-follow { 3.btn-remote-follow {
4 @include peertube-button;
4 @include orange-button; 5 @include orange-button;
5} \ No newline at end of file 6} \ No newline at end of file
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 b62fb7dfa..2c8481c96 100644
--- a/client/src/app/shared/user-subscription/subscribe-button.component.html
+++ b/client/src/app/shared/user-subscription/subscribe-button.component.html
@@ -10,11 +10,16 @@
10 {{ videoChannel.followersCount | myNumberFormatter }} 10 {{ videoChannel.followersCount | myNumberFormatter }}
11 </span> 11 </span>
12 </button> 12 </button>
13 <button *ngIf="subscribed === true" type="button"
14 class="btn btn-sm" role="button"
15 (click)="unsubscribe()" i18n>Unsubscribe</button>
16 13
17 <div class="btn-group" ngbDropdown autoClose="outside" 14 <button
15 *ngIf="subscribed === true" type="button"
16 class="btn btn-sm" role="button"
17 (click)="unsubscribe()" i18n
18 >
19 Unsubscribe
20 </button>
21
22 <div class="btn-group" ngbDropdown autoClose="outside"
18 placement="bottom-right" role="group" 23 placement="bottom-right" role="group"
19 aria-label="Multiple ways to subscribe to the current channel"> 24 aria-label="Multiple ways to subscribe to the current channel">
20 <button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle> 25 <button class="btn btn-sm dropdown-toggle-split" ngbDropdownToggle>
@@ -25,16 +30,20 @@
25 {{ videoChannel.followersCount | myNumberFormatter }} 30 {{ videoChannel.followersCount | myNumberFormatter }}
26 </span> 31 </span>
27 </button> 32 </button>
33
28 <div class="dropdown-menu" ngbDropdownMenu> 34 <div class="dropdown-menu" ngbDropdownMenu>
29 35
30 <h6 class="dropdown-header" i18n>Using an ActivityPub-compatible account</h6> 36 <h6 class="dropdown-header" i18n>Using an ActivityPub-compatible account</h6>
37
31 <button class="dropdown-item" (click)="subscribe()" 38 <button class="dropdown-item" (click)="subscribe()"
32 *ngIf="subscribed === false"> 39 *ngIf="subscribed === false">
33 <span *ngIf="!isUserLoggedIn()" i18n>Subscribe with an account on {{ videoChannel.host }}</span> 40 <span *ngIf="!isUserLoggedIn()" i18n>Subscribe with an account on {{ videoChannel.host }}</span>
34 <span *ngIf="isUserLoggedIn()" i18n>Subscribe with your local account</span> 41 <span *ngIf="isUserLoggedIn()" i18n>Subscribe with your local account</span>
35 </button> 42 </button>
43
36 <button class="dropdown-item" i18n>Subscribe with a remote account:</button> 44 <button class="dropdown-item" i18n>Subscribe with a remote account:</button>
37 <my-remote-subscribe showHelp="true" account="{{ uriAccount }}"></my-remote-subscribe> 45 <my-remote-subscribe showHelp="true" account="{{ uriAccount }}"></my-remote-subscribe>
46
38 <div class="dropdown-divider"></div> 47 <div class="dropdown-divider"></div>
39 48
40 <h6 class="dropdown-header" i18n>Using a syndication feed</h6> 49 <h6 class="dropdown-header" i18n>Using a syndication feed</h6>
diff --git a/client/src/app/shared/user-subscription/subscribe-button.component.scss b/client/src/app/shared/user-subscription/subscribe-button.component.scss
index 7a8a8ee08..15fb83c05 100644
--- a/client/src/app/shared/user-subscription/subscribe-button.component.scss
+++ b/client/src/app/shared/user-subscription/subscribe-button.component.scss
@@ -4,15 +4,32 @@
4.btn-group-subscribe { 4.btn-group-subscribe {
5 @include peertube-button; 5 @include peertube-button;
6 @include disable-default-a-behaviour; 6 @include disable-default-a-behaviour;
7
7 float: right; 8 float: right;
8 padding: 0; 9 padding: 0;
9 10
10 &.btn-group > .btn:not(.dropdown-toggle) { 11 & > .btn,
11 padding-right: 5px; 12 & > .dropdown > .dropdown-toggle {
12 font-size: 15px; 13 font-size: 15px;
13 } 14 }
14 &.btn-group > .btn-group:not(:first-child) > .btn { 15
15 padding-left: 2px; 16 // Unlogged
17 & > .dropdown > .dropdown-toggle span {
18 padding-right: 3px;
19 }
20
21 // Logged
22 & > .btn {
23 padding-right: 4px;
24
25 & + .dropdown > button {
26 padding-left: 2px;
27
28 &::after {
29 position: relative;
30 top: 1px;
31 }
32 }
16 } 33 }
17 34
18 &.subscribe-button { 35 &.subscribe-button {
@@ -22,7 +39,7 @@
22 } 39 }
23 40
24 span.followers-count { 41 span.followers-count {
25 padding-left:5px; 42 padding-left: 5px;
26 } 43 }
27 } 44 }
28 &.unsubscribe-button { 45 &.unsubscribe-button {
@@ -32,6 +49,14 @@
32 } 49 }
33 } 50 }
34 51
52 .dropdown-menu {
53 cursor: default;
54
55 button {
56 cursor: pointer;
57 }
58 }
59
35 .dropdown-header { 60 .dropdown-header {
36 padding-left: 1rem; 61 padding-left: 1rem;
37 } 62 }
diff --git a/client/src/app/shared/user-subscription/subscribe-button.component.ts b/client/src/app/shared/user-subscription/subscribe-button.component.ts
index e3c758942..95c2bb8f8 100644
--- a/client/src/app/shared/user-subscription/subscribe-button.component.ts
+++ b/client/src/app/shared/user-subscription/subscribe-button.component.ts
@@ -5,6 +5,8 @@ import { UserSubscriptionService } from '@app/shared/user-subscription/user-subs
5import { VideoChannel } from '@app/shared/video-channel/video-channel.model' 5import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
6import { NotificationsService } from 'angular2-notifications' 6import { NotificationsService } from 'angular2-notifications'
7import { I18n } from '@ngx-translate/i18n-polyfill' 7import { I18n } from '@ngx-translate/i18n-polyfill'
8import { VideoService } from '@app/shared/video/video.service'
9import { FeedFormat } from '../../../../../shared/models/feeds'
8 10
9@Component({ 11@Component({
10 selector: 'my-subscribe-button', 12 selector: 'my-subscribe-button',
@@ -23,7 +25,8 @@ export class SubscribeButtonComponent implements OnInit {
23 private router: Router, 25 private router: Router,
24 private notificationsService: NotificationsService, 26 private notificationsService: NotificationsService,
25 private userSubscriptionService: UserSubscriptionService, 27 private userSubscriptionService: UserSubscriptionService,
26 private i18n: I18n 28 private i18n: I18n,
29 private videoService: VideoService
27 ) { } 30 ) { }
28 31
29 get uri () { 32 get uri () {
@@ -100,6 +103,10 @@ export class SubscribeButtonComponent implements OnInit {
100 } 103 }
101 104
102 rssOpen () { 105 rssOpen () {
103 window.open('') 106 const rssFeed = this.videoService
107 .getVideoChannelFeedUrls(this.videoChannel.id)
108 .find(i => i.format === FeedFormat.RSS)
109
110 window.open(rssFeed.url)
104 } 111 }
105} 112}
diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts
index 4a78d70ea..2255a18a2 100644
--- a/client/src/app/shared/video/video.service.ts
+++ b/client/src/app/shared/video/video.service.ts
@@ -28,7 +28,7 @@ import { Account } from '@app/shared/account/account.model'
28import { AccountService } from '@app/shared/account/account.service' 28import { AccountService } from '@app/shared/account/account.service'
29import { VideoChannelService } from '@app/shared/video-channel/video-channel.service' 29import { VideoChannelService } from '@app/shared/video-channel/video-channel.service'
30import { ServerService } from '@app/core' 30import { ServerService } from '@app/core'
31import { UserSubscriptionService } from '@app/shared/user-subscription' 31import { UserSubscriptionService } from '@app/shared/user-subscription/user-subscription.service'
32import { VideoChannel } from '@app/shared/video-channel/video-channel.model' 32import { VideoChannel } from '@app/shared/video-channel/video-channel.model'
33import { I18n } from '@ngx-translate/i18n-polyfill' 33import { I18n } from '@ngx-translate/i18n-polyfill'
34 34
@@ -210,14 +210,17 @@ export class VideoService implements VideosProvider {
210 buildBaseFeedUrls (params: HttpParams) { 210 buildBaseFeedUrls (params: HttpParams) {
211 const feeds = [ 211 const feeds = [
212 { 212 {
213 format: FeedFormat.RSS,
213 label: 'rss 2.0', 214 label: 'rss 2.0',
214 url: VideoService.BASE_FEEDS_URL + FeedFormat.RSS.toLowerCase() 215 url: VideoService.BASE_FEEDS_URL + FeedFormat.RSS.toLowerCase()
215 }, 216 },
216 { 217 {
218 format: FeedFormat.ATOM,
217 label: 'atom 1.0', 219 label: 'atom 1.0',
218 url: VideoService.BASE_FEEDS_URL + FeedFormat.ATOM.toLowerCase() 220 url: VideoService.BASE_FEEDS_URL + FeedFormat.ATOM.toLowerCase()
219 }, 221 },
220 { 222 {
223 format: FeedFormat.JSON,
221 label: 'json 1.0', 224 label: 'json 1.0',
222 url: VideoService.BASE_FEEDS_URL + FeedFormat.JSON.toLowerCase() 225 url: VideoService.BASE_FEEDS_URL + FeedFormat.JSON.toLowerCase()
223 } 226 }