3 files changed, 20 insertions, 13 deletions

diff --git a/client/src/app/videos/shared/video.model.ts b/client/src/app/videos/shared/video.model.ts
index f0556343f..438791368 100644
--- a/client/src/app/videos/shared/video.model.ts
+++ b/client/src/app/videos/shared/video.model.ts
@@ -1,4 +1,4 @@
-import { Video as VideoServerModel } from '../../../../../shared'
+import { Video as VideoServerModel, VideoFile } from '../../../../../shared'
 import { User } from '../../shared'
 
 export class Video implements VideoServerModel {
@@ -17,7 +17,6 @@ export class Video implements VideoServerModel {
   id: number
   uuid: string
   isLocal: boolean
-  magnetUri: string
   name: string
   podHost: string
   tags: string[]
@@ -29,6 +28,7 @@ export class Video implements VideoServerModel {
   likes: number
   dislikes: number
   nsfw: boolean
+  files: VideoFile[]
 
   private static createByString (author: string, podHost: string) {
     return author + '@' + podHost
@@ -57,7 +57,6 @@ export class Video implements VideoServerModel {
     id: number,
     uuid: string,
     isLocal: boolean,
-    magnetUri: string,
     name: string,
     podHost: string,
     tags: string[],
@@ -66,7 +65,8 @@ export class Video implements VideoServerModel {
     views: number,
     likes: number,
     dislikes: number,
-    nsfw: boolean
+    nsfw: boolean,
+    files: VideoFile[]
   }) {
     this.author = hash.author
     this.createdAt = new Date(hash.createdAt)
@@ -82,7 +82,6 @@ export class Video implements VideoServerModel {
     this.id = hash.id
     this.uuid = hash.uuid
     this.isLocal = hash.isLocal
-    this.magnetUri = hash.magnetUri
     this.name = hash.name
     this.podHost = hash.podHost
     this.tags = hash.tags
@@ -94,6 +93,7 @@ export class Video implements VideoServerModel {
     this.likes = hash.likes
     this.dislikes = hash.dislikes
     this.nsfw = hash.nsfw
+    this.files = hash.files
 
     this.by = Video.createByString(hash.author, hash.podHost)
   }
@@ -115,6 +115,13 @@ export class Video implements VideoServerModel {
     return (this.nsfw && (!user || user.displayNSFW === false))
   }
 
+  getDefaultMagnetUri () {
+    if (this.files === undefined || this.files.length === 0) return ''
+
+    // TODO: choose the original file
+    return this.files[0].magnetUri
+  }
+
   patch (values: Object) {
     Object.keys(values).forEach((key) => {
       this[key] = values[key]
@@ -132,7 +139,6 @@ export class Video implements VideoServerModel {
       duration: this.duration,
       id: this.id,
       isLocal: this.isLocal,
-      magnetUri: this.magnetUri,
       name: this.name,
       podHost: this.podHost,
       tags: this.tags,
@@ -140,7 +146,8 @@ export class Video implements VideoServerModel {
       views: this.views,
       likes: this.likes,
       dislikes: this.dislikes,
-      nsfw: this.nsfw
+      nsfw: this.nsfw,
+      files: this.files
     }
   }
 }
diff --git a/client/src/app/videos/video-watch/video-magnet.component.html b/client/src/app/videos/video-watch/video-magnet.component.html
index 3fa82f1be..5b0324e37 100644
--- a/client/src/app/videos/video-watch/video-magnet.component.html
+++ b/client/src/app/videos/video-watch/video-magnet.component.html
@@ -10,7 +10,7 @@
       </div>
 
       <div class="modal-body">
-        <input #magnetUriInput (click)="magnetUriInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="video.magnetUri" />
+        <input #magnetUriInput (click)="magnetUriInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="video.getDefaultMagnetUri()" />
       </div>
     </div>
   </div>
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 cd11aa33c..255757692 100644
--- a/client/src/app/videos/video-watch/video-watch.component.ts
+++ b/client/src/app/videos/video-watch/video-watch.component.ts
@@ -90,8 +90,8 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     window.clearInterval(this.torrentInfosInterval)
     window.clearTimeout(this.errorTimer)
 
-    if (this.video !== null && this.webTorrentService.has(this.video.magnetUri)) {
-      this.webTorrentService.remove(this.video.magnetUri)
+    if (this.video !== null && this.webTorrentService.has(this.video.getDefaultMagnetUri())) {
+      this.webTorrentService.remove(this.video.getDefaultMagnetUri())
     }
 
     // Remove player
@@ -108,13 +108,13 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     // We are loading the video
     this.loading = true
 
-    console.log('Adding ' + this.video.magnetUri + '.')
+    console.log('Adding ' + this.video.getDefaultMagnetUri() + '.')
 
     // The callback might never return if there are network issues
     // So we create a timer to inform the user the load is abnormally long
     this.errorTimer = window.setTimeout(() => this.loadTooLong(), VideoWatchComponent.LOADTIME_TOO_LONG)
 
-    const torrent = this.webTorrentService.add(this.video.magnetUri, torrent => {
+    const torrent = this.webTorrentService.add(this.video.getDefaultMagnetUri(), torrent => {
       // Clear the error timer
       window.clearTimeout(this.errorTimer)
       // Maybe the error was fired by the timer, so reset it
@@ -123,7 +123,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
       // We are not loading the video anymore
       this.loading = false
 
-      console.log('Added ' + this.video.magnetUri + '.')
+      console.log('Added ' + this.video.getDefaultMagnetUri() + '.')
       torrent.files[0].renderTo(this.playerElement, (err) => {
         if (err) {
           this.notificationsService.error('Error', 'Cannot append the file in the video element.')