aboutsummaryrefslogtreecommitdiff
path: root/ui/src
diff options
context:
space:
mode:
authorJames Woglom <j@wogloms.net>2022-08-29 20:27:34 -0400
committerJames Woglom <j@wogloms.net>2022-08-29 20:27:34 -0400
commit4a9f55adda55a35c67c5e6699aa71fa56295c9b4 (patch)
tree74b3868fc121efdd88e2c1f64b14789b4f7750ab /ui/src
parentUse angular primitives to toggle (diff)
downloadmetube-4a9f55adda55a35c67c5e6699aa71fa56295c9b4.tar.gz
metube-4a9f55adda55a35c67c5e6699aa71fa56295c9b4.tar.bz2
metube-4a9f55adda55a35c67c5e6699aa71fa56295c9b4.zip
Propagate configuration on load via downloads socket
Diffstat (limited to 'ui/src')
-rw-r--r--ui/src/app/app.component.html17
-rw-r--r--ui/src/app/app.component.ts14
-rw-r--r--ui/src/app/downloads.service.ts6
3 files changed, 23 insertions, 14 deletions
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 @@
</div>
</div>
<div class="col-md-3 add-url-component">
- <div class="btn-group add-url-group">
+ <div class="btn-group add-url-group" ngbDropdown #advancedDropdown="ngbDropdown" display="dynamic" placement="bottom-end">
<button class="btn btn-primary add-url" type="submit" (click)="addDownload()" [disabled]="addInProgress || downloads.loading">
<span class="spinner-border spinner-border-sm" role="status" id="add-spinner" *ngIf="addInProgress"></span>
{{ addInProgress ? "Adding..." : "Add" }}
</button>
- <button class="btn btn-primary set-download-folder dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" type="button" (click)="clickFolderDropdown()" [disabled]="addInProgress || downloads.loading">
- <span class="sr-only">Set download folder</span>
+ <button class="btn btn-primary dropdown-toggle dropdown-toggle-split" id="advancedButton" type="button" [disabled]="addInProgress || downloads.loading" ngbDropdownAnchor (focus)="advancedDropdown.open()" *ngIf="showAdvanced()">
+ <span class="sr-only">Advanced options</span>
</button>
- <div class="dropdown-menu show" *ngIf="showFolderDropdown">
- <a class="dropdown-item" href="#">Action</a>
- <a class="dropdown-item" href="#">Another action</a>
- <a class="dropdown-item" href="#">Something else here</a>
- <div class="dropdown-divider"></div>
- <a class="dropdown-item" href="#">Separated link</a>
+ <div ngbDropdownMenu aria-labelledby="advancedButton" class="dropdown-menu dropdown-menu-end folder-dropdown-menu">
+ <div class="input-group">
+ <span class="input-group-text">Download Folder</span>
+ <input type="text" class="form-select" name="folder" [(ngModel)]="folder" (change)="folderChanged()" [disabled]="addInProgress || downloads.loading" />
+ </div>
</div>
</div>
</div>
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<string, Download>();
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) {
bgstack15