X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fshared%2Fshared-video-playlist%2Fvideo-playlist-element-miniature.component.ts;h=ea58d7f76a675b5cbfd40e1b442762732218dd56;hb=ae9809a7d021fcaf01ee482a9c6c59fdd50125a6;hp=57a5fbe619caca89a7c015e9011b1f6658cbfb25;hpb=67ed6552b831df66713bac9e672738796128d33f;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
index 57a5fbe61..ea58d7f76 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element-miniature.component.ts
@@ -2,9 +2,8 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, In
 import { AuthService, Notifier, ServerService } from '@app/core'
 import { Video } from '@app/shared/shared-main'
 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
-import { I18n } from '@ngx-translate/i18n-polyfill'
-import { ServerConfig, VideoPlaylistElementType, VideoPlaylistElementUpdate } from '@shared/models'
-import { secondsToTime } from '../../../assets/player/utils'
+import { secondsToTime } from '@shared/core-utils'
+import { HTMLServerConfig, VideoPlaylistElementType, VideoPlaylistElementUpdate } from '@shared/models'
 import { VideoPlaylistElement } from './video-playlist-element.model'
 import { VideoPlaylist } from './video-playlist.model'
 import { VideoPlaylistService } from './video-playlist.service'
@@ -38,24 +37,18 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
     stopTimestamp: number
   } = {} as any
 
-  private serverConfig: ServerConfig
+  private serverConfig: HTMLServerConfig
 
   constructor (
     private authService: AuthService,
     private serverService: ServerService,
     private notifier: Notifier,
-    private i18n: I18n,
     private videoPlaylistService: VideoPlaylistService,
     private cdr: ChangeDetectorRef
   ) {}
 
   ngOnInit (): void {
-    this.serverConfig = this.serverService.getTmpConfig()
-    this.serverService.getConfig()
-        .subscribe(config => {
-          this.serverConfig = config
-          this.cdr.detectChanges()
-        })
+    this.serverConfig = this.serverService.getHTMLConfig()
   }
 
   isUnavailable (e: VideoPlaylistElement) {
@@ -73,14 +66,14 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
   buildRouterLink () {
     if (!this.playlist) return null
 
-    return [ '/videos/watch/playlist', this.playlist.uuid ]
+    return VideoPlaylist.buildWatchUrl(this.playlist)
   }
 
   buildRouterQuery () {
     if (!this.playlistElement || !this.playlistElement.video) return {}
 
     return {
-      videoId: this.playlistElement.video.uuid,
+      playlistPosition: this.playlistElement.position,
       start: this.playlistElement.startTimestamp,
       stop: this.playlistElement.stopTimestamp,
       resume: true
@@ -95,15 +88,14 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
     const videoId = this.playlistElement.video ? this.playlistElement.video.id : undefined
 
     this.videoPlaylistService.removeVideoFromPlaylist(this.playlist.id, playlistElement.id, videoId)
-        .subscribe(
-          () => {
-            this.notifier.success(this.i18n('Video removed from {{name}}', { name: this.playlist.displayName }))
-
+        .subscribe({
+          next: () => {
+            this.notifier.success($localize`Video removed from ${this.playlist.displayName}`)
             this.elementRemoved.emit(playlistElement)
           },
 
-          err => this.notifier.error(err.message)
-        )
+          error: err => this.notifier.error(err.message)
+        })
 
     this.moreDropdown.close()
   }
@@ -115,9 +107,9 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
     body.stopTimestamp = this.timestampOptions.stopTimestampEnabled ? this.timestampOptions.stopTimestamp : null
 
     this.videoPlaylistService.updateVideoOfPlaylist(this.playlist.id, playlistElement.id, body, this.playlistElement.video.id)
-        .subscribe(
-          () => {
-            this.notifier.success(this.i18n('Timestamps updated'))
+        .subscribe({
+          next: () => {
+            this.notifier.success($localize`Timestamps updated`)
 
             playlistElement.startTimestamp = body.startTimestamp
             playlistElement.stopTimestamp = body.stopTimestamp
@@ -125,8 +117,8 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
             this.cdr.detectChanges()
           },
 
-          err => this.notifier.error(err.message)
-        )
+          error: err => this.notifier.error(err.message)
+        })
 
     this.moreDropdown.close()
   }
@@ -140,10 +132,10 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
 
     if (start === null && stop === null) return ''
 
-    if (start !== null && stop === null) return this.i18n('Starts at ') + startFormatted
-    if (start === null && stop !== null) return this.i18n('Stops at ') + stopFormatted
+    if (start !== null && stop === null) return $localize`Starts at ` + startFormatted
+    if (start === null && stop !== null) return $localize`Stops at ` + stopFormatted
 
-    return this.i18n('Starts at ') + startFormatted + this.i18n(' and stops at ') + stopFormatted
+    return $localize`Starts at ` + startFormatted + $localize` and stops at ` + stopFormatted
   }
 
   onDropdownOpenChange () {
@@ -174,9 +166,6 @@ export class VideoPlaylistElementMiniatureComponent implements OnInit {
       }
     }
 
-    // FIXME: why do we have to use setTimeout here?
-    setTimeout(() => {
-      this.cdr.detectChanges()
-    })
+    this.cdr.markForCheck()
   }
 }