mirror of
https://github.com/Myxelium/Bridge-Multi.git
synced 2026-04-11 06:09:39 +00:00
Added search loading icon
This commit is contained in:
@@ -1,15 +1,15 @@
|
||||
<div class="ui bottom attached borderless menu">
|
||||
<div class="item">
|
||||
<!-- TODO: add advanced search -->
|
||||
<div class="ui icon input">
|
||||
<div class="ui icon input" [class.loading]="searchService.isLoading()">
|
||||
<input #searchBox type="text" placeholder=" Search..." (keyup.enter)="onSearch(searchBox.value)">
|
||||
<i class="search icon"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div #typeDropdown class="ui item dropdown">
|
||||
<!-- <div #typeDropdown class="ui item dropdown">
|
||||
Type <i class="dropdown icon"></i>
|
||||
<div class="menu">
|
||||
<!-- TODO: revise what items are displayed -->
|
||||
TODO: revise what items are displayed
|
||||
<a class="item">Any</a>
|
||||
<a class="item">Name</a>
|
||||
<a class="item">Artist</a>
|
||||
@@ -18,7 +18,7 @@
|
||||
<a class="item">Year</a>
|
||||
<a class="item">Charter</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- TODO <div class="item right">
|
||||
<button class="ui positive disabled button">Bulk Download</button>
|
||||
</div> -->
|
||||
|
||||
@@ -8,7 +8,7 @@ import { SearchService } from 'src/app/core/services/search.service'
|
||||
})
|
||||
export class SearchBarComponent implements AfterViewInit {
|
||||
|
||||
constructor(private searchService: SearchService) { }
|
||||
constructor(public searchService: SearchService) { }
|
||||
|
||||
ngAfterViewInit() {
|
||||
$('.ui.dropdown').dropdown()
|
||||
|
||||
@@ -18,8 +18,9 @@ export class SearchService {
|
||||
constructor(private electronService: ElectronService) { }
|
||||
|
||||
async newSearch(query: string) {
|
||||
if (this.awaitingResults) { return }
|
||||
this.awaitingResults = true
|
||||
this.currentQuery = { query, type: SearchType.Any, offset: 0, length: 20 + 1 } // TODO: make length a setting
|
||||
this.currentQuery = { query, type: SearchType.Any, offset: 0, length: 50 + 1 } // TODO: make length a setting
|
||||
this.results = this.trimLastChart(await this.electronService.invoke('song-search', this.currentQuery))
|
||||
this.awaitingResults = false
|
||||
|
||||
@@ -27,6 +28,10 @@ export class SearchService {
|
||||
this.newResultsEmitter.emit(this.results)
|
||||
}
|
||||
|
||||
isLoading() {
|
||||
return this.awaitingResults
|
||||
}
|
||||
|
||||
/**
|
||||
* Event emitted when new search results are returned
|
||||
* or when more results are added to an existing search.
|
||||
|
||||
@@ -82,8 +82,6 @@ export class FileTransfer {
|
||||
}
|
||||
} else {
|
||||
// TODO: handle other common problems, like chart/audio files not named correctly
|
||||
// TODO: this could have been a chart pack; have option to only keep selected chart?
|
||||
// (think about a user trying to download a set of charts in a pack)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user