X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fvideos%2Frecommendations%2Frecommended-videos.component.ts;h=a6f3bce3d36b01cbe066a218b4a91a6bc864fd79;hb=5c20a45518c3afc40c9494cad4a78def92e5e288;hp=68fd750ccb9f64786e74fa993fde45c2947dd34f;hpb=0a57bbff2141de718aa901bfbdd147468fd624c6;p=github%2FChocobozzz%2FPeerTube.git

diff --git a/client/src/app/videos/recommendations/recommended-videos.component.ts b/client/src/app/videos/recommendations/recommended-videos.component.ts
index 68fd750cc..a6f3bce3d 100644
--- a/client/src/app/videos/recommendations/recommended-videos.component.ts
+++ b/client/src/app/videos/recommendations/recommended-videos.component.ts
@@ -1,29 +1,71 @@
-import { Component, Input, OnChanges } from '@angular/core'
 import { Observable } from 'rxjs'
-import { Video } from '@app/shared/video/video.model'
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core'
+import { AuthService, Notifier } from '@app/core'
+import { User } from '@app/shared'
+import { SessionStorageService } from '@app/shared/misc/storage.service'
+import { UserService } from '@app/shared/users/user.service'
+import { VideoPlaylist } from '@app/shared/video-playlist/video-playlist.model'
 import { RecommendationInfo } from '@app/shared/video/recommendation-info.model'
+import { MiniatureDisplayOptions } from '@app/shared/video/video-miniature.component'
+import { Video } from '@app/shared/video/video.model'
 import { RecommendedVideosStore } from '@app/videos/recommendations/recommended-videos.store'
-import { User } from '@app/shared'
+import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
   selector: 'my-recommended-videos',
-  templateUrl: './recommended-videos.component.html'
+  templateUrl: './recommended-videos.component.html',
+  styleUrls: [ './recommended-videos.component.scss' ]
 })
-export class RecommendedVideosComponent implements OnChanges {
+export class RecommendedVideosComponent implements OnInit, OnChanges {
   @Input() inputRecommendation: RecommendationInfo
-  @Input() user: User
+  @Input() playlist: VideoPlaylist
+  @Output() gotRecommendations = new EventEmitter<Video[]>()
+
+  autoPlayNextVideo: boolean
+  autoPlayNextVideoTooltip: string
+
+  displayOptions: MiniatureDisplayOptions = {
+    date: true,
+    views: true,
+    by: true,
+    avatar: true
+  }
+
+  userMiniature: User
 
   readonly hasVideos$: Observable<boolean>
   readonly videos$: Observable<Video[]>
 
   constructor (
-    private store: RecommendedVideosStore
+    private userService: UserService,
+    private authService: AuthService,
+    private notifier: Notifier,
+    private i18n: I18n,
+    private store: RecommendedVideosStore,
+    private sessionStorageService: SessionStorageService
   ) {
     this.videos$ = this.store.recommendations$
     this.hasVideos$ = this.store.hasRecommendations$
+    this.videos$.subscribe(videos => this.gotRecommendations.emit(videos))
+
+    if (this.authService.isLoggedIn()) {
+      this.autoPlayNextVideo = this.authService.getUser().autoPlayNextVideo
+    } else {
+      this.autoPlayNextVideo = this.sessionStorageService.getItem(User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true' || false
+      this.sessionStorageService.watch([User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO]).subscribe(
+        () => this.autoPlayNextVideo = this.sessionStorageService.getItem(User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO) === 'true'
+      )
+    }
+
+    this.autoPlayNextVideoTooltip = this.i18n('When active, the next video is automatically played after the current one.')
   }
 
-  public ngOnChanges (): void {
+  ngOnInit () {
+    this.userService.getAnonymousOrLoggedUser()
+      .subscribe(user => this.userMiniature = user)
+  }
+
+  ngOnChanges () {
     if (this.inputRecommendation) {
       this.store.requestNewRecommendations(this.inputRecommendation)
     }
@@ -32,4 +74,21 @@ export class RecommendedVideosComponent implements OnChanges {
   onVideoRemoved () {
     this.store.requestNewRecommendations(this.inputRecommendation)
   }
+
+  switchAutoPlayNextVideo () {
+    this.sessionStorageService.setItem(User.KEYS.SESSION_STORAGE_AUTO_PLAY_NEXT_VIDEO, this.autoPlayNextVideo.toString())
+
+    if (this.authService.isLoggedIn()) {
+      const details = {
+        autoPlayNextVideo: this.autoPlayNextVideo
+      }
+
+      this.userService.updateMyProfile(details).subscribe(
+        () => {
+          this.authService.refreshUserInformation()
+        },
+        err => this.notifier.error(err.message)
+      )
+    }
+  }
 }