1 import { Component, ElementRef, Input, ViewChild } from '@angular/core'
2 import { Notifier } from '@app/core'
3 import { VideoDetails } from '../../../shared/video/video-details.model'
4 import { buildVideoEmbed, buildVideoLink } from '../../../../assets/player/utils'
5 import { I18n } from '@ngx-translate/i18n-polyfill'
6 import { NgbModal, NgbTabChangeEvent } from '@ng-bootstrap/ng-bootstrap'
7 import { VideoCaption } from '@shared/models'
8 import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
10 type Customizations = {
11 startAtCheckbox: boolean
14 stopAtCheckbox: boolean
17 subtitleCheckbox: boolean
29 selector: 'my-video-share',
30 templateUrl: './video-share.component.html',
31 styleUrls: [ './video-share.component.scss' ]
33 export class VideoShareComponent {
34 @ViewChild('modal', { static: true }) modal: ElementRef
36 @Input() video: VideoDetails = null
37 @Input() videoCaptions: VideoCaption[] = []
38 @Input() playlist: VideoPlaylist = null
40 activeId: 'url' | 'qrcode' | 'embed'
41 customizations: Customizations
42 isAdvancedCustomizationCollapsed = true
43 includeVideoInPlaylist = false
45 private currentVideoTimestamp: number
47 constructor (private modalService: NgbModal) { }
49 show (currentVideoTimestamp?: number) {
50 this.currentVideoTimestamp = currentVideoTimestamp
53 if (this.videoCaptions.length !== 0) {
54 subtitle = this.videoCaptions[0].language.id
57 this.customizations = {
58 startAtCheckbox: false,
59 startAt: currentVideoTimestamp ? Math.floor(currentVideoTimestamp) : 0,
61 stopAtCheckbox: false,
62 stopAt: this.video.duration,
64 subtitleCheckbox: false,
77 this.modalService.open(this.modal)
80 getVideoIframeCode () {
81 const options = this.getOptions(this.video.embedUrl)
83 const embedUrl = buildVideoLink(options)
84 return buildVideoEmbed(embedUrl)
88 const baseUrl = window.location.origin + '/videos/watch/' + this.video.uuid
89 const options = this.getOptions(baseUrl)
91 return buildVideoLink(options)
95 const base = window.location.origin + '/videos/watch/playlist/' + this.playlist.uuid
97 if (!this.includeVideoInPlaylist) return base
99 return base + '?videoId=' + this.video.uuid
103 return window.location.protocol === 'http:'
106 onTabChange (event: NgbTabChangeEvent) {
107 this.activeId = event.nextId as any
111 return this.activeId === 'embed'
115 return !!this.playlist
118 private getOptions (baseUrl?: string) {
122 startTime: this.customizations.startAtCheckbox ? this.customizations.startAt : undefined,
123 stopTime: this.customizations.stopAtCheckbox ? this.customizations.stopAt : undefined,
125 subtitle: this.customizations.subtitleCheckbox ? this.customizations.subtitle : undefined,
127 loop: this.customizations.loop,
128 autoplay: this.customizations.autoplay,
129 muted: this.customizations.muted,
131 title: this.customizations.title,
132 warningTitle: this.customizations.warningTitle,
133 controls: this.customizations.controls