mirror of
https://github.com/Myxelium/Bridge-Multi.git
synced 2026-04-11 14:19:38 +00:00
Restructure
This commit is contained in:
Geomitron
71
src-angular/app/components/settings/settings.component.html
Normal file
71
src-angular/app/components/settings/settings.component.html
Normal file
@@ -0,0 +1,71 @@
|
||||
<h3 class="ui header">Paths</h3>
|
||||
<div class="ui form">
|
||||
<div class="field">
|
||||
<label>Chart library directory</label>
|
||||
<div class="ui action input">
|
||||
<input
|
||||
[value]="settingsService.libraryDirectory || 'No folder selected'"
|
||||
class="default-cursor"
|
||||
readonly
|
||||
type="text"
|
||||
placeholder="No directory selected!" />
|
||||
<button *ngIf="settingsService.libraryDirectory !== undefined" (click)="openLibraryDirectory()" class="ui button">Open Folder</button>
|
||||
<button (click)="getLibraryDirectory()" class="ui button positive">Choose</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 class="ui header">Cache</h3>
|
||||
<div>
|
||||
Current Cache Size:
|
||||
<div class="ui label" style="margin-left: 1em">{{ cacheSize }}</div>
|
||||
</div>
|
||||
<button style="margin-top: 0.5em" (click)="clearCache()" class="ui button">Clear Cache</button>
|
||||
|
||||
<h3 class="ui header">Downloads</h3>
|
||||
<div class="ui form">
|
||||
<div class="field">
|
||||
<div appCheckbox #videoCheckbox class="ui checkbox" (checked)="downloadVideos($event)">
|
||||
<input type="checkbox" />
|
||||
<label>Download video backgrounds</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Google rate limit delay</label>
|
||||
<div id="rateLimitInput" class="ui right labeled input">
|
||||
<input type="number" [value]="settingsService.rateLimitDelay" (input)="changeRateLimit($event)" />
|
||||
<div class="ui basic label">sec</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="settingsService.rateLimitDelay < 30" class="ui warning message">
|
||||
<i class="exclamation circle icon"></i>
|
||||
<b>Warning:</b> downloading files from Google with a delay less than about 30 seconds will eventually cause Google to refuse download requests from
|
||||
this program for a few hours. This limitation will be removed in a future update.
|
||||
</div>
|
||||
|
||||
<h3 class="ui header">Theme</h3>
|
||||
<div #themeDropdown class="ui selection dropdown mr">
|
||||
<input type="hidden" name="sort" [value]="settingsService.theme" />
|
||||
<i class="dropdown icon"></i>
|
||||
<div class="default text">{{ settingsService.theme }}</div>
|
||||
<div class="menu">
|
||||
<div class="item" [attr.data-value]="i" *ngFor="let theme of settingsService.builtinThemes; let i = index">{{ theme }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bottom">
|
||||
<div class="ui buttons">
|
||||
<button *ngIf="updateAvailable" class="ui labeled icon positive button" (click)="downloadUpdate()">
|
||||
<i class="left alternate icon" [ngClass]="updateDownloaded ? 'sync' : 'cloud download'"></i>{{ downloadUpdateText }}
|
||||
</button>
|
||||
<button *ngIf="updateAvailable === null" class="ui labeled yellow icon button" [class.disabled]="updateRetrying" (click)="retryUpdate()">
|
||||
<i class="left alternate sync alternate icon" [class.loading]="updateRetrying"></i>{{ retryUpdateText }}
|
||||
</button>
|
||||
<button id="versionNumberButton" class="ui basic disabled button">{{ currentVersion }}</button>
|
||||
</div>
|
||||
|
||||
<button class="ui basic icon button" data-tooltip="Toggle developer tools" data-position="top right" (click)="toggleDevTools()">
|
||||
<i class="cog icon"></i>
|
||||
</button>
|
||||
</div>
|
||||
24
src-angular/app/components/settings/settings.component.scss
Normal file
24
src-angular/app/components/settings/settings.component.scss
Normal file
@@ -0,0 +1,24 @@
|
||||
:host {
|
||||
flex: 1;
|
||||
padding: 2em;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.default-cursor {
|
||||
cursor: default;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#rateLimitInput {
|
||||
width: unset !important;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
position: absolute;
|
||||
bottom: 2em;
|
||||
right: 2em;
|
||||
}
|
||||
|
||||
#versionNumberButton {
|
||||
margin-right: 1em;
|
||||
}
|
||||
140
src-angular/app/components/settings/settings.component.ts
Normal file
140
src-angular/app/components/settings/settings.component.ts
Normal file
@@ -0,0 +1,140 @@
|
||||
import { AfterViewInit, ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core'
|
||||
|
||||
import { CheckboxDirective } from 'src/app/core/directives/checkbox.directive'
|
||||
import { ElectronService } from 'src/app/core/services/electron.service'
|
||||
import { SettingsService } from 'src/app/core/services/settings.service'
|
||||
|
||||
@Component({
|
||||
selector: 'app-settings',
|
||||
templateUrl: './settings.component.html',
|
||||
styleUrls: ['./settings.component.scss'],
|
||||
})
|
||||
export class SettingsComponent implements OnInit, AfterViewInit {
|
||||
@ViewChild('themeDropdown', { static: true }) themeDropdown: ElementRef
|
||||
@ViewChild(CheckboxDirective, { static: true }) videoCheckbox: CheckboxDirective
|
||||
|
||||
cacheSize = 'Calculating...'
|
||||
updateAvailable = false
|
||||
loginClicked = false
|
||||
downloadUpdateText = 'Update available'
|
||||
retryUpdateText = 'Failed to check for update'
|
||||
updateDownloading = false
|
||||
updateDownloaded = false
|
||||
updateRetrying = false
|
||||
currentVersion = ''
|
||||
|
||||
constructor(
|
||||
public settingsService: SettingsService,
|
||||
private electronService: ElectronService,
|
||||
private ref: ChangeDetectorRef
|
||||
) { }
|
||||
|
||||
async ngOnInit() {
|
||||
this.electronService.receiveIPC('update-available', result => {
|
||||
this.updateAvailable = result != null
|
||||
this.updateRetrying = false
|
||||
if (this.updateAvailable) {
|
||||
this.downloadUpdateText = `Update available (${result.version})`
|
||||
}
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
this.electronService.receiveIPC('update-error', (err: Error) => {
|
||||
console.log(err)
|
||||
this.updateAvailable = null
|
||||
this.updateRetrying = false
|
||||
this.retryUpdateText = `Failed to check for update: ${err.message}`
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
this.electronService.invoke('get-current-version', undefined).then(version => {
|
||||
this.currentVersion = `v${version}`
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
this.electronService.invoke('get-update-available', undefined).then(isAvailable => {
|
||||
this.updateAvailable = isAvailable
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
|
||||
const cacheSize = await this.settingsService.getCacheSize()
|
||||
this.cacheSize = Math.round(cacheSize / 1000000) + ' MB'
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
$(this.themeDropdown.nativeElement).dropdown({
|
||||
onChange: (_value: string, text: string) => {
|
||||
this.settingsService.theme = text
|
||||
},
|
||||
})
|
||||
|
||||
this.videoCheckbox.check(this.settingsService.downloadVideos)
|
||||
}
|
||||
|
||||
async clearCache() {
|
||||
this.cacheSize = 'Please wait...'
|
||||
await this.settingsService.clearCache()
|
||||
this.cacheSize = 'Cleared!'
|
||||
}
|
||||
|
||||
async downloadVideos(isChecked: boolean) {
|
||||
this.settingsService.downloadVideos = isChecked
|
||||
}
|
||||
|
||||
async getLibraryDirectory() {
|
||||
const result = await this.electronService.showOpenDialog({
|
||||
title: 'Choose library folder',
|
||||
buttonLabel: 'This is where my charts are!',
|
||||
defaultPath: this.settingsService.libraryDirectory || '',
|
||||
properties: ['openDirectory'],
|
||||
})
|
||||
|
||||
if (result.canceled == false) {
|
||||
this.settingsService.libraryDirectory = result.filePaths[0]
|
||||
}
|
||||
}
|
||||
|
||||
openLibraryDirectory() {
|
||||
this.electronService.openFolder(this.settingsService.libraryDirectory)
|
||||
}
|
||||
|
||||
changeRateLimit(event: Event) {
|
||||
const inputElement = event.srcElement as HTMLInputElement
|
||||
this.settingsService.rateLimitDelay = Number(inputElement.value)
|
||||
}
|
||||
|
||||
downloadUpdate() {
|
||||
if (this.updateDownloaded) {
|
||||
this.electronService.sendIPC('quit-and-install', undefined)
|
||||
} else if (!this.updateDownloading) {
|
||||
this.updateDownloading = true
|
||||
this.electronService.sendIPC('download-update', undefined)
|
||||
this.downloadUpdateText = 'Downloading... (0%)'
|
||||
this.electronService.receiveIPC('update-progress', result => {
|
||||
this.downloadUpdateText = `Downloading... (${result.percent.toFixed(0)}%)`
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
this.electronService.receiveIPC('update-downloaded', () => {
|
||||
this.downloadUpdateText = 'Quit and install update'
|
||||
this.updateDownloaded = true
|
||||
this.ref.detectChanges()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
retryUpdate() {
|
||||
if (this.updateRetrying == false) {
|
||||
this.updateRetrying = true
|
||||
this.retryUpdateText = 'Retrying...'
|
||||
this.ref.detectChanges()
|
||||
this.electronService.sendIPC('retry-update', undefined)
|
||||
}
|
||||
}
|
||||
|
||||
toggleDevTools() {
|
||||
const toolsOpened = this.electronService.currentWindow.webContents.isDevToolsOpened()
|
||||
|
||||
if (toolsOpened) {
|
||||
this.electronService.currentWindow.webContents.closeDevTools()
|
||||
} else {
|
||||
this.electronService.currentWindow.webContents.openDevTools()
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user