Add to playlist dropdown

[github/Chocobozzz/PeerTube.git] / client / src / app / videos / +video-watch / video-watch.component.ts

diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index e1766255b2ee555b1205403ed93c8b0cf460ca1d..359217f3b8d4ed714449c265d1ec6ae9f7aac216 100644 (file)
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -8,7 +8,6 @@ import { MetaService } from '@ngx-meta/core'
 import { Notifier, ServerService } from '@app/core'
 import { forkJoin, Subscription } from 'rxjs'
 import { Hotkey, HotkeysService } from 'angular2-hotkeys'
-import * as WebTorrent from 'webtorrent'
 import { UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '../../../../../shared'
 import { AuthService, ConfirmService } from '../../core'
 import { RestExtractor, VideoBlacklistService } from '../../shared'
@@ -27,8 +26,7 @@ import {
   P2PMediaLoaderOptions,
   PeertubePlayerManager,
   PeertubePlayerManagerOptions,
-  PlayerMode,
-  WebtorrentOptions
+  PlayerMode
 } from '../../../assets/player/peertube-player-manager'
 
 @Component({
@@ -61,6 +59,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
   remoteServerDown = false
   hotkeys: Hotkey[]
 
+  private currentTime: number
   private paramsSub: Subscription
 
   constructor (
@@ -91,7 +90,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
 
   ngOnInit () {
     if (
-      WebTorrent.WEBRTC_SUPPORT === false ||
+      !!((window as any).RTCPeerConnection || (window as any).mozRTCPeerConnection || (window as any).webkitRTCPeerConnection) === false ||
       peertubeLocalStorage.getItem(VideoWatchComponent.LOCAL_STORAGE_PRIVACY_CONCERN_KEY) === 'true'
     ) {
       this.hasAlreadyAcceptedPrivacyConcern = true
@@ -116,9 +115,11 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
         )
         .subscribe(([ video, captionsResult ]) => {
           const startTime = this.route.snapshot.queryParams.start
+          const stopTime = this.route.snapshot.queryParams.stop
           const subtitle = this.route.snapshot.queryParams.subtitle
+          const playerMode = this.route.snapshot.queryParams.mode
 
-          this.onVideoFetched(video, captionsResult.data, { startTime, subtitle })
+          this.onVideoFetched(video, captionsResult.data, { startTime, stopTime, subtitle, playerMode })
               .catch(err => this.handleError(err))
         })
     })
@@ -220,7 +221,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
   showShareModal () {
     const currentTime = this.player ? this.player.currentTime() : undefined
 
-    this.videoShareModal.show(currentTime)
+    this.videoShareModal.show(this.currentTime)
   }
 
   showDownloadModal (event: Event) {
@@ -309,6 +310,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     return this.video && this.video.state.id === VideoState.TO_TRANSCODE
   }
 
+  isVideoDownloadable () {
+    return this.video && this.video.downloadEnabled
+  }
+
   isVideoToImport () {
     return this.video && this.video.state.id === VideoState.TO_IMPORT
   }
@@ -322,8 +327,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     this.setVideoDescriptionHTML()
   }
 
-  private setVideoDescriptionHTML () {
-    this.videoHTMLDescription = this.markdownService.textMarkdownToHTML(this.video.description)
+  private async setVideoDescriptionHTML () {
+    this.videoHTMLDescription = await this.markdownService.textMarkdownToHTML(this.video.description)
   }
 
   private setVideoLikesBarTooltipText () {
@@ -365,13 +370,18 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
         )
   }
 
-  private async onVideoFetched (video: VideoDetails, videoCaptions: VideoCaption[], urlOptions: { startTime: number, subtitle: string }) {
+  private async onVideoFetched (
+    video: VideoDetails,
+    videoCaptions: VideoCaption[],
+    urlOptions: { startTime?: number, stopTime?: number, subtitle?: string, playerMode?: string }
+  ) {
     this.video = video
 
     // Re init attributes
     this.descriptionLoading = false
     this.completeDescriptionShown = false
     this.remoteServerDown = false
+    this.currentTime = undefined
 
     let startTime = urlOptions.startTime || (this.video.userHistory ? this.video.userHistory.currentTime : 0)
     // If we are at the end of the video, reset the timer
@@ -413,6 +423,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
         inactivityTimeout: 2500,
         poster: this.video.previewUrl,
         startTime,
+        stopTime: urlOptions.stopTime,
 
         theaterMode: true,
         captions: videoCaptions.length !== 0,
@@ -440,10 +451,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
       }
     }
 
-    let mode: PlayerMode
-    const hlsPlaylist = this.video.getHlsPlaylist()
-    if (hlsPlaylist) {
-      mode = 'p2p-media-loader'
+    const mode: PlayerMode = urlOptions.playerMode === 'p2p-media-loader' ? 'p2p-media-loader' : 'webtorrent'
+
+    if (mode === 'p2p-media-loader') {
+      const hlsPlaylist = this.video.getHlsPlaylist()
 
       const p2pMediaLoader = {
         playlistUrl: hlsPlaylist.playlistUrl,
@@ -454,13 +465,15 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
       } as P2PMediaLoaderOptions
 
       Object.assign(options, { p2pMediaLoader })
-    } else {
-      mode = 'webtorrent'
     }
 
     this.zone.runOutsideAngular(async () => {
       this.player = await PeertubePlayerManager.initialize(mode, options)
       this.player.on('customError', ({ err }: { err: any }) => this.handleError(err))
+
+      this.player.on('timeupdate', () => {
+        this.currentTime = Math.floor(this.player.currentTime())
+      })
     })
 
     this.setVideoDescriptionHTML()