aboutsummaryrefslogtreecommitdiff
path: root/ui/src
diff options
context:
space:
mode:
authorAlex <alexta69@gmail.com>2021-11-20 10:14:03 +0200
committerGitHub <noreply@github.com>2021-11-20 10:14:03 +0200
commitf61ecc147636868027d957c8255903525022e198 (patch)
treef140c3c5ad806c197f1abcf259ad2db9bcc1323b /ui/src
parentfix breakage after upgrade (diff)
parentsimplified format handling (diff)
downloadmetube-f61ecc147636868027d957c8255903525022e198.tar.gz
metube-f61ecc147636868027d957c8255903525022e198.tar.bz2
metube-f61ecc147636868027d957c8255903525022e198.zip
Merge pull request #73 from asuyou/mp3-support
Added simple MP3 support
Diffstat (limited to 'ui/src')
-rw-r--r--ui/src/app/app.component.html2
-rw-r--r--ui/src/app/app.component.ts28
-rw-r--r--ui/src/app/formats.ts46
3 files changed, 62 insertions, 14 deletions
diff --git a/ui/src/app/app.component.html b/ui/src/app/app.component.html
index 20a78b4..039aab6 100644
--- a/ui/src/app/app.component.html
+++ b/ui/src/app/app.component.html
@@ -26,7 +26,7 @@
<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">Quality</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>
diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts
index 55f7e6e..26ae3c5 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,19 +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"}
- ];
format: string;
addInProgress = false;
@@ -42,8 +33,10 @@ export class AppComponent implements AfterViewInit {
faRedoAlt = faRedoAlt;
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()
+ this.quality = cookieService.get('metube_quality') || 'best';
}
ngAfterViewInit() {
@@ -76,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) {
@@ -86,6 +81,13 @@ 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
+ const exists = this.qualities.find(el => el.id === this.quality)
+ this.quality = exists ? this.quality : 'best'
+ }
+
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..15be903
--- /dev/null
+++ b/ui/src/app/formats.ts
@@ -0,0 +1,46 @@
+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: '1440', text: '1440p' },
+ { id: '1080', text: '1080p' },
+ { id: '720', text: '720p' },
+ { id: '480', text: '480p' },
+ { id: 'audio', text: 'Audio Only' },
+ ],
+ },
+ {
+ 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: '320', text: '320 kbps' },
+ { id: '192', text: '192 kbps' },
+ { id: '128', text: '128 kbps' },
+ ],
+ },
+];
bgstack15