myxelium/Bridge-Multi
1
0
Fork 0
mirror of https://github.com/Myxelium/Bridge-Multi.git synced 2026-04-09 05:09:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move isSng control to settings page

Browse Source
This commit is contained in:
Geomitron
2023-12-22 14:33:19 -06:00
parent 22521c8f28
commit e504a62a60
10 changed files with 83 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src-angular/app/components/browse/chart-sidebar/chart-sidebar-menu/chart-sidebar-menu.component.html
View File

@@ -1,62 +1,8 @@
<div
class="dropdown-content card card-compact p-2 shadow bg-neutral text-neutral-content z-10 cursor-auto border-2 border-base-300 max-w-[90vw] sm:max-w-[80vw] lg:max-w-[70vw] 2xl:max-w-[60vw]">
<div class="card-body">
<div class="flex">
<div class="flex-1">
<h1 class="menu-title pl-0 pb-0 whitespace-nowrap text-neutral-content">
DOWNLOAD FORMAT
<button class="btn btn-xs btn-circle btn-ghost" (click)="selectSngModal.showModal()">
<i class="bi bi-info-circle text-sm hover:border-b-secondary-focus"></i>
</button>
<dialog #selectSngModal id="report_modal" class="modal whitespace-normal">
<div class="modal-box bg-base-100 text-base-content flex flex-col gap-2">
<form method="dialog">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
<i class="bi bi-x-lg text-lg"></i>
</button>
</form>
<div class="flex gap-6">
<div class="flex-1">
<span class="font-bold text-lg">.sng (new)</span>
<ul class="list-disc pl-5">
<li>Single chart file</li>
<li>Can be scanned in-game directly without extracting</li>
<li>Currently only supported by YARG and Clone Hero v1.1</li>
</ul>
</div>
<div class="flex-1">
<span class="font-bold text-lg">.zip</span>
<ul class="list-disc pl-5">
<li>Contains chart folder</li>
<li>Must be extracted before it can be scanned in-game</li>
<li>Supported across many games</li>
</ul>
</div>
</div>
<br />
<div class="text-xs">
A program to convert between .sng files and chart folders can be found
<a class="link" href="https://github.com/mdsitton/SngFileFormat/releases" target="_blank">here</a>.
</div>
</div>
<form method="dialog" class="modal-backdrop">
<button>close</button>
</form>
</dialog>
</h1>
<div class="flex gap-2">
<label class="label cursor-pointer">
<input type="radio" class="radio radio-secondary mr-2" [value]="true" [formControl]="isSngControl" />
.sng
</label>
<label class="label cursor-pointer">
<input type="radio" class="radio radio-secondary mr-2" [value]="false" [formControl]="isSngControl" />
.zip
</label>
</div>
</div>
<div class="pt-2">
<div class="flex flex-row-reverse justify-between menu-title p-0 whitespace-nowrap text-neutral-content">
<div>
<button class="btn btn-secondary btn-xs flex-nowrap uppercase" (click)="reportModal.showModal()">
<i class="bi bi-exclamation-triangle text-sm text-secondary-content"></i> Report issue
</button>
@@ -106,12 +52,12 @@
</form>
</dialog>
</div>
@if (displayVersions.length > 1) {
<span class="uppercase">Select Version</span>
}
</div>
@if (displayVersions.length > 1) {
<h1 class="menu-title pl-0 pb-0 pt-4 whitespace-nowrap text-neutral-content">SELECT VERSION</h1>
}
<div
class="pt-2 overflow-auto scrollbar scrollbar-w-2 scrollbar-h-2 scrollbar-track-neutral scrollbar-thumb-neutral-content scrollbar-thumb-rounded-full">
class="overflow-auto scrollbar scrollbar-w-2 scrollbar-h-2 scrollbar-track-neutral scrollbar-thumb-neutral-content scrollbar-thumb-rounded-full">
<table class="table table-xs">
<thead>
<tr>

6
src-angular/app/components/browse/chart-sidebar/chart-sidebar-menu/chart-sidebar-menu.component.ts
View File

@@ -3,7 +3,6 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
import { FormControl } from '@angular/forms'
import { sortBy } from 'lodash'
import { SearchService } from 'src-angular/app/core/services/search.service'
import { environment } from 'src-angular/environments/environment'
import { ChartData } from 'src-shared/interfaces/search.interface'
import { driveLink } from 'src-shared/UtilFunctions'
@@ -26,14 +25,9 @@ export class ChartSidebarMenutComponent implements OnInit {
public reportMessage = ''
constructor(
private searchService: SearchService,
private http: HttpClient,
) { }
get isSngControl() {
return this.searchService.isSng
}
ngOnInit(): void {
this.selectedVersion = new FormControl<ChartData>(this.displayVersions[0], { nonNullable: true })
this.selectedVersion.valueChanges.subscribe(v => this.selectedVersionChanges.emit(v))

46
src-angular/app/components/browse/chart-sidebar/chart-sidebar.component.html
View File

@@ -88,52 +88,6 @@
</div>
<div class="join">
<button class="btn rounded-md flex-1 join-item btn-primary" (click)="onDownloadClicked()">Download</button>
<dialog #selectSngModal id="report_modal" class="modal">
<div class="modal-box bg-base-100 text-base-content flex flex-col gap-2">
<form method="dialog">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
<i class="bi bi-x-lg text-2xl"></i>
</button>
</form>
<h3 class="font-bold text-lg">Select Download Format:</h3>
<div class="flex gap-6">
<div class="form-control flex-1">
<label class="label cursor-pointer justify-normal gap-2">
<input type="radio" name="selectedDownloadFormat{{ selectedChart.chartId }}" class="radio" (change)="selectDownloadFormat(true)" />
<span>.sng (new)</span>
</label>
<ul class="list-disc pl-5">
<li>Single chart file</li>
<li>Can be scanned in-game directly without extracting</li>
<li>Currently only supported by YARG and Clone Hero v1.1</li>
</ul>
</div>
<div class="form-control flex-1">
<label class="label cursor-pointer justify-normal gap-2">
<input type="radio" name="selectedDownloadFormat{{ selectedChart.chartId }}" class="radio" (change)="selectDownloadFormat(false)" />
<span>.zip</span>
</label>
<ul class="list-disc pl-5">
<li>Contains chart folder</li>
<li>Must be extracted before it can be scanned in-game</li>
<li>Supported across many games</li>
</ul>
</div>
</div>
<br />
<div class="text-xs">This can be changed later in the (<i class="bi bi-three-dots align-middle"></i>) menu.</div>
<div class="text-xs">
A program to convert between .sng files and chart folders can be found
<a class="link" href="https://github.com/mdsitton/SngFileFormat/releases" target="_blank">here</a>.
</div>
<div class="form-control flex-row justify-end">
<button class="btn btn-primary" [disabled]="!hasSelectedDownloadFormat" (click)="onDownloadClicked()">Download</button>
</div>
</div>
<form method="dialog" class="modal-backdrop">
<button>close</button>
</form>
</dialog>
<div
#menu
class="cursor-pointer bg-neutral rounded-md join-item dropdown dropdown-top dropdown-end p-1 flex items-center"

17
src-angular/app/components/browse/chart-sidebar/chart-sidebar.component.ts
View File

@@ -17,7 +17,6 @@ export class ChartSidebarComponent implements OnInit {
@HostBinding('class.contents') contents = true
@ViewChild('menu') menu: ElementRef
@ViewChild('selectSngModal') selectSngModal: ElementRef<HTMLDialogElement>
public shortInstrumentDisplay = shortInstrumentDisplay
public difficultyDisplay = difficultyDisplay
@@ -181,27 +180,11 @@ export class ChartSidebarComponent implements OnInit {
return this.selectedChart!.notesData.noteCounts.filter(this.currentTrackFilter)[0].count
}
public get hasSelectedDownloadFormat() {
// TODO
return localStorage.getItem('selectedDownloadFormat') === 'true'
}
public selectDownloadFormat(isSng: boolean) {
// TODO
this.searchService.isSng.setValue(isSng)
localStorage.setItem('selectedDownloadFormat', 'true')
}
/**
* Adds the selected version to the download queue.
*/
onDownloadClicked() {
// TODO
if (!this.hasSelectedDownloadFormat) {
this.selectSngModal.nativeElement.showModal()
return
} else {
this.selectSngModal.nativeElement.close()
}
// this.downloadService.addDownload(
// this.selectedChart.versionID, {
// chartName: this.selectedChart.chartName,

57
src-angular/app/components/settings/settings.component.html
View File

@@ -48,6 +48,63 @@
</div>
</label>
<div class="form-control">
<div class="label">
<span class="label-text">
Download Format
<button class="btn btn-xs btn-circle btn-ghost" (click)="selectSngModal.showModal()">
<i class="bi bi-info-circle text-sm hover:border-b-secondary-focus"></i>
</button>
<dialog #selectSngModal id="report_modal" class="modal whitespace-normal">
<div class="modal-box bg-base-100 text-base-content flex flex-col gap-2">
<form method="dialog">
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
<i class="bi bi-x-lg text-lg"></i>
</button>
</form>
<div class="flex gap-6">
<div class="flex-1">
<span class="font-bold text-lg">.sng (new)</span>
<ul class="list-disc pl-5">
<li>Single chart file</li>
<li>Can be scanned in-game directly without extracting</li>
<li>Currently only supported by YARG and Clone Hero v1.1</li>
</ul>
</div>
<div class="flex-1">
<span class="font-bold text-lg">.zip</span>
<ul class="list-disc pl-5">
<li>Contains chart folder</li>
<li>Must be extracted before it can be scanned in-game</li>
<li>Supported across many games</li>
</ul>
</div>
</div>
<br />
<div class="text-xs">
A program to convert between .sng files and chart folders can be found
<a class="link" (click)="openUrl('https://github.com/mdsitton/SngFileFormat/releases')">here</a>.
</div>
</div>
<form method="dialog" class="modal-backdrop">
<button>close</button>
</form>
</dialog>
</span>
</div>
<div class="flex gap-2">
<label class="label cursor-pointer">
<input type="radio" class="radio radio-secondary mr-2" [value]="true" [formControl]="isSng" />
.sng
</label>
<label class="label cursor-pointer">
<input type="radio" class="radio radio-secondary mr-2" [value]="false" [formControl]="isSng" />
.zip
</label>
</div>
</div>
<div class="absolute bottom-8 right-8 flex gap-6">
<div class="join">
<button *ngIf="updateAvailable" class="join-item btn btn-primary" (click)="downloadUpdate()">

12
src-angular/app/components/settings/settings.component.ts
View File

@@ -1,4 +1,5 @@
import { ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core'
import { FormControl } from '@angular/forms'
import { capitalize } from 'lodash'
import { SettingsService } from 'src-angular/app/core/services/settings.service'
@@ -11,6 +12,8 @@ import { themes } from 'src-shared/Settings'
export class SettingsComponent implements OnInit {
@ViewChild('themeDropdown', { static: true }) themeDropdown: ElementRef
public isSng: FormControl<boolean>
updateAvailable: boolean | null = false
loginClicked = false
downloadUpdateText = 'Update available'
@@ -23,7 +26,10 @@ export class SettingsComponent implements OnInit {
constructor(
public settingsService: SettingsService,
private ref: ChangeDetectorRef
) { }
) {
this.isSng = new FormControl<boolean>(settingsService.isSng, { nonNullable: true })
this.isSng.valueChanges.subscribe(value => settingsService.isSng = value)
}
async ngOnInit() {
window.electron.on.updateAvailable(result => {
@@ -73,6 +79,10 @@ export class SettingsComponent implements OnInit {
}
}
openUrl(url: string) {
window.electron.emit.openUrl(url)
}
setTheme(theme: typeof themes[number]) {
this.settingsService.theme = theme
}

4
src-angular/app/core/services/search.service.ts
View File

@@ -26,16 +26,12 @@ export class SearchService {
public availableIcons: string[]
public searchControl = new FormControl('', { nonNullable: true })
public isSng: FormControl<boolean>
public instrument: FormControl<Instrument | null>
public difficulty: FormControl<Difficulty | null>
constructor(
private http: HttpClient,
) {
this.isSng = new FormControl<boolean>((localStorage.getItem('isSng') ?? 'true') === 'true', { nonNullable: true })
this.isSng.valueChanges.subscribe(isSng => localStorage.setItem('isSng', `${isSng}`))
this.instrument = new FormControl<Instrument>(
(localStorage.getItem('instrument') === 'null' ? null : localStorage.getItem('instrument')) as Instrument
)

8
src-angular/app/core/services/settings.service.ts
View File

@@ -75,11 +75,11 @@ export class SettingsService {
this.saveSettings()
}
get rateLimitDelay() {
return this.settings.rateLimitDelay
get isSng() {
return this.settings.isSng
}
set rateLimitDelay(delay: number) {
this.settings.rateLimitDelay = delay
set isSng(value: boolean) {
this.settings.isSng = value
this.saveSettings()
}
}

6
src-electron/ipc/download/GoogleTimer.ts
View File

@@ -1,4 +1,4 @@
import { settings } from '../SettingsHandler.ipc'
interface EventCallback {
'waitProgress': (remainingSeconds: number, totalSeconds: number) => void
@@ -36,7 +36,7 @@ class GoogleTimer {
if (this.hasTimerEnded() && this.callbacks.complete !== undefined) {
this.endTimer()
} else if (this.callbacks.waitProgress !== undefined) {
const delay = settings.rateLimitDelay
const delay = 31
this.callbacks.waitProgress(delay - this.rateLimitCounter, delay)
}
}
@@ -52,7 +52,7 @@ class GoogleTimer {
* Checks if enough time has elapsed since the last timer activation.
*/
private hasTimerEnded() {
return this.rateLimitCounter > settings.rateLimitDelay
return true
}
/**

4
src-shared/Settings.ts
View File

@@ -19,10 +19,10 @@ export const themes = [
* Represents Bridge's user settings.
*/
export interface Settings {
rateLimitDelay: number // Number of seconds to wait between each file download from Google servers
downloadVideos: boolean // If background videos should be downloaded
theme: typeof themes[number] // The name of the currently enabled UI theme
libraryPath: string | undefined // The path to the user's library
isSng: boolean // If the chart should be downloaded as a .sng file or as a chart folder
instrument: Instrument | null // The instrument selected by default, or `null` for "Any Instrument"
difficulty: Difficulty | null // The difficulty selected by default, or `null` for "Any Difficulty"
}
@@ -31,10 +31,10 @@ export interface Settings {
* Bridge's default user settings.
*/
export const defaultSettings: Settings = {
rateLimitDelay: 31,
downloadVideos: true,
theme: 'dark',
libraryPath: undefined,
isSng: false,
instrument: 'guitar',
difficulty: null,
}