avancement dans la connexion avec le back de la page user/myPlaylist

src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.html

@@ -19,7 +19,7 @@
 
             <!-- liste des playlist -->
             <mat-grid-tile colspan="4" rowspan="1" class="celluleListePlaylist">
-                <app-playlist-list (eventEmitter)="transmitToVideoList($event)"></app-playlist-list>
+                <app-playlist-list (eventEmitter)="transmitPlaylistToVideoList($event)"></app-playlist-list>
             </mat-grid-tile>
 
             <!-- pub -->

src/app/user/myPlaylists/page-my-playlists/page-my-playlists.component.ts

@@ -4,6 +4,7 @@ import {Advert} from "../../../utils/interfaces/advert";
 import {MessageService} from "../../../utils/services/message/message.service";
 import {PlaylistDB} from "../../../utils/interfaces/playlist";
 import {HttpParams} from "@angular/common/http";
+import {subscribeOn} from "rxjs/operators";
 
 
 
@@ -43,9 +44,22 @@ export class PageMyPlaylistsComponent implements OnInit
     }
 
 
-    transmitToVideoList(playlist): void
+    transmitPlaylistToVideoList(playlist): void
     {
-        this.playlist = playlist;
+        this.messageService
+            .get("playlist/findOne/"+playlist.id)
+            .subscribe(ret => this.afterReceivingPlaylistWithVideo(ret), err => this.afterReceivingPlaylistWithVideo(err));
+    }
+
+
+    afterReceivingPlaylistWithVideo(retour: any): void
+    {
+        if(retour.status !== "success") {
+            console.log(retour);
+        }
+        else {
+            this.playlist = retour.data;
+        }
     }
 
 }

src/app/user/myPlaylists/video-list/video-list.component.html

@@ -38,7 +38,7 @@
 
                             <!-- btnAdd -->
                             <mat-grid-tile [colspan]="2" [rowspan]="1">
-                                <button mat-icon-button (click)="onAdd(video)">
+                                <button mat-icon-button (click)="onAddToPlaylist(video)">
                                     <mat-icon> add_circle </mat-icon>
                                 </button>
                             </mat-grid-tile>

src/app/user/myPlaylists/video-list/video-list.component.ts

@@ -1,14 +1,10 @@
-import {Component, Input, OnChanges, OnInit, SimpleChanges} from '@angular/core';
+import {Component, Input, OnChanges, SimpleChanges} from '@angular/core';
 import {ThemeService} from "../../../utils/services/theme/theme.service";
-import {VideoAll, VideoDB} from "../../../utils/interfaces/video";
 import {AddVideoToPlaylistsService} from "../../utils/services/addVideoToPlaylists/add-video-to-playlists.service";
 import {MessageService} from "../../../utils/services/message/message.service";
-import {PlaylistDB} from "../../../utils/interfaces/playlist";
 import {MatSnackBar} from "@angular/material/snack-bar";
 import {UserHistoryService} from "../../utils/services/userHistory/userHistory.service";
-import {FictitiousVideosService} from "../../../utils/services/fictitiousDatas/fictitiousVideos/fictitious-videos.service";
 import {Router} from "@angular/router";
-import {HttpParams} from "@angular/common/http";
 import {ProfilService} from "../../../utils/services/profil/profil.service";
 
 
@@ -18,110 +14,68 @@ import {ProfilService} from "../../../utils/services/profil/profil.service";
     templateUrl: './video-list.component.html',
     styleUrls: ['./video-list.component.scss']
 })
-export class VideoListComponent implements OnChanges, OnInit
+export class VideoListComponent implements OnChanges
 {
     @Input() playlist: any;
-    videosInPlaylist: VideoAll[] = [];
+    videosInPlaylist: any[] = [];
-    allUserVideos: VideoAll[] = this.fictitiousVideosService.get_TAB_VIDEO();
 
 
     constructor( private messageService: MessageService,
                  public themeService: ThemeService,
-                 private addVideoToPlaylistService: AddVideoToPlaylistsService,
+                 private addVideoToPlaylistsService: AddVideoToPlaylistsService,
                  private snackBar: MatSnackBar,
-                 public fictitiousVideosService: FictitiousVideosService,
                  private historiqueService: UserHistoryService,
                  private profilService: ProfilService,
                  private router: Router ) { }
 
 
-    ngOnInit(): void
-    {
-        let params = new HttpParams();
-        params = params.append("userId", this.profilService.id);
-        console.log("id: " + this.profilService.id);
-        this.messageService
-            .get("video/findAll", params)
-            .subscribe(ret => this.afterReceivingUserVideo(ret), err => this.afterReceivingUserVideo(err));
-    }
-
-
-    afterReceivingUserVideo(retour: any)
-    {
-        console.log("afterReceivingUserVideo: ");
-        console.log(retour);
-
-        if(retour.status !== "success") {
-            //console.log(retour);
-        }
-        else {
-            this.allUserVideos = retour.data;
-            this.reloadVideoInPlaylist();
-        }
-    }
-
-
     ngOnChanges(changes: SimpleChanges): void
     {
         console.log("ngOnChanges:");
         console.log(this.playlist);
-        this.reloadVideoInPlaylist();
+        if((this.playlist !== null) && (this.playlist !== undefined)) this.videosInPlaylist = this.playlist.videos;
     }
 
 
-    reloadVideoInPlaylist(): void
+    onAddToPlaylist(video: any): void
     {
-        if((this.playlist !== null) && (this.playlist !== undefined))
+        this.addVideoToPlaylistsService.run(video.videoId, video.source, video.interest);
-        {
-            this.videosInPlaylist = [];
-            for(let _idVideo of this.playlist.videoIds)
-            {
-                const video = this.allUserVideos.find(video => video._id === _idVideo);
-                this.videosInPlaylist.push(video);
-            }
-        }
     }
 
 
-    onAdd(video: VideoAll): void
+    onDelete(video0: any, indexVideo: number): void
     {
-        //this.addVideoToPlaylistService.run(video);
+        let _idsVideo = this.videosInPlaylist.filter( x => (x._id !== video0._id) );
+        _idsVideo = _idsVideo.map( x => x._id );
+
+        console.log("_idsVideo:");
+        console.log(_idsVideo);
+
+        this.messageService
+            .put("playlist/update/"+this.playlist._id, {videoIds: _idsVideo})
+            .subscribe( ret => this.onDeleteCallback(ret, indexVideo), err => this.onDeleteCallback(err, indexVideo));
     }
 
 
-    onDelete(video0: VideoAll, indexVideo: number): void
+    onDeleteCallback(retour: any, indexVideo: number): void
     {
-        // --- FAUX CODE ---
+        console.log("onDeleteCallback:" );
-        this.playlist.videoIds.splice(indexVideo, 1);
+        console.log(retour);
+
+        if(retour.status !== "success") {
+            //console.log(retour);
+        }
+        else {
+            this.playlist.videos.splice(indexVideo, 1);
             this.videosInPlaylist.splice(indexVideo, 1);
-
             let message = "La video a bien été supprimé de la playlist";
             const config = { duration: 1000, panelClass: "custom-class" };
             this.snackBar.open( message, "", config);
-
-        // --- VRAI CODE ---
-        /*
-        this.messageService
-            .sendMessage("user/delete/video", {video: video0, playlist: this.playlist})
-            .subscribe( retour => {
-
-                let message = "" ;
-                if(retour.status === "error") message = "Echec de l'opération" ;
-                else {
-                    message = "La video a bien été supprimé de la playlist" ;
-                    this.playlist.videos.splice(index, 1);
         }
-                const config = { duration: 1000, panelClass: "custom-class" };
-                this.snackBar.open( message, "", config);
-            })
-        */
-
-        //Pour relier les collections "Videos" et "Playlists", on a mis l'attribut "playlistIds" dans "Videos"
-        // Mais en vrai, ça serai plus facile pour moi si on mettait plutot un attribut "videoIds" dans "Playlists"
     }
 
 
-    onVideo(video: VideoDB): void
+    onVideo(video: any): void
     {
         const url = "user/watching/fromMyPlaylists/" + video.videoId + '/' + this.playlist._id;
         this.router.navigateByUrl(url);

src/app/user/utils/components/popup-add-video-to-playlists/popup-add-video-to-playlists.component.ts

@@ -41,7 +41,8 @@ export class PopupAddVideoToPlaylistsComponent implements OnInit
 
         for(let playlist of this.data.playlists)
         {
-            playlist["isSelected"] = false;
+            if(playlist.videoIds.includes(this._idVideo)) playlist["isSelected"] = true;
+            else playlist["isSelected"] = false;
             this.tabPlaylistAndBool.push(playlist);
         }
     }