Merge branch 'master' of https://github.com/Tzahi12345/YoutubeDL-Material into cleaner-playlists-and-settings

src/app/components/custom-playlists/custom-playlists.component.ts

@@ -24,10 +24,17 @@ export class CustomPlaylistsComponent implements OnInit {
         this.getAllPlaylists();
       }
     });
+
+    this.postsService.playlists_changed.subscribe(changed => {
+      if (changed) {
+        this.getAllPlaylists();
+      }
+    });
   }
 
   getAllPlaylists() {
     this.playlists_received = false;
+    // must call getAllFiles as we need to get category playlists as well
     this.postsService.getAllFiles().subscribe(res => {
       this.playlists = res['playlists'];
       this.playlists_received = true;

src/app/components/recent-videos/recent-videos.component.html

@@ -32,7 +32,7 @@
         <div class="row justify-content-center">
             <ng-container *ngIf="normal_files_received && paged_data">
                 <div *ngFor="let file of paged_data; let i = index" class="mb-2 mt-2 d-flex justify-content-center" [ngClass]="[ postsService.card_size === 'small' ? 'col-2 small-col' : '', postsService.card_size === 'medium' ? 'col-6 col-lg-4 medium-col' : '', postsService.card_size === 'large' ? 'col-12 large-col' : '' ]">
-                    <app-unified-file-card [index]="i" [card_size]="postsService.card_size" [locale]="postsService.locale" (goToFile)="goToFile($event)" (goToSubscription)="goToSubscription($event)" [file_obj]="file" [use_youtubedl_archive]="postsService.config['Downloader']['use_youtubedl_archive']" [loading]="false" (deleteFile)="deleteFile($event)" [baseStreamPath]="postsService.path" [jwtString]="postsService.isLoggedIn ? '?jwt=' + this.postsService.token : ''"></app-unified-file-card>
+                    <app-unified-file-card [index]="i" [card_size]="postsService.card_size" [locale]="postsService.locale" (goToFile)="goToFile($event)" (goToSubscription)="goToSubscription($event)" [file_obj]="file" [use_youtubedl_archive]="postsService.config['Downloader']['use_youtubedl_archive']" [availablePlaylists]="playlists" (addFileToPlaylist)="addFileToPlaylist($event)" [loading]="false" (deleteFile)="deleteFile($event)" [baseStreamPath]="postsService.path" [jwtString]="postsService.isLoggedIn ? '?jwt=' + this.postsService.token : ''"></app-unified-file-card>
                 </div>
                 <div *ngIf="filtered_files.length === 0">
                     <ng-container i18n="No videos found">No videos found.</ng-container>

src/app/components/recent-videos/recent-videos.component.ts

@@ -50,6 +50,8 @@ export class RecentVideosComponent implements OnInit {
     }
   };
   filterProperty = this.filterProperties['upload_date'];
+  
+  playlists = null;
 
   pageSize = 10;
   paged_data = null;
@@ -68,14 +70,27 @@ export class RecentVideosComponent implements OnInit {
   ngOnInit(): void {
     if (this.postsService.initialized) {
       this.getAllFiles();
+      this.getAllPlaylists();
     }
 
     this.postsService.service_initialized.subscribe(init => {
       if (init) {
         this.getAllFiles();
+        this.getAllPlaylists();
       }
     });
 
+    this.postsService.files_changed.subscribe(changed => {
+      if (changed) {
+        this.getAllFiles();
+      }
+    });
+
+    this.postsService.playlists_changed.subscribe(changed => {
+      if (changed) {
+        this.getAllPlaylists();
+      }
+    });
 
     // set filter property to cached
     const cached_filter_property = localStorage.getItem('filter_property');
@@ -84,6 +99,12 @@ export class RecentVideosComponent implements OnInit {
     }
   }
 
+  getAllPlaylists() {
+    this.postsService.getPlaylists().subscribe(res => {
+      this.playlists = res['playlists'];
+    });
+  }
+
   // search
 
   onSearchInputChanged(newvalue) {
@@ -288,6 +309,23 @@ export class RecentVideosComponent implements OnInit {
     this.filterByProperty(this.filterProperty['property']);
   }
 
+  addFileToPlaylist(info_obj) {
+    const file = info_obj['file'];
+    const playlist_id = info_obj['playlist_id'];
+    const playlist = this.playlists.find(potential_playlist => potential_playlist['id'] === playlist_id);
+    this.postsService.addFileToPlaylist(playlist_id, file['uid']).subscribe(res => {
+      if (res['success']) {
+        this.postsService.openSnackBar(`Successfully added ${file.title} to ${playlist.title}!`);
+        this.postsService.playlists_changed.next(true);
+      } else {
+        this.postsService.openSnackBar(`Failed to add ${file.title} to ${playlist.title}! Unknown error.`);
+      }
+    }, err => {
+      console.error(err);
+      this.postsService.openSnackBar(`Failed to add ${file.title} to ${playlist.title}! See browser console for error.`);
+    });
+  }
+
   // sorting and filtering
 
   sortFiles(a, b) {

src/app/components/unified-file-card/unified-file-card.component.html

@@ -23,6 +23,12 @@
         <ng-container *ngIf="!is_playlist && !loading">
             <button (click)="openFileInfoDialog()" mat-menu-item><mat-icon>info</mat-icon><ng-container i18n="Video info button">Info</ng-container></button>
             <button (click)="navigateToSubscription()" mat-menu-item *ngIf="file_obj.sub_id"><mat-icon>{{file_obj.isAudio ? 'library_music' : 'video_library'}}</mat-icon>&nbsp;<ng-container i18n="Go to subscription menu item">Go to subscription</ng-container></button>
+            <button *ngIf="availablePlaylists" [matMenuTriggerFor]="addtoplaylist" mat-menu-item><mat-icon>playlist_add</mat-icon>&nbsp;<ng-container i18n="Add to playlist menu item">Add to playlist</ng-container></button>
+            <mat-menu #addtoplaylist="matMenu">
+                <ng-container *ngFor="let playlist of availablePlaylists">
+                    <button *ngIf="(playlist.type === 'audio') === file_obj.isAudio" [disabled]="playlist.uids?.includes(file_obj.uid)" (click)="emitAddFileToPlaylist(playlist.id)" mat-menu-item>{{playlist.name}}</button>
+                </ng-container>
+            </mat-menu>
             <mat-divider></mat-divider>
             <button *ngIf="file_obj.sub_id" (click)="emitDeleteFile()" mat-menu-item>
                 <mat-icon>restore</mat-icon><ng-container i18n="Delete and redownload subscription video button">Delete and redownload</ng-container>

src/app/components/unified-file-card/unified-file-card.component.ts

@@ -46,9 +46,11 @@ export class UnifiedFileCardComponent implements OnInit {
   @Input() locale = null;
   @Input() baseStreamPath = null;
   @Input() jwtString = null;
+  @Input() availablePlaylists = null;
   @Output() goToFile = new EventEmitter<any>();
   @Output() goToSubscription = new EventEmitter<any>();
   @Output() deleteFile = new EventEmitter<any>();
+  @Output() addFileToPlaylist = new EventEmitter<any>();
   @Output() editPlaylist = new EventEmitter<any>();
 
 
@@ -86,6 +88,13 @@ export class UnifiedFileCardComponent implements OnInit {
     });
   }
 
+  emitAddFileToPlaylist(playlist_id) {
+    this.addFileToPlaylist.emit({
+      file: this.file_obj,
+      playlist_id: playlist_id
+    });
+  }
+
   navigateToFile(event) {
     this.goToFile.emit({file: this.file_obj, event: event});
   }

src/app/dialogs/modify-playlist/modify-playlist.component.ts

@@ -57,6 +57,7 @@ export class ModifyPlaylistComponent implements OnInit {
       this.playlist_updated = true;
       this.postsService.openSnackBar('Playlist updated successfully.');
       this.getPlaylist();
+      this.postsService.playlists_changed.next(true);
     });
   }
 

src/app/main/main.component.ts

@@ -951,8 +951,6 @@ export class MainComponent implements OnInit {
   }
 
   reloadRecentVideos() {
-    if (this.recentVideos) {
-      this.recentVideos.getAllFiles();
-    }
+    this.postsService.files_changed.next(true);
   }
 }

src/app/posts.services.ts

@@ -48,6 +48,9 @@ export class PostsService implements CanActivate {
     settings_changed = new BehaviorSubject<boolean>(false);
     open_create_default_admin_dialog = new BehaviorSubject<boolean>(false);
 
+    files_changed = new BehaviorSubject<boolean>(false);
+    playlists_changed = new BehaviorSubject<boolean>(false);
+
     // app status
     initialized = false;
 
@@ -192,8 +195,8 @@ export class PostsService implements CanActivate {
         return this.http.post(this.path + 'transferDB', {local_to_remote: local_to_remote}, this.httpOptions);
     }
 
-    testConnectionString() {
-        return this.http.post(this.path + 'testConnectionString', {}, this.httpOptions);
+    testConnectionString(connection_string) {
+        return this.http.post(this.path + 'testConnectionString', {connection_string: connection_string}, this.httpOptions);
     }
 
     killAllDownloads() {
@@ -334,18 +337,28 @@ export class PostsService implements CanActivate {
                                                             include_file_metadata: include_file_metadata}, this.httpOptions);
     }
 
+    getPlaylists() {
+        return this.http.post(this.path + 'getPlaylists', {}, this.httpOptions);
+    }
+
     updatePlaylist(playlist) {
         return this.http.post(this.path + 'updatePlaylist', {playlist: playlist}, this.httpOptions);
     }
 
-    updatePlaylistFiles(playlistID, fileNames, type) {
-        return this.http.post(this.path + 'updatePlaylistFiles', {playlistID: playlistID,
+    updatePlaylistFiles(playlist_id, fileNames, type) {
+        return this.http.post(this.path + 'updatePlaylistFiles', {playlist_id: playlist_id,
                                                             fileNames: fileNames,
                                                             type: type}, this.httpOptions);
     }
 
-    removePlaylist(playlistID, type) {
-        return this.http.post(this.path + 'deletePlaylist', {playlistID: playlistID, type: type}, this.httpOptions);
+    addFileToPlaylist(playlist_id, file_uid) {
+        return this.http.post(this.path + 'addFileToPlaylist', {playlist_id: playlist_id,
+                                                                file_uid: file_uid},
+                                                                this.httpOptions);
+    }
+
+    removePlaylist(playlist_id, type) {
+        return this.http.post(this.path + 'deletePlaylist', {playlist_id: playlist_id, type: type}, this.httpOptions);
     }
 
     // categories

src/app/settings/settings.component.html

@@ -300,7 +300,7 @@
                             </mat-form-field>
 
                             <div class="test-connection-div">
-                                <button (click)="testConnectionString()" [disabled]="testing_connection_string" mat-flat-button color="accent"><ng-container i18n="Test connection string button">Test connection string</ng-container></button>
+                                <button (click)="testConnectionString(new_config['Database']['mongodb_connection_string'])" [disabled]="testing_connection_string" mat-flat-button color="accent"><ng-container i18n="Test connection string button">Test connection string</ng-container></button>
                             </div>
 
                             <div class="transfer-db-div">

src/app/settings/settings.component.ts

@@ -311,9 +311,9 @@ export class SettingsComponent implements OnInit {
     });
   }
 
-  testConnectionString() {
+  testConnectionString(connection_string) {
     this.testing_connection_string = true;
-    this.postsService.testConnectionString().subscribe(res => {
+    this.postsService.testConnectionString(connection_string).subscribe(res => {
       this.testing_connection_string = false;
       if (res['success']) {
         this.postsService.openSnackBar('Connection successful!');