mirror of
https://github.com/Myxelium/Bridge-Multi.git
synced 2026-04-11 14:19:38 +00:00
Fix status bar
This commit is contained in:
Geomitron
@@ -14,11 +14,7 @@
|
||||
</div>
|
||||
|
||||
<div id="downloadProgressDiv">
|
||||
<div id="downloadProgressBar" appProgressBar [percent]="download.percent" class="ui small progress">
|
||||
<div class="bar" [style.height]="download.type === 'error' ? '-webkit-fill-available' : undefined">
|
||||
<div class="progress"></div>
|
||||
</div>
|
||||
</div>
|
||||
<progress [value]="download.percent" max="100" class="progress w-96" [class.progress-error]="download.type === 'error'"></progress>
|
||||
<button *ngIf="download.type === 'error'" class="ui right attached labeled compact icon button" (click)="retryDownload(download.versionID)">
|
||||
<i class="redo icon"></i>
|
||||
Retry
|
||||
|
||||
@@ -1,26 +0,0 @@
|
||||
#downloadTitle,
|
||||
#downloadText {
|
||||
display: flex;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
||||
#downloadText {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
#downloadProgressDiv {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
#downloadProgressBar {
|
||||
flex-grow: 1;
|
||||
margin: 0;
|
||||
.bar {
|
||||
transform: translateY(-50%);
|
||||
top: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
i.close.icon, a {
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -6,7 +6,6 @@ import { DownloadService } from '../../../../core/services/download.service'
|
||||
@Component({
|
||||
selector: 'app-downloads-modal',
|
||||
templateUrl: './downloads-modal.component.html',
|
||||
styleUrls: ['./downloads-modal.component.scss'],
|
||||
})
|
||||
export class DownloadsModalComponent {
|
||||
|
||||
|
||||
@@ -1,37 +1,15 @@
|
||||
<div id="bottomMenu" class="ui bottom borderless menu border-t border-t-neutral">
|
||||
<div *ngIf="(searchService.groupedSongs?.length ?? 0) > 0" class="item">
|
||||
{{ searchService.groupedSongs.length }}{{ allResultsVisible ? '' : '+' }} Result{{ searchService.groupedSongs.length === 1 ? '' : 's' }}
|
||||
<div class="border-t border-t-neutral p-2 flex gap-2 items-center">
|
||||
<div *ngIf="searchService.songsResponse">
|
||||
{{ searchService.songsResponse.found }} Result{{ searchService.songsResponse.found === 1 ? '' : 's' }}
|
||||
</div>
|
||||
<div class="item">
|
||||
<button *ngIf="selectedResults.length > 1" (click)="downloadSelected()" class="ui positive button">
|
||||
Download {{ selectedResults.length }} Results
|
||||
<div class="flex-1">
|
||||
<button *ngIf="selectedGroupIds.length > 1" (click)="downloadSelected()" class="btn btn-sm btn-primary">
|
||||
Download {{ selectedGroupIds.length }} Results
|
||||
</button>
|
||||
</div>
|
||||
<a *ngIf="downloading" class="item right" (click)="showDownloads()">
|
||||
<div #progressBar appProgressBar [percent]="percent" class="ui progress" [style.background-color]="error ? 'indianred' : undefined">
|
||||
<div class="bar">
|
||||
<div class="progress"></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div id="selectedModal" class="ui modal">
|
||||
<div class="header">Some selected songs have more than one chart!</div>
|
||||
<div class="scrolling content">
|
||||
<div class="ui segments">
|
||||
<div class="ui segment" *ngFor="let chartGroup of chartGroups">
|
||||
<p *ngFor="let chart of chartGroup">
|
||||
{{ chart.chartName }} <b>[{{ chart.charters }}]</b>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<div class="ui approve button" (click)="downloadAllCharts()">Download all charts for each song</div>
|
||||
<div class="ui cancel button" (click)="deselectSongsWithMultipleCharts()">Deselect these songs</div>
|
||||
<div class="ui cancel button">Cancel</div>
|
||||
</div>
|
||||
</div>
|
||||
<button *ngIf="downloading" (click)="showDownloads()" class="btn btn-sm btn-ghost w-[30vw]">
|
||||
<progress [value]="percent" max="100" class="progress h-3 rounded-md" [class.progress-error]="error"></progress>
|
||||
</button>
|
||||
|
||||
<div id="downloadsModal" class="ui modal">
|
||||
<i class="inside close icon"></i>
|
||||
|
||||
@@ -1,18 +0,0 @@
|
||||
.ui.progress {
|
||||
margin: 0;
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
#downloadsModal {
|
||||
.header {
|
||||
display: flex;
|
||||
|
||||
span {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.ui.positive.button {
|
||||
margin-right: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
import { ChangeDetectorRef, Component } from '@angular/core'
|
||||
|
||||
import { groupBy } from '../../../../../src-shared/UtilFunctions'
|
||||
import { keys, pickBy } from 'lodash'
|
||||
|
||||
import { DownloadService } from '../../../core/services/download.service'
|
||||
import { SearchService } from '../../../core/services/search.service'
|
||||
import { SelectionService } from '../../../core/services/selection.service'
|
||||
@@ -8,7 +9,6 @@ import { SelectionService } from '../../../core/services/selection.service'
|
||||
@Component({
|
||||
selector: 'app-status-bar',
|
||||
templateUrl: './status-bar.component.html',
|
||||
styleUrls: ['./status-bar.component.scss'],
|
||||
})
|
||||
export class StatusBarComponent {
|
||||
|
||||
@@ -39,12 +39,8 @@ export class StatusBarComponent {
|
||||
})
|
||||
}
|
||||
|
||||
get allResultsVisible() {
|
||||
return false // this.searchService.allResultsVisible
|
||||
}
|
||||
|
||||
get selectedResults() {
|
||||
return this.selectionService.getSelectedResults()
|
||||
get selectedGroupIds() {
|
||||
return keys(pickBy(this.selectionService.selections)).map(k => Number(k))
|
||||
}
|
||||
|
||||
showDownloads() {
|
||||
@@ -53,52 +49,52 @@ export class StatusBarComponent {
|
||||
}
|
||||
|
||||
async downloadSelected() {
|
||||
this.chartGroups = []
|
||||
// TODO
|
||||
// this.batchResults = await window.electron.invoke.getBatchSongDetails(this.selectedResults.map(result => result.id))
|
||||
const versionGroups = groupBy(this.batchResults, 'songID')
|
||||
for (const versionGroup of versionGroups) {
|
||||
if (versionGroup.findIndex(version => version.chartID !== versionGroup[0].chartID) !== -1) {
|
||||
// Must have multiple charts of this song
|
||||
this.chartGroups.push(versionGroup.filter(version => version.versionID === version.latestVersionID))
|
||||
}
|
||||
}
|
||||
// this.chartGroups = []
|
||||
// // TODO
|
||||
// // this.batchResults = await window.electron.invoke.getBatchSongDetails(this.selectedResults.map(result => result.id))
|
||||
// const versionGroups = groupBy(this.batchResults, 'songID')
|
||||
// for (const versionGroup of versionGroups) {
|
||||
// if (versionGroup.findIndex(version => version.chartID !== versionGroup[0].chartID) !== -1) {
|
||||
// // Must have multiple charts of this song
|
||||
// this.chartGroups.push(versionGroup.filter(version => version.versionID === version.latestVersionID))
|
||||
// }
|
||||
// }
|
||||
|
||||
if (this.chartGroups.length === 0) {
|
||||
for (const versions of versionGroups) {
|
||||
// this.searchService.sortChart(versions)
|
||||
const downloadVersion = versions[0]
|
||||
const downloadSong = this.selectedResults.find(song => song.id === downloadVersion.songID)!
|
||||
this.downloadService.addDownload(
|
||||
downloadVersion.versionID, {
|
||||
chartName: downloadVersion.chartName,
|
||||
artist: downloadSong.artist,
|
||||
charter: downloadVersion.charters,
|
||||
driveData: downloadVersion.driveData,
|
||||
})
|
||||
}
|
||||
} else {
|
||||
// TODO
|
||||
// $('#selectedModal').modal('show')
|
||||
// [download all charts for each song] [deselect these songs] [X]
|
||||
}
|
||||
// if (this.chartGroups.length === 0) {
|
||||
// for (const versions of versionGroups) {
|
||||
// // this.searchService.sortChart(versions)
|
||||
// const downloadVersion = versions[0]
|
||||
// const downloadSong = this.selectedResults.find(song => song.id === downloadVersion.songID)!
|
||||
// this.downloadService.addDownload(
|
||||
// downloadVersion.versionID, {
|
||||
// chartName: downloadVersion.chartName,
|
||||
// artist: downloadSong.artist,
|
||||
// charter: downloadVersion.charters,
|
||||
// driveData: downloadVersion.driveData,
|
||||
// })
|
||||
// }
|
||||
// } else {
|
||||
// // TODO
|
||||
// // $('#selectedModal').modal('show')
|
||||
// // [download all charts for each song] [deselect these songs] [X]
|
||||
// }
|
||||
}
|
||||
|
||||
downloadAllCharts() {
|
||||
const songChartGroups = groupBy(this.batchResults, 'songID', 'chartID')
|
||||
for (const chart of songChartGroups) {
|
||||
// this.searchService.sortChart(chart)
|
||||
const downloadVersion = chart[0]
|
||||
const downloadSong = this.selectedResults.find(song => song.id === downloadVersion.songID)!
|
||||
this.downloadService.addDownload(
|
||||
downloadVersion.versionID, {
|
||||
chartName: downloadVersion.chartName,
|
||||
artist: downloadSong.artist,
|
||||
charter: downloadVersion.charters,
|
||||
driveData: downloadVersion.driveData,
|
||||
}
|
||||
)
|
||||
}
|
||||
// const songChartGroups = groupBy(this.batchResults, 'songID', 'chartID')
|
||||
// for (const chart of songChartGroups) {
|
||||
// // this.searchService.sortChart(chart)
|
||||
// const downloadVersion = chart[0]
|
||||
// const downloadSong = this.selectedResults.find(song => song.id === downloadVersion.songID)!
|
||||
// this.downloadService.addDownload(
|
||||
// downloadVersion.versionID, {
|
||||
// chartName: downloadVersion.chartName,
|
||||
// artist: downloadSong.artist,
|
||||
// charter: downloadVersion.charters,
|
||||
// driveData: downloadVersion.driveData,
|
||||
// }
|
||||
// )
|
||||
// }
|
||||
}
|
||||
|
||||
deselectSongsWithMultipleCharts() {
|
||||
|
||||
Reference in New Issue
Block a user