mirror of
https://github.com/Myxelium/Bridge-Multi.git
synced 2026-04-11 14:19:38 +00:00
54 lines
2.1 KiB
HTML
54 lines
2.1 KiB
HTML
<div class="border-t border-t-neutral p-2 flex gap-2 items-center max-w-full justify-between">
|
|
<div class="flex items-center gap-[8px]">
|
|
{{ (this.libraryService.tracks$ | async)?.length ?? 0 }} Songs
|
|
<button class="btn btn-sm btn-primary" (click)="fileInput.click()">Import Setlist</button>
|
|
@if ((this.libraryService.selectedSongs$ | async)!.length > 0) {
|
|
<button class="btn btn-sm btn-primary" (click)="exportSelected()">Export Selected Setlist</button>
|
|
} @else {
|
|
<button class="btn btn-sm btn-primary" (click)="exportLibrary()">Export Setlist</button>
|
|
}
|
|
|
|
<input type="file" #fileInput accept=".library" class="hidden" (change)="onFileSelected($event)" />
|
|
|
|
@if ((this.libraryService.selectedSongs$ | async)!.length === 0) {
|
|
<button type="button" class="btn btn-sm min-w-[108px] hover:btn-error" (click)="this.libraryService.clearLibrary()">
|
|
<i class="bi bi-trash"></i>
|
|
Delete all
|
|
</button>
|
|
} @else {
|
|
<button type="button" class="btn btn-sm min-w-[108px] hover:btn-error" (click)="this.libraryService.removeFromLibrary()">
|
|
<i class="bi bi-trash"></i>
|
|
Delete selected
|
|
</button>
|
|
}
|
|
</div>
|
|
<div class="flex">
|
|
<div *ngIf="downloadService.downloadCount > 0" class="max-w-100 text-ellipsis text-nowrap overflow-hidden whitespace-nowrap flex items-center">
|
|
{{ downloadService.currentDownloadText }}
|
|
</div>
|
|
<div *ngIf="downloadService.downloadCount > 0" class="flex gap-2 items-center">
|
|
<button (click)="downloadsModal.showModal()" class="btn btn-sm btn-ghost w-[30vw] flex gap-2">
|
|
<div class="flex-1">
|
|
<progress
|
|
[attr.value]="downloadService.totalDownloadingPercent"
|
|
max="100"
|
|
class="progress h-3 rounded-md"
|
|
[class.progress-error]="downloadService.anyErrorsExist"></progress>
|
|
</div>
|
|
<div>
|
|
<i class="bi bi-info-circle text-xs"></i>
|
|
</div>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<dialog #downloadsModal class="modal whitespace-normal">
|
|
<div class="modal-box bg-base-100 text-base-content flex flex-col gap-2 w-9/12 max-w-7xl min-h-0 overflow-y-clip">
|
|
<app-downloads-modal />
|
|
</div>
|
|
<form method="dialog" class="modal-backdrop">
|
|
<button>close</button>
|
|
</form>
|
|
</dialog>
|