From de322ad5d138187aca24aff080c2db58f9845d25 Mon Sep 17 00:00:00 2001 From: 1RandomDev <84292805+1RandomDev@users.noreply.github.com> Date: Mon, 6 Jun 2022 16:26:53 +0200 Subject: Added option for thumbnail only --- ui/src/app/formats.ts | 7 +++++++ 1 file changed, 7 insertions(+) (limited to 'ui/src') diff --git a/ui/src/app/formats.ts b/ui/src/app/formats.ts index 15be903..a3bf3e8 100644 --- a/ui/src/app/formats.ts +++ b/ui/src/app/formats.ts @@ -43,4 +43,11 @@ export const Formats: Format[] = [ { id: '128', text: '128 kbps' }, ], }, + { + id: 'thumbnail', + text: 'Thumbnail', + qualities: [ + { id: 'best', text: 'Best' } + ], + }, ]; -- cgit From bbfde99aeb84d226a0de3ea15a439d18766d7ee4 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 29 Aug 2022 19:02:00 -0400 Subject: Use angular primitives to toggle --- ui/src/app/app.component.html | 20 ++++++++++++++++---- ui/src/app/app.component.sass | 3 +++ ui/src/app/app.component.ts | 5 +++++ 3 files changed, 24 insertions(+), 4 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 74425aa..0d607d7 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -47,10 +47,22 @@
- +
+ + +
+ Action + Another action + Something else here +
+ Separated link +
+
diff --git a/ui/src/app/app.component.sass b/ui/src/app/app.component.sass index 517af03..656fac2 100644 --- a/ui/src/app/app.component.sass +++ b/ui/src/app/app.component.sass @@ -9,6 +9,9 @@ .add-url-component margin: 0.5rem auto +.add-url-group + width: 100% + button.add-url width: 100% diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index a9b46a3..f9e5a41 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -19,6 +19,7 @@ export class AppComponent implements AfterViewInit { quality: string; format: string; addInProgress = false; + showFolderDropdown = false; darkMode: boolean; @ViewChild('queueMasterCheckbox') queueMasterCheckbox: MasterCheckboxComponent; @@ -114,6 +115,10 @@ export class AppComponent implements AfterViewInit { this.quality = exists ? this.quality : 'best' } + clickFolderDropdown() { + this.showFolderDropdown = !this.showFolderDropdown; + } + addDownload(url?: string, quality?: string, format?: string) { url = url ?? this.addUrl quality = quality ?? this.quality -- cgit From 4a9f55adda55a35c67c5e6699aa71fa56295c9b4 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 29 Aug 2022 20:27:34 -0400 Subject: Propagate configuration on load via downloads socket --- ui/src/app/app.component.html | 17 ++++++++--------- ui/src/app/app.component.ts | 14 +++++++++----- ui/src/app/downloads.service.ts | 6 ++++++ 3 files changed, 23 insertions(+), 14 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 0d607d7..e58e007 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -47,20 +47,19 @@
-
+
- -
- Action - Another action - Something else here -
- Separated link +
+
+ Download Folder + +
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index f9e5a41..f48b934 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -18,8 +18,8 @@ export class AppComponent implements AfterViewInit { qualities: Quality[]; quality: string; format: string; + folder: string; addInProgress = false; - showFolderDropdown = false; darkMode: boolean; @ViewChild('queueMasterCheckbox') queueMasterCheckbox: MasterCheckboxComponent; @@ -73,6 +73,14 @@ export class AppComponent implements AfterViewInit { this.cookieService.set('metube_quality', this.quality, { expires: 3650 }); } + showAdvanced() { + return this.downloads.configuration['CUSTOM_DIR'] == 'true'; + } + + folderChanged() { + console.log("folder changed", this.folder); + } + setupTheme(cookieService) { if (cookieService.check('metube_dark')) { this.darkMode = cookieService.get('metube_dark') === "true" @@ -115,10 +123,6 @@ export class AppComponent implements AfterViewInit { this.quality = exists ? this.quality : 'best' } - clickFolderDropdown() { - this.showFolderDropdown = !this.showFolderDropdown; - } - addDownload(url?: string, quality?: string, format?: string) { url = url ?? this.addUrl quality = quality ?? this.quality diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index 8580a70..eb7bac3 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -33,6 +33,7 @@ export class DownloadsService { done = new Map(); queueChanged = new Subject(); doneChanged = new Subject(); + configuration = {}; constructor(private http: HttpClient, private socket: MeTubeSocket) { socket.fromEvent('all').subscribe((strdata: string) => { @@ -74,6 +75,11 @@ export class DownloadsService { this.done.delete(data); this.doneChanged.next(null); }); + socket.fromEvent('configuration').subscribe((strdata: string) => { + let data: string = JSON.parse(strdata); + console.debug("got configuration:", data); + this.configuration = data; + }) } handleHTTPError(error: HttpErrorResponse) { -- cgit From ebb62e370ab944dd232bca571ed375f1de9a318b Mon Sep 17 00:00:00 2001 From: PikuZheng Date: Tue, 30 Aug 2022 08:40:01 +0800 Subject: add autocomplete="off" spellcheck="false" #175 it's also useful on android --- ui/src/app/app.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 74425aa..e96ee0d 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -26,7 +26,7 @@
- +
-- cgit From f79c8fa7542822cd3edd542d646fc5881d3bb80e Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 29 Aug 2022 20:41:21 -0400 Subject: pass custom_directories from server to client --- ui/src/app/app.component.sass | 3 +++ ui/src/app/downloads.service.ts | 10 ++++++++-- 2 files changed, 11 insertions(+), 2 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.sass b/ui/src/app/app.component.sass index 656fac2..d95fc0d 100644 --- a/ui/src/app/app.component.sass +++ b/ui/src/app/app.component.sass @@ -15,6 +15,9 @@ button.add-url width: 100% +.folder-dropdown-menu + width: 500px + $metube-section-color-bg: rgba(0,0,0,.07) .metube-section-header diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index eb7bac3..018f225 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -34,6 +34,7 @@ export class DownloadsService { queueChanged = new Subject(); doneChanged = new Subject(); configuration = {}; + custom_directories = {}; constructor(private http: HttpClient, private socket: MeTubeSocket) { socket.fromEvent('all').subscribe((strdata: string) => { @@ -76,10 +77,15 @@ export class DownloadsService { this.doneChanged.next(null); }); socket.fromEvent('configuration').subscribe((strdata: string) => { - let data: string = JSON.parse(strdata); + let data = JSON.parse(strdata); console.debug("got configuration:", data); this.configuration = data; - }) + }); + socket.fromEvent('custom_directories').subscribe((strdata: string) => { + let data = JSON.parse(strdata); + console.debug("got custom_directories:", data); + this.custom_directories = data["directories"]; + }); } handleHTTPError(error: HttpErrorResponse) { -- cgit From 67be71cdeb3c7b33a8397d4cf91ab74075749063 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 29 Aug 2022 21:11:25 -0400 Subject: load selectize --- ui/src/styles.sass | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/src') diff --git a/ui/src/styles.sass b/ui/src/styles.sass index 5d54ecb..68bef4f 100644 --- a/ui/src/styles.sass +++ b/ui/src/styles.sass @@ -1,4 +1,4 @@ /* You can add global styles to this file, and also import other style files */ /* Importing Bootstrap SCSS file. */ -@import '~bootstrap/scss/bootstrap' +@import '~bootstrap/scss/bootstrap' \ No newline at end of file -- cgit From 8abacc2a3610701e6258d9c79ee0c577ad2b2376 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 29 Aug 2022 21:52:54 -0400 Subject: almost functional with selectize --- ui/src/app/app.component.html | 3 ++- ui/src/app/app.component.ts | 16 ++++++++++++++-- ui/src/app/downloads.service.ts | 5 +++-- 3 files changed, 19 insertions(+), 5 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index e58e007..8af200c 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -58,7 +58,8 @@
Download Folder - +
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index f48b934..052e182 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -1,4 +1,4 @@ -import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core'; +import { Component, ViewChild, ElementRef, AfterViewInit, ChangeDetectorRef } from '@angular/core'; import { faTrashAlt, faCheckCircle, faTimesCircle } from '@fortawesome/free-regular-svg-icons'; import { faRedoAlt, faSun, faMoon, faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons'; import { CookieService } from 'ngx-cookie-service'; @@ -7,10 +7,13 @@ import { DownloadsService, Status } from './downloads.service'; import { MasterCheckboxComponent } from './master-checkbox.component'; import { Formats, Format, Quality } from './formats'; +// jQuery is loaded in angular.json for selectize +declare var $: any; + @Component({ selector: 'app-root', templateUrl: './app.component.html', - styleUrls: ['./app.component.sass'] + styleUrls: ['./app.component.sass'], }) export class AppComponent implements AfterViewInit { addUrl: string; @@ -19,6 +22,7 @@ export class AppComponent implements AfterViewInit { quality: string; format: string; folder: string; + customDirs: string[] = []; addInProgress = false; darkMode: boolean; @@ -28,6 +32,7 @@ export class AppComponent implements AfterViewInit { @ViewChild('doneDelSelected') doneDelSelected: ElementRef; @ViewChild('doneClearCompleted') doneClearCompleted: ElementRef; @ViewChild('doneClearFailed') doneClearFailed: ElementRef; + @ViewChild('folderSelect') folderSelect: ElementRef; faTrashAlt = faTrashAlt; faCheckCircle = faCheckCircle; @@ -46,6 +51,13 @@ export class AppComponent implements AfterViewInit { } ngAfterViewInit() { + // Trigger folderSelect to update + this.downloads.customDirsChanged.subscribe((dirs: string[]) => { + console.log("customDirsChanged:", dirs); + $(this.folderSelect.nativeElement).selectize({options: dirs}); + this.customDirs = dirs; + }); + this.downloads.queueChanged.subscribe(() => { this.queueMasterCheckbox.selectionChanged(); }); diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index 018f225..42ffe6d 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -33,8 +33,8 @@ export class DownloadsService { done = new Map(); queueChanged = new Subject(); doneChanged = new Subject(); + customDirsChanged = new Subject(); configuration = {}; - custom_directories = {}; constructor(private http: HttpClient, private socket: MeTubeSocket) { socket.fromEvent('all').subscribe((strdata: string) => { @@ -84,7 +84,8 @@ export class DownloadsService { socket.fromEvent('custom_directories').subscribe((strdata: string) => { let data = JSON.parse(strdata); console.debug("got custom_directories:", data); - this.custom_directories = data["directories"]; + let customDirectories = data["directories"]; + this.customDirsChanged.next(customDirectories); }); } -- cgit From ba712fc071398e615ead822c8bd81aad42a90c8f Mon Sep 17 00:00:00 2001 From: James Woglom Date: Tue, 30 Aug 2022 00:55:16 -0400 Subject: Fill in download_dir or audio_download_dir on launch --- ui/src/app/app.component.html | 3 +-- ui/src/app/app.component.sass | 5 +++++ ui/src/app/app.component.ts | 39 +++++++++++++++++++++++---------------- ui/src/app/app.module.ts | 4 +++- ui/src/app/downloads.service.ts | 11 +++++------ ui/src/styles.sass | 3 ++- 6 files changed, 39 insertions(+), 26 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 8af200c..23dccce 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -58,8 +58,7 @@
Download Folder - +
diff --git a/ui/src/app/app.component.sass b/ui/src/app/app.component.sass index d95fc0d..0f98556 100644 --- a/ui/src/app/app.component.sass +++ b/ui/src/app/app.component.sass @@ -18,6 +18,11 @@ button.add-url .folder-dropdown-menu width: 500px +.folder-dropdown-menu .input-group + display: flex + padding-left: 5px + padding-right: 5px + $metube-section-color-bg: rgba(0,0,0,.07) .metube-section-header diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index 052e182..e716395 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -1,15 +1,13 @@ -import { Component, ViewChild, ElementRef, AfterViewInit, ChangeDetectorRef } from '@angular/core'; +import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core'; import { faTrashAlt, faCheckCircle, faTimesCircle } from '@fortawesome/free-regular-svg-icons'; import { faRedoAlt, faSun, faMoon, faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons'; import { CookieService } from 'ngx-cookie-service'; +import { map, Observable, of } from 'rxjs'; import { DownloadsService, Status } from './downloads.service'; import { MasterCheckboxComponent } from './master-checkbox.component'; import { Formats, Format, Quality } from './formats'; -// jQuery is loaded in angular.json for selectize -declare var $: any; - @Component({ selector: 'app-root', templateUrl: './app.component.html', @@ -22,9 +20,9 @@ export class AppComponent implements AfterViewInit { quality: string; format: string; folder: string; - customDirs: string[] = []; addInProgress = false; darkMode: boolean; + customDirs$: Observable; @ViewChild('queueMasterCheckbox') queueMasterCheckbox: MasterCheckboxComponent; @ViewChild('queueDelSelected') queueDelSelected: ElementRef; @@ -32,7 +30,6 @@ export class AppComponent implements AfterViewInit { @ViewChild('doneDelSelected') doneDelSelected: ElementRef; @ViewChild('doneClearCompleted') doneClearCompleted: ElementRef; @ViewChild('doneClearFailed') doneClearFailed: ElementRef; - @ViewChild('folderSelect') folderSelect: ElementRef; faTrashAlt = faTrashAlt; faCheckCircle = faCheckCircle; @@ -50,14 +47,11 @@ export class AppComponent implements AfterViewInit { this.setupTheme(cookieService) } - ngAfterViewInit() { - // Trigger folderSelect to update - this.downloads.customDirsChanged.subscribe((dirs: string[]) => { - console.log("customDirsChanged:", dirs); - $(this.folderSelect.nativeElement).selectize({options: dirs}); - this.customDirs = dirs; - }); + ngOnInit() { + this.customDirs$ = this.getMatchingCustomDir(); + } + ngAfterViewInit() { this.downloads.queueChanged.subscribe(() => { this.queueMasterCheckbox.selectionChanged(); }); @@ -86,11 +80,24 @@ export class AppComponent implements AfterViewInit { } showAdvanced() { - return this.downloads.configuration['CUSTOM_DIR'] == 'true'; + return this.downloads.configuration['CUSTOM_DIRS'] == 'true'; } - folderChanged() { - console.log("folder changed", this.folder); + allowCustomDir() { + return this.downloads.configuration['CREATE_DIRS'] == 'true'; + } + + getMatchingCustomDir() : Observable { + return this.downloads.customDirs.asObservable().pipe(map((output) => { + // Keep logic consistent with app/ytdl.py + if (this.quality != 'audio' && this.format != 'mp3') { + console.debug("download_dir", output["download_dir"]) + return output["download_dir"]; + } else { + console.debug("audio_download_dir", output["audio_download_dir"]) + return output["audio_download_dir"]; + } + })); } setupTheme(cookieService) { diff --git a/ui/src/app/app.module.ts b/ui/src/app/app.module.ts index 6ad5978..8eddbca 100644 --- a/ui/src/app/app.module.ts +++ b/ui/src/app/app.module.ts @@ -10,6 +10,7 @@ import { AppComponent } from './app.component'; import { EtaPipe, SpeedPipe, EncodeURIComponent } from './downloads.pipe'; import { MasterCheckboxComponent, SlaveCheckboxComponent } from './master-checkbox.component'; import { MeTubeSocket } from './metube-socket'; +import { NgSelectModule } from '@ng-select/ng-select'; @NgModule({ declarations: [ @@ -25,7 +26,8 @@ import { MeTubeSocket } from './metube-socket'; FormsModule, NgbModule, HttpClientModule, - FontAwesomeModule + FontAwesomeModule, + NgSelectModule ], providers: [CookieService, MeTubeSocket], bootstrap: [AppComponent] diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index 42ffe6d..1fd75e3 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -1,6 +1,6 @@ import { Injectable } from '@angular/core'; import { HttpClient, HttpErrorResponse } from '@angular/common/http'; -import { of, Subject } from 'rxjs'; +import { Observable, of, Subject } from 'rxjs'; import { catchError } from 'rxjs/operators'; import { MeTubeSocket } from './metube-socket'; @@ -33,7 +33,7 @@ export class DownloadsService { done = new Map(); queueChanged = new Subject(); doneChanged = new Subject(); - customDirsChanged = new Subject(); + customDirs = new Subject>(); configuration = {}; constructor(private http: HttpClient, private socket: MeTubeSocket) { @@ -81,11 +81,10 @@ export class DownloadsService { console.debug("got configuration:", data); this.configuration = data; }); - socket.fromEvent('custom_directories').subscribe((strdata: string) => { + socket.fromEvent('custom_dirs').subscribe((strdata: string) => { let data = JSON.parse(strdata); - console.debug("got custom_directories:", data); - let customDirectories = data["directories"]; - this.customDirsChanged.next(customDirectories); + console.debug("got custom_dirs:", data); + this.customDirs.next(data); }); } diff --git a/ui/src/styles.sass b/ui/src/styles.sass index 68bef4f..4ce00cc 100644 --- a/ui/src/styles.sass +++ b/ui/src/styles.sass @@ -1,4 +1,5 @@ /* You can add global styles to this file, and also import other style files */ /* Importing Bootstrap SCSS file. */ -@import '~bootstrap/scss/bootstrap' \ No newline at end of file +@import '~bootstrap/scss/bootstrap' +@import '~@ng-select/ng-select/themes/default.theme.css' \ No newline at end of file -- cgit From 52e3307d99b6f809c6a7a281b2a33bbc67c0e006 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Tue, 30 Aug 2022 00:58:19 -0400 Subject: switch between audio and default custom directories on change --- ui/src/app/app.component.ts | 10 +++++++--- ui/src/app/downloads.service.ts | 7 +++++-- 2 files changed, 12 insertions(+), 5 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index e716395..cdcd8f6 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -77,6 +77,8 @@ export class AppComponent implements AfterViewInit { qualityChanged() { this.cookieService.set('metube_quality', this.quality, { expires: 3650 }); + // Re-trigger custom directory change + this.downloads.customDirsChanged.next(this.downloads.customDirs); } showAdvanced() { @@ -88,13 +90,13 @@ export class AppComponent implements AfterViewInit { } getMatchingCustomDir() : Observable { - return this.downloads.customDirs.asObservable().pipe(map((output) => { + return this.downloads.customDirsChanged.asObservable().pipe(map((output) => { // Keep logic consistent with app/ytdl.py if (this.quality != 'audio' && this.format != 'mp3') { - console.debug("download_dir", output["download_dir"]) + console.debug("Showing default download directories"); return output["download_dir"]; } else { - console.debug("audio_download_dir", output["audio_download_dir"]) + console.debug("Showing audio-specific download directories"); return output["audio_download_dir"]; } })); @@ -125,6 +127,8 @@ export class AppComponent implements AfterViewInit { this.cookieService.set('metube_format', this.format, { expires: 3650 }); // Updates to use qualities available this.setQualities() + // Re-trigger custom directory change + this.downloads.customDirsChanged.next(this.downloads.customDirs); } queueSelectionChanged(checked: number) { diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index 1fd75e3..a2ea912 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -33,8 +33,10 @@ export class DownloadsService { done = new Map(); queueChanged = new Subject(); doneChanged = new Subject(); - customDirs = new Subject>(); + customDirsChanged = new Subject(); + configuration = {}; + customDirs = {}; constructor(private http: HttpClient, private socket: MeTubeSocket) { socket.fromEvent('all').subscribe((strdata: string) => { @@ -84,7 +86,8 @@ export class DownloadsService { socket.fromEvent('custom_dirs').subscribe((strdata: string) => { let data = JSON.parse(strdata); console.debug("got custom_dirs:", data); - this.customDirs.next(data); + this.customDirs = data; + this.customDirsChanged.next(data); }); } -- cgit From 63baa1fc25a7ee02832b043bb38470fe611cfb01 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Tue, 30 Aug 2022 01:22:24 -0400 Subject: Link to audio files and those with custom folders properly --- ui/src/app/app.component.html | 4 ++-- ui/src/app/app.component.ts | 36 +++++++++++++++++++++++++++--------- ui/src/app/downloads.service.ts | 7 ++++--- 3 files changed, 33 insertions(+), 14 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 23dccce..4ca9a07 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -129,11 +129,11 @@
- {{ download.value.title }} + {{ download.value.title }} {{ download.value.title }} - + diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index cdcd8f6..97ff020 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -4,7 +4,7 @@ import { faRedoAlt, faSun, faMoon, faExternalLinkAlt } from '@fortawesome/free-s import { CookieService } from 'ngx-cookie-service'; import { map, Observable, of } from 'rxjs'; -import { DownloadsService, Status } from './downloads.service'; +import { Download, DownloadsService, Status } from './downloads.service'; import { MasterCheckboxComponent } from './master-checkbox.component'; import { Formats, Format, Quality } from './formats'; @@ -89,15 +89,19 @@ export class AppComponent implements AfterViewInit { return this.downloads.configuration['CREATE_DIRS'] == 'true'; } + isAudioType() { + return this.quality == 'audio' || this.format == 'mp3'; + } + getMatchingCustomDir() : Observable { return this.downloads.customDirsChanged.asObservable().pipe(map((output) => { // Keep logic consistent with app/ytdl.py - if (this.quality != 'audio' && this.format != 'mp3') { - console.debug("Showing default download directories"); - return output["download_dir"]; - } else { + if (this.isAudioType()) { console.debug("Showing audio-specific download directories"); return output["audio_download_dir"]; + } else { + console.debug("Showing default download directories"); + return output["download_dir"]; } })); } @@ -146,13 +150,14 @@ export class AppComponent implements AfterViewInit { this.quality = exists ? this.quality : 'best' } - addDownload(url?: string, quality?: string, format?: string) { + addDownload(url?: string, quality?: string, format?: string, folder?: string) { url = url ?? this.addUrl quality = quality ?? this.quality format = format ?? this.format + folder = folder ?? this.folder this.addInProgress = true; - this.downloads.add(url, quality, format).subscribe((status: Status) => { + this.downloads.add(url, quality, format, folder).subscribe((status: Status) => { if (status.status === 'error') { alert(`Error adding URL: ${status.msg}`); } else { @@ -162,8 +167,8 @@ export class AppComponent implements AfterViewInit { }); } - retryDownload(key: string, url: string, quality: string, format: string) { - this.addDownload(url, quality, format); + retryDownload(key: string, url: string, quality: string, format: string, folder: string) { + this.addDownload(url, quality, format, folder); this.downloads.delById('done', [key]).subscribe(); } @@ -182,4 +187,17 @@ export class AppComponent implements AfterViewInit { clearFailedDownloads() { this.downloads.delByFilter('done', dl => dl.status === 'error').subscribe(); } + + buildDownloadLink(download: Download) { + let baseDir = 'download/'; + if (download.quality == 'audio' || download.filename.endsWith('.mp3')) { + baseDir = 'audio_download/'; + } + + if (download.folder) { + baseDir += download.folder + '/'; + } + + return baseDir + encodeURIComponent(download.filename); + } } diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index a2ea912..77d2fed 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -9,13 +9,14 @@ export interface Status { msg?: string; } -interface Download { +export interface Download { id: string; title: string; url: string, status: string; msg: string; filename: string; + folder: string; quality: string; percent: number; speed: number; @@ -96,8 +97,8 @@ export class DownloadsService { return of({status: 'error', msg: msg}) } - public add(url: string, quality: string, format: string) { - return this.http.post('add', {url: url, quality: quality, format: format}).pipe( + public add(url: string, quality: string, format: string, folder: string) { + return this.http.post('add', {url: url, quality: quality, format: format, folder: folder}).pipe( catchError(this.handleHTTPError) ); } -- cgit From e911105c19ab979f7dc2771e7ecf65f2746e711b Mon Sep 17 00:00:00 2001 From: James Woglom Date: Tue, 30 Aug 2022 01:29:55 -0400 Subject: fix button rounding when CUSTOM_DIRS=false --- ui/src/app/app.component.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index 4ca9a07..b31c441 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -47,12 +47,12 @@
-
+
-
-- cgit From 202813b9edf26ee269ef808f86f1bc646782d7a9 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 19 Sep 2022 15:00:26 -0400 Subject: CREATE_DIRS -> CREATE_CUSTOM_DIRS --- ui/src/app/app.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index 97ff020..eae1ba9 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -86,7 +86,7 @@ export class AppComponent implements AfterViewInit { } allowCustomDir() { - return this.downloads.configuration['CREATE_DIRS'] == 'true'; + return this.downloads.configuration['CREATE_CUSTOM_DIRS'] == 'true'; } isAudioType() { -- cgit From a07e1ed06c65bb473219ba4bf0372aabd35afee4 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 19 Sep 2022 15:31:46 -0400 Subject: bugfix: resolve full base directory before startswith check --- ui/src/app/app.component.ts | 1 + 1 file changed, 1 insertion(+) (limited to 'ui/src') diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index eae1ba9..20db8b8 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -156,6 +156,7 @@ export class AppComponent implements AfterViewInit { format = format ?? this.format folder = folder ?? this.folder + console.debug('Downloading: url='+url+' quality='+quality+' format='+format+' folder='+folder); this.addInProgress = true; this.downloads.add(url, quality, format, folder).subscribe((status: Status) => { if (status.status === 'error') { -- cgit From a36323677c99ee5696934843b720081553a2b1d2 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 19 Sep 2022 16:15:24 -0400 Subject: attempt to fix issue where folder is sent by frontend as {folder: "foo"} instead of string --- ui/src/app/app.component.ts | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index 20db8b8..7ef7da4 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -85,8 +85,11 @@ export class AppComponent implements AfterViewInit { return this.downloads.configuration['CUSTOM_DIRS'] == 'true'; } - allowCustomDir() { - return this.downloads.configuration['CREATE_CUSTOM_DIRS'] == 'true'; + allowCustomDir(tag: string) { + if (this.downloads.configuration['CREATE_CUSTOM_DIRS'] == 'true') { + return tag; + } + return false; } isAudioType() { -- cgit From 2517933eaf2742a25b2a645ba0004cee71d52589 Mon Sep 17 00:00:00 2001 From: James Woglom Date: Mon, 19 Sep 2022 16:56:43 -0400 Subject: use bind --- ui/src/app/app.component.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html index b31c441..1f53798 100644 --- a/ui/src/app/app.component.html +++ b/ui/src/app/app.component.html @@ -58,7 +58,7 @@
Download Folder - +
-- cgit From 18466312ff5b114f9d79f1282e12a386feb1edf7 Mon Sep 17 00:00:00 2001 From: Chris Kanich Date: Fri, 3 Feb 2023 10:33:51 -0600 Subject: unique downloads of identically named videos --- ui/src/app/downloads.service.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/downloads.service.ts b/ui/src/app/downloads.service.ts index 77d2fed..e1a134d 100644 --- a/ui/src/app/downloads.service.ts +++ b/ui/src/app/downloads.service.ts @@ -52,20 +52,20 @@ export class DownloadsService { }); socket.fromEvent('added').subscribe((strdata: string) => { let data: Download = JSON.parse(strdata); - this.queue.set(data.id, data); + this.queue.set(data.url, data); this.queueChanged.next(null); }); socket.fromEvent('updated').subscribe((strdata: string) => { let data: Download = JSON.parse(strdata); - let dl: Download = this.queue.get(data.id); + let dl: Download = this.queue.get(data.url); data.checked = dl.checked; data.deleting = dl.deleting; - this.queue.set(data.id, data); + this.queue.set(data.url, data); }); socket.fromEvent('completed').subscribe((strdata: string) => { let data: Download = JSON.parse(strdata); - this.queue.delete(data.id); - this.done.set(data.id, data); + this.queue.delete(data.url); + this.done.set(data.url, data); this.queueChanged.next(null); this.doneChanged.next(null); }); @@ -110,7 +110,7 @@ export class DownloadsService { public delByFilter(where: string, filter: (dl: Download) => boolean) { let ids: string[] = []; - this[where].forEach((dl: Download) => { if (filter(dl)) ids.push(dl.id) }); + this[where].forEach((dl: Download) => { if (filter(dl)) ids.push(dl.url) }); return this.delById(where, ids); } } -- cgit From ea7a7b07113362718687dfbc778ae35323498e01 Mon Sep 17 00:00:00 2001 From: Alex Shnitman Date: Sat, 4 Feb 2023 11:09:36 +0200 Subject: Fix boolean env variables (closes #213) --- ui/src/app/app.component.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'ui/src') diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index 7ef7da4..d4a1270 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -82,11 +82,11 @@ export class AppComponent implements AfterViewInit { } showAdvanced() { - return this.downloads.configuration['CUSTOM_DIRS'] == 'true'; + return this.downloads.configuration['CUSTOM_DIRS']; } allowCustomDir(tag: string) { - if (this.downloads.configuration['CREATE_CUSTOM_DIRS'] == 'true') { + if (this.downloads.configuration['CREATE_CUSTOM_DIRS']) { return tag; } return false; -- cgit