From 0951e445ac07d5995585f730aab6e5cc73697636 Mon Sep 17 00:00:00 2001
From: Isaac Abadi <IsaacMGrynsztein@gmail.com>
Date: Mon, 20 Jun 2022 16:05:37 -0400
Subject: [PATCH] Removed modify playlsit component

---
 src/app/app.module.ts                         |   2 -
 .../custom-playlists.component.ts             |   1 -
 .../create-playlist.component.ts              |   2 +-
 .../modify-playlist.component.html            |  44 --------
 .../modify-playlist.component.scss            |  45 --------
 .../modify-playlist.component.spec.ts         |  25 -----
 .../modify-playlist.component.ts              | 103 ------------------
 7 files changed, 1 insertion(+), 221 deletions(-)
 delete mode 100644 src/app/dialogs/modify-playlist/modify-playlist.component.html
 delete mode 100644 src/app/dialogs/modify-playlist/modify-playlist.component.scss
 delete mode 100644 src/app/dialogs/modify-playlist/modify-playlist.component.spec.ts
 delete mode 100644 src/app/dialogs/modify-playlist/modify-playlist.component.ts

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 238e9e8..ef53d84 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -73,7 +73,6 @@ import { ManageUserComponent } from './components/manage-user/manage-user.compon
 import { ManageRoleComponent } from './components/manage-role/manage-role.component';
 import { CookiesUploaderDialogComponent } from './dialogs/cookies-uploader-dialog/cookies-uploader-dialog.component';
 import { LogsViewerComponent } from './components/logs-viewer/logs-viewer.component';
-import { ModifyPlaylistComponent } from './dialogs/modify-playlist/modify-playlist.component';
 import { ConfirmDialogComponent } from './dialogs/confirm-dialog/confirm-dialog.component';
 import { UnifiedFileCardComponent } from './components/unified-file-card/unified-file-card.component';
 import { RecentVideosComponent } from './components/recent-videos/recent-videos.component';
@@ -121,7 +120,6 @@ registerLocaleData(es, 'es');
         ManageRoleComponent,
         CookiesUploaderDialogComponent,
         LogsViewerComponent,
-        ModifyPlaylistComponent,
         ConfirmDialogComponent,
         UnifiedFileCardComponent,
         RecentVideosComponent,
diff --git a/src/app/components/custom-playlists/custom-playlists.component.ts b/src/app/components/custom-playlists/custom-playlists.component.ts
index 3dec80a..1a2faa3 100644
--- a/src/app/components/custom-playlists/custom-playlists.component.ts
+++ b/src/app/components/custom-playlists/custom-playlists.component.ts
@@ -3,7 +3,6 @@ import { PostsService } from 'app/posts.services';
 import { Router } from '@angular/router';
 import { MatDialog } from '@angular/material/dialog';
 import { CreatePlaylistComponent } from 'app/create-playlist/create-playlist.component';
-import { ModifyPlaylistComponent } from 'app/dialogs/modify-playlist/modify-playlist.component';
 import { Playlist } from 'api-types';
 
 @Component({
diff --git a/src/app/create-playlist/create-playlist.component.ts b/src/app/create-playlist/create-playlist.component.ts
index 7ec41b0..1a5c40a 100644
--- a/src/app/create-playlist/create-playlist.component.ts
+++ b/src/app/create-playlist/create-playlist.component.ts
@@ -10,7 +10,7 @@ import { Playlist } from 'api-types';
   styleUrls: ['./create-playlist.component.scss']
 })
 export class CreatePlaylistComponent implements OnInit {
-  // really "createPlaylistDialogComponent"
+  // really "createAndModifyPlaylistDialogComponent"
 
   filesToSelectFrom = null;
   type = null;
diff --git a/src/app/dialogs/modify-playlist/modify-playlist.component.html b/src/app/dialogs/modify-playlist/modify-playlist.component.html
deleted file mode 100644
index 6c234c3..0000000
--- a/src/app/dialogs/modify-playlist/modify-playlist.component.html
+++ /dev/null
@@ -1,44 +0,0 @@
-<h4 mat-dialog-title><ng-container i18n="Modify playlist dialog title">Modify playlist</ng-container></h4>
-
-<mat-dialog-content>
-    <div *ngIf="playlist">
-        <!-- Playlist info -->
-        <div>
-            <mat-form-field color="accent">
-                <input matInput placeholder="Name" i18n-placeholder="Name" [(ngModel)]="playlist.name">
-            </mat-form-field>
-        </div>
-
-        <div>
-            <mat-checkbox [(ngModel)]="playlist.randomize_order"><ng-container i18n="Randomize order when playing checkbox label">Randomize order when playing</ng-container></mat-checkbox>
-        </div>
-
-        <div style="margin-bottom: 10px; height: 40px;">
-            <div style="float: left">
-                <span *ngIf="reverse_order === false" i18n="Normal order">Normal order&nbsp;</span>
-                <span *ngIf="reverse_order === true" i18n="Reverse order">Reverse order&nbsp;</span>
-                <button (click)="togglePlaylistOrder()" mat-icon-button><mat-icon>{{!reverse_order ? 'arrow_downward' : 'arrow_upward'}}</mat-icon></button>
-            </div>
-
-            <div style="float: right">
-                <button [disabled]="available_files.length === 0" mat-stroked-button [matMenuTriggerFor]="menu"><ng-container i18n="Add content">Add content</ng-container></button>
-            </div>
-        </div>
-
-        <!-- Playlist order -->
-        <mat-button-toggle-group class="media-list" cdkDropList (cdkDropListDropped)="drop($event)" style="width: 80%; left: 9%" vertical name="videoSelect" aria-label="Video Select" #group="matButtonToggleGroup">
-            <!-- The following for loop can be optimized but it requires a pipe https://stackoverflow.com/a/35703364/8088021 -->
-            <mat-button-toggle class="media-box" cdkDrag *ngFor="let playlist_item of (reverse_order ? playlist_file_objs.slice().reverse() : playlist_file_objs); let i = index" [checked]="false"><div><div class="playlist-item-text">{{playlist_item.title}}</div> <button (click)="removeContent(i)" class="remove-item-button" mat-icon-button><mat-icon>cancel</mat-icon></button></div></mat-button-toggle>
-        </mat-button-toggle-group>
-        
-        <mat-menu #menu="matMenu">
-            <button *ngFor="let file of available_files" (click)="addContent(file)" mat-menu-item>{{file.title}}</button>
-        </mat-menu>
-    </div>
-
-</mat-dialog-content>
-
-<mat-dialog-actions>
-    <!-- Save -->
-    <button [disabled]="!playlist || !playlistChanged()" (click)="updatePlaylist()" mat-raised-button color="accent"><ng-container i18n="Save">Save</ng-container></button>
-</mat-dialog-actions>
\ No newline at end of file
diff --git a/src/app/dialogs/modify-playlist/modify-playlist.component.scss b/src/app/dialogs/modify-playlist/modify-playlist.component.scss
deleted file mode 100644
index 0be9a78..0000000
--- a/src/app/dialogs/modify-playlist/modify-playlist.component.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-.media-list {
-    
-}
-  
-.media-box {
-
-}
-  
-.cdk-drag-preview {
-box-sizing: border-box;
-border-radius: 4px;
-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
-            0 8px 10px 1px rgba(0, 0, 0, 0.14),
-            0 3px 14px 2px rgba(0, 0, 0, 0.12);
-}
-  
-.cdk-drag-placeholder {
-opacity: 0;
-}
-
-.cdk-drag-animating {
-transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.media-box:last-child {
-border: none;
-}
-
-.media-list.cdk-drop-list-dragging .media-box:not(.cdk-drag-placeholder) {
-transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.remove-item-button {
-    right: 10px;
-    position: absolute;
-    top: 4px;
-}
-
-.playlist-item-text {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    max-width: 70%;
-    margin: 0 auto;
-}
\ No newline at end of file
diff --git a/src/app/dialogs/modify-playlist/modify-playlist.component.spec.ts b/src/app/dialogs/modify-playlist/modify-playlist.component.spec.ts
deleted file mode 100644
index b724b87..0000000
--- a/src/app/dialogs/modify-playlist/modify-playlist.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { ModifyPlaylistComponent } from './modify-playlist.component';
-
-describe('ModifyPlaylistComponent', () => {
-  let component: ModifyPlaylistComponent;
-  let fixture: ComponentFixture<ModifyPlaylistComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [ ModifyPlaylistComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(ModifyPlaylistComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
diff --git a/src/app/dialogs/modify-playlist/modify-playlist.component.ts b/src/app/dialogs/modify-playlist/modify-playlist.component.ts
deleted file mode 100644
index ae53c16..0000000
--- a/src/app/dialogs/modify-playlist/modify-playlist.component.ts
+++ /dev/null
@@ -1,103 +0,0 @@
-import { Component, OnInit, Inject } from '@angular/core';
-import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
-import { PostsService } from 'app/posts.services';
-import { DatabaseFile, Playlist } from 'api-types';
-
-@Component({
-  selector: 'app-modify-playlist',
-  templateUrl: './modify-playlist.component.html',
-  styleUrls: ['./modify-playlist.component.scss']
-})
-export class ModifyPlaylistComponent implements OnInit {
-
-  playlist_id: string = null;
-
-  original_playlist: Playlist = null;
-  playlist: Playlist = null;
-  playlist_file_objs: DatabaseFile[] = null;
-
-  available_files = [];
-  all_files = [];
-  playlist_updated = false;
-  reverse_order = false;
-
-  constructor(@Inject(MAT_DIALOG_DATA) public data: any,
-              private postsService: PostsService,
-              public dialogRef: MatDialogRef<ModifyPlaylistComponent>) { }
-
-  ngOnInit(): void {
-    if (this.data) {
-      this.playlist_id = this.data.playlist_id;
-      this.getPlaylist();
-    }
-
-    this.reverse_order = localStorage.getItem('default_playlist_order_reversed') === 'true';
-  }
-
-  getFiles(): void {
-    this.postsService.getAllFiles().subscribe(res => {
-      this.processFiles(res['files']);
-    });
-  }
-
-  processFiles(new_files: DatabaseFile[] = null): void {
-    if (new_files) { this.all_files = new_files; }
-    this.available_files = this.all_files.filter(e => !this.playlist_file_objs.includes(e))
-  }
-
-  updatePlaylist(): void {
-    this.playlist['uids'] = this.playlist_file_objs.map(playlist_file_obj => playlist_file_obj['uid'])
-    this.postsService.updatePlaylist(this.playlist).subscribe(res => {
-      this.playlist_updated = true;
-      this.postsService.openSnackBar('Playlist updated successfully.');
-      this.getPlaylist();
-      this.postsService.playlists_changed.next(true);
-    });
-  }
-
-  playlistChanged(): boolean {
-    return JSON.stringify(this.playlist) !== JSON.stringify(this.original_playlist);
-  }
-
-  getPlaylist(): void {
-    this.postsService.getPlaylist(this.playlist_id, null, true).subscribe(res => {
-      if (res['playlist']) {
-        this.playlist = res['playlist'];
-        this.playlist_file_objs = res['file_objs'];
-        this.original_playlist = JSON.parse(JSON.stringify(this.playlist));
-        this.getFiles();
-      }
-    });
-  }
-
-  addContent(file: DatabaseFile): void {
-    this.playlist_file_objs.push(file);
-    this.playlist.uids.push(file.uid);
-    this.processFiles();
-  }
-
-  removeContent(index: number): void {
-    if (this.reverse_order) {
-      index = this.playlist_file_objs.length - 1 - index;
-    }
-    this.playlist_file_objs.splice(index, 1);
-    this.playlist.uids.splice(index, 1);
-    this.processFiles();
-  }
-
-  togglePlaylistOrder(): void {
-    this.reverse_order = !this.reverse_order;
-    localStorage.setItem('default_playlist_order_reversed', '' + this.reverse_order);
-  }
-
-  drop(event: CdkDragDrop<string[]>): void {
-    if (this.reverse_order) {
-      event.previousIndex = this.playlist_file_objs.length - 1 - event.previousIndex;
-      event.currentIndex = this.playlist_file_objs.length - 1 - event.currentIndex;
-    }
-    moveItemInArray(this.playlist_file_objs, event.previousIndex, event.currentIndex);
-    this.playlist.uids = this.playlist_file_objs.map(file => file.uid);
-  }
-
-}