aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/shared/shared-video-live
diff options
context:
space:
mode:
authorChocobozzz <me@florianbigard.com>2020-11-05 10:56:23 +0100
committerChocobozzz <chocobozzz@cpy.re>2020-11-09 15:33:04 +0100
commitf8c00564e7e66c7c9d65ea044a4c1485df0e4c7c (patch)
tree895792776837b477d4daff3d1c112942015d0371 /client/src/app/shared/shared-video-live
parentba881f0e3f60218b28abbb59d23118db5f97d5f8 (diff)
downloadPeerTube-f8c00564e7e66c7c9d65ea044a4c1485df0e4c7c.tar.gz
PeerTube-f8c00564e7e66c7c9d65ea044a4c1485df0e4c7c.tar.zst
PeerTube-f8c00564e7e66c7c9d65ea044a4c1485df0e4c7c.zip
Add live info in watch page
Diffstat (limited to 'client/src/app/shared/shared-video-live')
-rw-r--r--client/src/app/shared/shared-video-live/index.ts4
-rw-r--r--client/src/app/shared/shared-video-live/live-stream-information.component.html35
-rw-r--r--client/src/app/shared/shared-video-live/live-stream-information.component.scss10
-rw-r--r--client/src/app/shared/shared-video-live/live-stream-information.component.ts41
-rw-r--r--client/src/app/shared/shared-video-live/live-video.service.ts34
-rw-r--r--client/src/app/shared/shared-video-live/shared-video-live.module.ts28
6 files changed, 152 insertions, 0 deletions
diff --git a/client/src/app/shared/shared-video-live/index.ts b/client/src/app/shared/shared-video-live/index.ts
new file mode 100644
index 000000000..c4048e7c5
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/index.ts
@@ -0,0 +1,4 @@
1export * from './live-video.service'
2export * from './live-stream-information.component'
3
4export * from './shared-video-live.module'
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.html b/client/src/app/shared/shared-video-live/live-stream-information.component.html
new file mode 100644
index 000000000..2e65e1de9
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.html
@@ -0,0 +1,35 @@
1<ng-template #modal let-close="close" let-dismiss="dismiss">
2 <div class="modal-header">
3 <h4 i18n class="modal-title">Live information</h4>
4
5 <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="dismiss()"></my-global-icon>
6 </div>
7
8 <div class="modal-body">
9 <div class="form-group">
10 <label for="liveVideoRTMPUrl" i18n>Live RTMP Url</label>
11 <my-input-readonly-copy id="liveVideoRTMPUrl" [value]="rtmpUrl"></my-input-readonly-copy>
12 </div>
13
14 <div class="form-group">
15 <label for="liveVideoStreamKey" i18n>Live stream key</label>
16 <my-input-readonly-copy id="liveVideoStreamKey" [value]="streamKey"></my-input-readonly-copy>
17
18 <div class="form-group-description" i18n>⚠️ Never share your stream key with anyone.</div>
19 </div>
20 </div>
21
22 <div class="modal-footer">
23 <div class="form-group inputs">
24 <input
25 type="button" role="button" i18n-value value="Close" class="action-button action-button-cancel"
26 (click)="dismiss()"
27 >
28
29 <my-edit-button
30 i18n-label label="Update live settings"
31 [routerLink]="[ '/videos', 'update', video.uuid ]" (click)="dismiss()"
32 ></my-edit-button>
33 </div>
34 </div>
35</ng-template>
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.scss b/client/src/app/shared/shared-video-live/live-stream-information.component.scss
new file mode 100644
index 000000000..a79fec179
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.scss
@@ -0,0 +1,10 @@
1@import '_variables';
2@import '_mixins';
3
4p-autocomplete {
5 display: block;
6}
7
8.form-group {
9 margin: 20px 0;
10} \ No newline at end of file
diff --git a/client/src/app/shared/shared-video-live/live-stream-information.component.ts b/client/src/app/shared/shared-video-live/live-stream-information.component.ts
new file mode 100644
index 000000000..e6142eb2e
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/live-stream-information.component.ts
@@ -0,0 +1,41 @@
1import { Component, ElementRef, ViewChild } from '@angular/core'
2import { Video } from '@app/shared/shared-main'
3import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
4import { LiveVideoService } from './live-video.service'
5
6@Component({
7 selector: 'my-live-stream-information',
8 templateUrl: './live-stream-information.component.html',
9 styleUrls: [ './live-stream-information.component.scss' ]
10})
11export class LiveStreamInformationComponent {
12 @ViewChild('modal', { static: true }) modal: ElementRef
13
14 video: Video
15 rtmpUrl = ''
16 streamKey = ''
17
18 constructor (
19 private modalService: NgbModal,
20 private liveVideoService: LiveVideoService
21 ) { }
22
23 show (video: Video) {
24 this.video = video
25 this.rtmpUrl = ''
26 this.streamKey = ''
27
28 this.loadLiveInfo(video)
29
30 this.modalService
31 .open(this.modal, { centered: true })
32 }
33
34 private loadLiveInfo (video: Video) {
35 this.liveVideoService.getVideoLive(video.id)
36 .subscribe(live => {
37 this.rtmpUrl = live.rtmpUrl
38 this.streamKey = live.streamKey
39 })
40 }
41}
diff --git a/client/src/app/shared/shared-video-live/live-video.service.ts b/client/src/app/shared/shared-video-live/live-video.service.ts
new file mode 100644
index 000000000..b02442eae
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/live-video.service.ts
@@ -0,0 +1,34 @@
1import { catchError } from 'rxjs/operators'
2import { HttpClient } from '@angular/common/http'
3import { Injectable } from '@angular/core'
4import { RestExtractor } from '@app/core'
5import { LiveVideo, LiveVideoCreate, LiveVideoUpdate } from '@shared/models'
6import { environment } from '../../../environments/environment'
7
8@Injectable()
9export class LiveVideoService {
10 static BASE_VIDEO_LIVE_URL = environment.apiUrl + '/api/v1/videos/live/'
11
12 constructor (
13 private authHttp: HttpClient,
14 private restExtractor: RestExtractor
15 ) {}
16
17 goLive (video: LiveVideoCreate) {
18 return this.authHttp
19 .post<{ video: { id: number, uuid: string } }>(LiveVideoService.BASE_VIDEO_LIVE_URL, video)
20 .pipe(catchError(err => this.restExtractor.handleError(err)))
21 }
22
23 getVideoLive (videoId: number | string) {
24 return this.authHttp
25 .get<LiveVideo>(LiveVideoService.BASE_VIDEO_LIVE_URL + videoId)
26 .pipe(catchError(err => this.restExtractor.handleError(err)))
27 }
28
29 updateLive (videoId: number | string, liveUpdate: LiveVideoUpdate) {
30 return this.authHttp
31 .put(LiveVideoService.BASE_VIDEO_LIVE_URL + videoId, liveUpdate)
32 .pipe(catchError(err => this.restExtractor.handleError(err)))
33 }
34}
diff --git a/client/src/app/shared/shared-video-live/shared-video-live.module.ts b/client/src/app/shared/shared-video-live/shared-video-live.module.ts
new file mode 100644
index 000000000..c35c2caa3
--- /dev/null
+++ b/client/src/app/shared/shared-video-live/shared-video-live.module.ts
@@ -0,0 +1,28 @@
1
2import { NgModule } from '@angular/core'
3import { SharedFormModule } from '../shared-forms'
4import { SharedGlobalIconModule } from '../shared-icons'
5import { SharedMainModule } from '../shared-main/shared-main.module'
6import { LiveStreamInformationComponent } from './live-stream-information.component'
7import { LiveVideoService } from './live-video.service'
8
9@NgModule({
10 imports: [
11 SharedMainModule,
12 SharedFormModule,
13 SharedGlobalIconModule
14 ],
15
16 declarations: [
17 LiveStreamInformationComponent
18 ],
19
20 exports: [
21 LiveStreamInformationComponent
22 ],
23
24 providers: [
25 LiveVideoService
26 ]
27})
28export class SharedVideoLiveModule { }