xorbitlab
/
metube
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use angular primitives to toggle

This commit is contained in:
James Woglom 2022-08-29 19:02:00 -04:00
parent 8857878ec2
commit bbfde99aeb
3 changed files with 24 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ui/src/app/app.component.html
View File

@ -47,10 +47,22 @@
</div> </div>
</div> </div>
<div class="col-md-3 add-url-component"> <div class="col-md-3 add-url-component">
<button class="btn btn-primary add-url" type="submit" (click)="addDownload()" [disabled]="addInProgress || downloads.loading"> <div class="btn-group add-url-group">
<span class="spinner-border spinner-border-sm" role="status" id="add-spinner" *ngIf="addInProgress"></span> <button class="btn btn-primary add-url" type="submit" (click)="addDownload()" [disabled]="addInProgress || downloads.loading">
{{ addInProgress ? "Adding..." : "Add" }} <span class="spinner-border spinner-border-sm" role="status" id="add-spinner" *ngIf="addInProgress"></span>
</button> {{ 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>
<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>
</div>
</div> </div>
</div> </div>
</div> </div>

3
ui/src/app/app.component.sass
View File

@ -9,6 +9,9 @@
.add-url-component .add-url-component
margin: 0.5rem auto margin: 0.5rem auto
.add-url-group
width: 100%
button.add-url button.add-url
width: 100% width: 100%

5
ui/src/app/app.component.ts
View File

@ -19,6 +19,7 @@ export class AppComponent implements AfterViewInit {
quality: string; quality: string;
format: string; format: string;
addInProgress = false; addInProgress = false;
showFolderDropdown = false;
darkMode: boolean; darkMode: boolean;
@ViewChild('queueMasterCheckbox') queueMasterCheckbox: MasterCheckboxComponent; @ViewChild('queueMasterCheckbox') queueMasterCheckbox: MasterCheckboxComponent;
@ -114,6 +115,10 @@ export class AppComponent implements AfterViewInit {
this.quality = exists ? this.quality : 'best' this.quality = exists ? this.quality : 'best'
} }
clickFolderDropdown() {
this.showFolderDropdown = !this.showFolderDropdown;
}
addDownload(url?: string, quality?: string, format?: string) { addDownload(url?: string, quality?: string, format?: string) {
url = url ?? this.addUrl url = url ?? this.addUrl
quality = quality ?? this.quality quality = quality ?? this.quality