aboutsummaryrefslogtreecommitdiff
path: root/ui/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'ui/src/app')
-rw-r--r--ui/src/app/app.component.html12
-rw-r--r--ui/src/app/app.component.ts25
-rw-r--r--ui/src/app/formats.ts39
3 files changed, 57 insertions, 19 deletions
diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 20a78b4..1a90d5f 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -26,20 +26,20 @@
<div class="col-md-5 add-url-component">
<div class="input-group">
<div class="input-group-prepend">
- <span class="input-group-text">Video quality</span>
+ <span class="input-group-text">Format</span>
</div>
- <select class="custom-select" name="quality" [(ngModel)]="quality" (change)="qualityChanged()" [disabled]="addInProgress || downloads.loading">
- <option *ngFor="let q of qualities" [ngValue]="q.id">{{ q.text }}</option>
+ <select class="custom-select" name="format" [(ngModel)]="format" (change)="formatChanged()" [disabled]="addInProgress || downloads.loading">
+ <option *ngFor="let f of formats" [ngValue]="f.id">{{ f.text }}</option>
</select>
</div>
</div>
<div class="col-md-4 add-url-component">
<div class="input-group">
<div class="input-group-prepend">
- <span class="input-group-text">Format</span>
+ <span class="input-group-text">Quality</span>
</div>
- <select class="custom-select" name="format" [(ngModel)]="format" (change)="formatChanged()" [disabled]="addInProgress || downloads.loading">
- <option *ngFor="let f of formats" [ngValue]="f.id">{{ f.text }}</option>
+ <select class="custom-select" name="quality" [(ngModel)]="quality" (change)="qualityChanged()" [disabled]="addInProgress || downloads.loading">
+ <option *ngFor="let q of qualities" [ngValue]="q.id">{{ q.text }}</option>
</select>
</div>
</div>
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts
index a86bbe1..28b9539 100644
--- a/ui/src/app/app.component.ts
+++ b/ui/src/app/app.component.ts
@@ -5,6 +5,7 @@ import { CookieService } from 'ngx-cookie-service';
import { DownloadsService, Status } from './downloads.service';
import { MasterCheckboxComponent } from './master-checkbox.component';
+import { Formats, Format, Quality } from './formats';
@Component({
selector: 'app-root',
@@ -13,20 +14,9 @@ import { MasterCheckboxComponent } from './master-checkbox.component';
})
export class AppComponent implements AfterViewInit {
addUrl: string;
- qualities: Array<Object> = [
- {id: "best", text: "Best"},
- {id: "1440p", text: "1440p"},
- {id: "1080p", text: "1080p"},
- {id: "720p", text: "720p"},
- {id: "480p", text: "480p"},
- {id: "audio", text: "Audio only"}
- ];
+ formats: Format[] = Formats;
+ qualities: Quality[];
quality: string;
- formats: Array<Object> = [
- {id: "any", text: "Any"},
- {id: "mp4", text: "MP4"},
- {id: "mp3", text: "MP3"}
- ];
format: string;
addInProgress = false;
@@ -45,6 +35,8 @@ export class AppComponent implements AfterViewInit {
constructor(public downloads: DownloadsService, private cookieService: CookieService) {
this.quality = cookieService.get('metube_quality') || 'best';
this.format = cookieService.get('metube_format') || 'any';
+ // Needs to be set or qualities won't automatically be set
+ this.setQualities()
}
ngAfterViewInit() {
@@ -77,6 +69,8 @@ export class AppComponent implements AfterViewInit {
formatChanged() {
this.cookieService.set('metube_format', this.format, { expires: 3650 });
+ // Updates to use qualities available
+ this.setQualities()
}
queueSelectionChanged(checked: number) {
@@ -87,6 +81,11 @@ export class AppComponent implements AfterViewInit {
this.doneDelSelected.nativeElement.disabled = checked == 0;
}
+ setQualities() {
+ // qualities for specific format
+ this.qualities = this.formats.find(el => el.id == this.format).qualities
+ }
+
addDownload(url?: string, quality?: string, format?: string) {
url = url ?? this.addUrl
quality = quality ?? this.quality
diff --git a/ui/src/app/formats.ts b/ui/src/app/formats.ts
new file mode 100644
index 0000000..5264cd0
--- /dev/null
+++ b/ui/src/app/formats.ts
@@ -0,0 +1,39 @@
+export interface Format {
+ id: string;
+ text: string;
+ qualities: Quality[];
+}
+
+export interface Quality {
+ id: string;
+ text: string;
+}
+
+export const Formats: Format[] = [
+ {
+ id: 'any',
+ text: 'Any',
+ qualities: [{ id: 'best', text: 'Best' }],
+ },
+ {
+ id: 'mp4',
+ text: 'MP4',
+ qualities: [
+ { id: 'best', text: 'Best' },
+ { id: '1440', text: '1440p' },
+ { id: '1080', text: '1080p' },
+ { id: '720', text: '720p' },
+ { id: '480', text: '480p' },
+ ],
+ },
+ {
+ id: 'mp3',
+ text: 'MP3',
+ qualities: [
+ { id: 'best', text: 'Best' },
+ { id: '128', text: '128 kbps' },
+ { id: '192', text: '192 kbps' },
+ { id: '320', text: '320 kbps' },
+ ],
+ },
+];
bgstack15