]>
Commit | Line | Data |
---|---|---|
63347a0f | 1 | import { Component, ElementRef, Input, ViewChild } from '@angular/core' |
11b8762f | 2 | import { buildVideoEmbed, buildVideoLink } from '../../../../assets/player/utils' |
2bc9bd08 | 3 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap' |
2f4c784a | 4 | import { VideoCaption } from '@shared/models' |
67ed6552 C |
5 | import { VideoDetails } from '@app/shared/shared-main' |
6 | import { VideoPlaylist } from '@app/shared/shared-video-playlist' | |
2f4c784a C |
7 | |
8 | type Customizations = { | |
9 | startAtCheckbox: boolean | |
10 | startAt: number | |
11 | ||
12 | stopAtCheckbox: boolean | |
13 | stopAt: number | |
14 | ||
15 | subtitleCheckbox: boolean | |
16 | subtitle: string | |
17 | ||
18 | loop: boolean | |
19 | autoplay: boolean | |
20 | muted: boolean | |
21 | title: boolean | |
22 | warningTitle: boolean | |
23 | controls: boolean | |
189ab8de | 24 | peertubeLink: boolean |
2f4c784a | 25 | } |
cf02fbfb C |
26 | |
27 | @Component({ | |
28 | selector: 'my-video-share', | |
c7e1e432 JL |
29 | templateUrl: './video-share.component.html', |
30 | styleUrls: [ './video-share.component.scss' ] | |
cf02fbfb C |
31 | }) |
32 | export class VideoShareComponent { | |
f36da21e | 33 | @ViewChild('modal', { static: true }) modal: ElementRef |
11b8762f | 34 | |
404b54e1 | 35 | @Input() video: VideoDetails = null |
2f4c784a | 36 | @Input() videoCaptions: VideoCaption[] = [] |
3a1fed11 | 37 | @Input() playlist: VideoPlaylist = null |
cf02fbfb | 38 | |
45c6bcf3 | 39 | activeId: 'url' | 'qrcode' | 'embed' = 'url' |
2f4c784a C |
40 | customizations: Customizations |
41 | isAdvancedCustomizationCollapsed = true | |
3a1fed11 | 42 | includeVideoInPlaylist = false |
2f4c784a | 43 | |
3a1fed11 | 44 | constructor (private modalService: NgbModal) { } |
cf02fbfb | 45 | |
11b8762f | 46 | show (currentVideoTimestamp?: number) { |
2f4c784a C |
47 | let subtitle: string |
48 | if (this.videoCaptions.length !== 0) { | |
49 | subtitle = this.videoCaptions[0].language.id | |
50 | } | |
51 | ||
52 | this.customizations = { | |
53 | startAtCheckbox: false, | |
54 | startAt: currentVideoTimestamp ? Math.floor(currentVideoTimestamp) : 0, | |
55 | ||
56 | stopAtCheckbox: false, | |
57 | stopAt: this.video.duration, | |
58 | ||
59 | subtitleCheckbox: false, | |
60 | subtitle, | |
61 | ||
62 | loop: false, | |
63 | autoplay: false, | |
64 | muted: false, | |
65 | ||
66 | // Embed options | |
67 | title: true, | |
68 | warningTitle: true, | |
189ab8de C |
69 | controls: true, |
70 | peertubeLink: true | |
2f4c784a | 71 | } |
11b8762f | 72 | |
24e7916c | 73 | this.modalService.open(this.modal, { centered: true }) |
cf02fbfb C |
74 | } |
75 | ||
df98563e | 76 | getVideoIframeCode () { |
2f4c784a | 77 | const options = this.getOptions(this.video.embedUrl) |
11b8762f | 78 | |
2f4c784a | 79 | const embedUrl = buildVideoLink(options) |
11b8762f | 80 | return buildVideoEmbed(embedUrl) |
cf02fbfb C |
81 | } |
82 | ||
df98563e | 83 | getVideoUrl () { |
3a1fed11 C |
84 | const baseUrl = window.location.origin + '/videos/watch/' + this.video.uuid |
85 | const options = this.getOptions(baseUrl) | |
2f4c784a C |
86 | |
87 | return buildVideoLink(options) | |
cf02fbfb | 88 | } |
2c8d4697 | 89 | |
3a1fed11 C |
90 | getPlaylistUrl () { |
91 | const base = window.location.origin + '/videos/watch/playlist/' + this.playlist.uuid | |
92 | ||
93 | if (!this.includeVideoInPlaylist) return base | |
94 | ||
03aff3c6 | 95 | return base + '?videoId=' + this.video.uuid |
2c8d4697 | 96 | } |
c7e1e432 | 97 | |
3a1fed11 C |
98 | notSecure () { |
99 | return window.location.protocol === 'http:' | |
c7e1e432 | 100 | } |
11b8762f | 101 | |
2f4c784a C |
102 | isInEmbedTab () { |
103 | return this.activeId === 'embed' | |
104 | } | |
105 | ||
3a1fed11 C |
106 | hasPlaylist () { |
107 | return !!this.playlist | |
108 | } | |
109 | ||
2f4c784a C |
110 | private getOptions (baseUrl?: string) { |
111 | return { | |
112 | baseUrl, | |
113 | ||
114 | startTime: this.customizations.startAtCheckbox ? this.customizations.startAt : undefined, | |
115 | stopTime: this.customizations.stopAtCheckbox ? this.customizations.stopAt : undefined, | |
116 | ||
117 | subtitle: this.customizations.subtitleCheckbox ? this.customizations.subtitle : undefined, | |
118 | ||
119 | loop: this.customizations.loop, | |
120 | autoplay: this.customizations.autoplay, | |
121 | muted: this.customizations.muted, | |
11b8762f | 122 | |
2f4c784a C |
123 | title: this.customizations.title, |
124 | warningTitle: this.customizations.warningTitle, | |
189ab8de C |
125 | controls: this.customizations.controls, |
126 | peertubeLink: this.customizations.peertubeLink | |
2f4c784a | 127 | } |
11b8762f | 128 | } |
cf02fbfb | 129 | } |