bitgapp/eqMac
1
1
Fork 0
mirror of https://github.com/bitgapp/eqMac.git synced 2024-11-22 04:33:53 +03:00
Code Issues Projects Releases Wiki Activity

added eslint to the monorepo and fixed UI linting errors

Browse Source
This commit is contained in:
Nodeful 2021-03-24 16:42:45 +02:00
parent decf2673b1
commit c7419165b2
90 changed files with 2317 additions and 341 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.eslintignore Normal file
View File

@ -0,0 +1,2 @@
node_modules
dist

40
.eslintrc.js Normal file
View File

@ -0,0 +1,40 @@
module.exports = {
extends: 'standard-with-typescript',
parserOptions: {
tsconfigRootDir: __dirname,
project: [
'./ui/tsconfig.eslint.json'
]
},
overrides: [{
files: ['*.ts'],
rules: {
radix: 'off',
'accessor-pairs': 'off',
'return-undefined': 'off',
'no-throw-literal': 'off',
'import-first': 'off',
'@typescript-eslint/array-type': 'off',
'@typescript-eslint/consistent-type-assertions': 'off',
'@typescript-eslint/explicit-function-return-type': 'off',
'@typescript-eslint/no-empty-interface': 'off',
'@typescript-eslint/no-extraneous-class': 'off',
'@typescript-eslint/no-floating-promises': 'off',
'@typescript-eslint/no-unused-vars': [2, { args: 'none' }],
'@typescript-eslint/require-await': 'off',
'@typescript-eslint/restrict-template-expressions': 'off',
'@typescript-eslint/promise-function-async': 'off',
'@typescript-eslint/no-misused-promises': 'off',
'array-bracket-spacing': ['error', 'always'],
'@typescript-eslint/quotes': ['error', 'single', { avoidEscape: true }],
'@typescript-eslint/strict-boolean-expressions': 'off',
'@typescript-eslint/return-await': 'off',
'node/no-callback-literal': 'off',
'no-async-promise-executor': 'off',
'@typescript-eslint/no-dynamic-delete': 'off'
}
}],
env: {
node: true
}
}

1948
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

30
package.json Normal file
View File

@ -0,0 +1,30 @@
{
"name": "eqmac",
"version": "1.0.0",
"description": "eqMac Monorepo",
"main": ".eslintrc.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/bitgapp/eqMac.git"
},
"author": "Roman Kisil <Nodeful>",
"license": "ISC",
"bugs": {
"url": "https://github.com/bitgapp/eqMac/issues"
},
"homepage": "https://github.com/bitgapp/eqMac#readme",
"devDependencies": {
"@typescript-eslint/eslint-plugin": "^4.19.0",
"eslint": "^7.22.0",
"eslint-config-standard-with-typescript": "^20.0.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.3.1"
},
"dependencies": {
"typescript": "^4.2.3"
}
}

2
ui/.eslintignore Normal file
View File

@ -0,0 +1,2 @@
node_modules
dist

3
ui/.eslintrc.js Normal file
View File

@ -0,0 +1,3 @@
module.exports = {
extends: '../.eslintrc.js'
}

2
ui/package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "eqmac",
"version": "1.2.2",
"version": "1.3.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

2
ui/scripts/purge-cache.ts
View File

@ -9,7 +9,7 @@ const cf = Cloudflare({
})
;(async () => {
const [ major, minor ] = version.split('.')
const [ major ] = version.split('.')
const domain = `https://ui-v${major}.eqmac.app`
await cf.zones.purgeCache(process.env.CLOUDFLARE_ZONE_ID, {
files: [ domain ]

14
ui/src/app/app.component.ts
View File

@ -16,8 +16,8 @@ import { SettingsService, IconMode } from './sections/settings/settings.service'
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
animations: [FadeInOutAnimation, FromTopAnimation]
styleUrls: [ './app.component.scss' ],
animations: [ FadeInOutAnimation, FromTopAnimation ]
})
export class AppComponent implements OnInit, AfterContentInit {
@ -75,7 +75,7 @@ export class AppComponent implements OnInit, AfterContentInit {
async syncHeight (dimensions?: UIDimensions) {
await this.utils.delay(10)
let height = this.container.nativeElement.offsetHeight
let height: number = this.container.nativeElement.offsetHeight
if (dimensions) {
if (dimensions.heightDiff) {
height += dimensions.heightDiff
@ -88,7 +88,7 @@ export class AppComponent implements OnInit, AfterContentInit {
async syncWidth (dimensions?: UIDimensions) {
await this.utils.delay(10)
let width = this.container.nativeElement.offsetWidth
let width: number = this.container.nativeElement.offsetWidth
if (dimensions) {
if (dimensions.widthDiff) {
width += dimensions.widthDiff
@ -100,8 +100,8 @@ export class AppComponent implements OnInit, AfterContentInit {
}
startDimensionsSync () {
this.ui.dimensionsChanged.subscribe(dimensions => this.syncDimensions(dimensions))
setInterval(() => this.syncDimensions(), 1000)
this.ui.dimensionsChanged.subscribe(async dimensions => await this.syncDimensions(dimensions))
setInterval(async () => await this.syncDimensions(), 1000)
}
toggleDropdownSection (section: string) {
@ -123,7 +123,7 @@ export class AppComponent implements OnInit, AfterContentInit {
closeDropdownSection (section: string, event?: any) {
// if (event && event.target && ['backdrop', 'mat-dialog'].some(e => event.target.className.includes(e))) return
if (this.matDialog.openDialogs.length) return
if (this.matDialog.openDialogs.length > 0) return
if (section in this.showDropdownSections) {
this.showDropdownSections[section] = false
}

10
ui/src/app/app.module.ts
View File

@ -9,10 +9,6 @@ import {
AppComponent
} from './app.component'
import {
environment
} from '../environments/environment'
import {
FlexLayoutModule
} from '@angular/flex-layout'
@ -70,9 +66,6 @@ import {
import {
VolumeBoosterBalanceComponent
} from './sections/volume/booster-balance/volume-booster-balance.component'
import {
VolumeMixerComponent
} from './sections/volume/volume-mixer/volume-mixer.component'
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { SettingsComponent } from './sections/settings/settings.component'
@ -115,7 +108,6 @@ import { OptionsDialogComponent } from './components/options-dialog/options-dial
BasicEqualizerComponent,
AdvancedEqualizerComponent,
VolumeBoosterBalanceComponent,
VolumeMixerComponent,
SettingsComponent,
OptionsComponent,
HelpComponent,
@ -125,6 +117,6 @@ import { OptionsDialogComponent } from './components/options-dialog/options-dial
OptionsDialogComponent
],
providers: [],
bootstrap: [AppComponent]
bootstrap: [ AppComponent ]
})
export class AppModule {}

5
ui/src/app/components/confirm-dialog/confirm-dialog.component.ts
View File

@ -10,7 +10,7 @@ export interface ConfirmDialogData {
@Component({
selector: 'eqm-confirm-dialog',
templateUrl: './confirm-dialog.component.html',
styleUrls: ['./confirm-dialog.component.scss']
styleUrls: [ './confirm-dialog.component.scss' ]
})
export class ConfirmDialogComponent implements OnInit {
@Input() text: string
@ -26,7 +26,7 @@ export class ConfirmDialogComponent implements OnInit {
ngOnInit () {
if (this.data) {
for (const [key, value] of Object.entries(this.data)) {
for (const [ key, value ] of Object.entries(this.data)) {
this[key] = value || this[key]
}
}
@ -43,5 +43,4 @@ export class ConfirmDialogComponent implements OnInit {
this.dialogRef.close(true)
}
}
}

5
ui/src/app/components/options-dialog/options-dialog.component.ts
View File

@ -9,7 +9,7 @@ export interface OptionsDialogData {
@Component({
selector: 'eqm-options-dialog',
templateUrl: './options-dialog.component.html',
styleUrls: ['./options-dialog.component.scss']
styleUrls: [ './options-dialog.component.scss' ]
})
export class OptionsDialogComponent implements OnInit {
@Input() options: Options
@ -22,10 +22,9 @@ export class OptionsDialogComponent implements OnInit {
ngOnInit () {
if (this.data) {
for (const [key, value] of Object.entries(this.data)) {
for (const [ key, value ] of Object.entries(this.data)) {
this[key] = value || this[key]
}
}
}
}

18
ui/src/app/components/options/options.component.ts
View File

@ -74,8 +74,8 @@ export interface BreadcrumbsOption extends BaseOptions {
}
export interface InputOption extends BaseOptions {
type: 'input',
value?: string,
type: 'input'
value?: string
placeholder?: string
changed?: (value: string) => any
enter?: () => any
@ -117,7 +117,7 @@ export interface ValueScreenOption extends BaseOptions {
clicked?: () => any
}
export type Option = ButtonOption | CheckboxOption | SelectOption
export type Option = ButtonOption | CheckboxOption | SelectOption
| DividerOption | LabelOption | HTMLOption | DropdownOption
| BreadcrumbsOption | InputOption | FlatSliderOption | SkeuomorphSliderOption
| ValueScreenOption
@ -126,7 +126,7 @@ export type Options = Option[][]
@Component({
selector: 'eqm-options',
templateUrl: './options.component.html',
styleUrls: ['./options.component.scss']
styleUrls: [ './options.component.scss' ]
})
export class OptionsComponent {
@Input() options: Options = []
@ -135,10 +135,10 @@ export class OptionsComponent {
constructor (
public app: ApplicationService,
public ref: ChangeDetectorRef
) {}
) {}
getOptionStyle (option: Option, row: Option[]) {
let style = option.style || {}
const style = option.style || {}
if (!style.width) {
style.width = `${100 / row.length}%`
}
@ -146,7 +146,7 @@ export class OptionsComponent {
style.width = '100%'
}
if (!!option.isEnabled && option.isEnabled() === false) {
if (!!option.isEnabled && !option.isEnabled()) {
style.filter = 'grayscale(1)'
}
@ -154,7 +154,7 @@ export class OptionsComponent {
}
toggleCheckbox (checkbox: CheckboxOption) {
if (!!checkbox.isEnabled && checkbox.isEnabled() === false) {
if (!!checkbox.isEnabled && !checkbox.isEnabled()) {
return
}
checkbox.value = !checkbox.value
@ -163,7 +163,7 @@ export class OptionsComponent {
}
selectedOption (option: SelectOption, selectOption: SelectOptionOption) {
if (!!option.isEnabled && option.isEnabled() === false) {
if (!!option.isEnabled && !option.isEnabled()) {
return
}
if (option.selectedId !== selectOption.id) {

2
ui/src/app/components/prompt-dialog/prompt-dialog.component.ts
View File

@ -10,7 +10,7 @@ export interface PromptDialogData extends ConfirmDialogData {
@Component({
selector: 'eqm-prompt-dialog',
templateUrl: './prompt-dialog.component.html',
styleUrls: ['./prompt-dialog.component.scss']
styleUrls: [ './prompt-dialog.component.scss' ]
})
export class PromptDialogComponent extends ConfirmDialogComponent {
@Input() prompt

6
ui/src/app/modules/animations/fade-in-out.ts
View File

@ -1,13 +1,13 @@
import { trigger, style, animate, transition, state } from '@angular/animations'
import { trigger, style, animate, transition } from '@angular/animations'
const DURATION = 100
export const FadeInOutAnimation = trigger('FadeInOut', [
transition(':enter', [ // :enter is alias to 'void => *'
transition(':enter', [ // :enter is alias to 'void => *'
style({ opacity: 0 }),
animate(DURATION, style({ opacity: 1 }))
]),
transition(':leave', [ // :leave is alias to '* => void'
transition(':leave', [ // :leave is alias to '* => void'
animate(DURATION, style({ opacity: 0 }))
])
])

4
ui/src/app/modules/animations/from-top.ts
View File

@ -11,11 +11,11 @@ const END_FRAME_STATE = {
}
export const FromTopAnimation = trigger('FromTop', [
transition(':enter', [ // :enter is alias to 'void => *'
transition(':enter', [ // :enter is alias to 'void => *'
style(INITIAL_STATE),
animate(DURATION, style(END_FRAME_STATE))
]),
transition(':leave', [ // :leave is alias to '* => void'
transition(':leave', [ // :leave is alias to '* => void'
animate(DURATION, style(INITIAL_STATE))
])
])

6
ui/src/app/modules/eqmac-components/components/analyzer/analyzer.component.ts
View File

@ -8,7 +8,7 @@ import {
@Component({
selector: 'eqm-analyzer',
templateUrl: './analyzer.component.html',
styleUrls: ['./analyzer.component.scss']
styleUrls: [ './analyzer.component.scss' ]
})
export class AnalyzerComponent implements OnInit {
@ -32,8 +32,8 @@ export class AnalyzerComponent implements OnInit {
// Get canvas context
const gridCanvas: HTMLCanvasElement = this.gridCanvas.nativeElement
gridCanvas.style.height = this.container.nativeElement.offsetHeight + 'px'
gridCanvas.style.width = this.container.nativeElement.offsetWidth + 'px'
gridCanvas.style.height = `${parseInt(this.container.nativeElement.offsetHeight)}px`
gridCanvas.style.width = `${parseInt(this.container.nativeElement.offsetWidth)}px`
this.width = gridCanvas.offsetWidth
this.height = gridCanvas.offsetHeight

8
ui/src/app/modules/eqmac-components/components/breadcrumbs/breadcrumbs.component.ts
View File

@ -1,17 +1,15 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
@Component({
selector: 'eqm-breadcrumbs',
templateUrl: './breadcrumbs.component.html',
styleUrls: ['./breadcrumbs.component.scss']
styleUrls: [ './breadcrumbs.component.scss' ]
})
export class BreadcrumbsComponent implements OnInit {
@Input() crumbs: string[]
@Input() underline = true
@Output() crumbClicked = new EventEmitter<{ crumb: string, index: number }>()
constructor() { }
ngOnInit(): void {
ngOnInit (): void {
}
}

4
ui/src/app/modules/eqmac-components/components/button/button.component.ts
View File

@ -3,7 +3,7 @@ import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'
@Component({
selector: 'eqm-button',
templateUrl: './button.component.html',
styleUrls: ['./button.component.scss']
styleUrls: [ './button.component.scss' ]
})
export class ButtonComponent implements OnInit {
@Input() type: 'large' | 'narrow' | 'square' | 'circle' | 'transparent' = 'large'
@ -15,7 +15,6 @@ export class ButtonComponent implements OnInit {
@Input() hoverable = true
@Input() disabled = false
@Output() pressed = new EventEmitter()
constructor () { }
ngOnInit () {
}
@ -55,5 +54,4 @@ export class ButtonComponent implements OnInit {
this.pressed.emit()
}
}
}

17
ui/src/app/modules/eqmac-components/components/carousel/carousel.component.ts
View File

@ -1,5 +1,5 @@
import { Component, ContentChildren, QueryList, Directive, ViewChild, ElementRef, Input, TemplateRef, ViewContainerRef, AfterViewInit, Output, EventEmitter, HostBinding, ViewChildren, OnDestroy } from '@angular/core'
import { AnimationPlayer, AnimationFactory, animate, style, AnimationBuilder } from '@angular/animations'
import { Component, ContentChildren, QueryList, Directive, ViewChild, ElementRef, Input, TemplateRef, AfterViewInit, Output, EventEmitter, ViewChildren, OnDestroy } from '@angular/core'
import { AnimationFactory, animate, style, AnimationBuilder } from '@angular/animations'
@Directive({
selector: '[eqmCarouselItem]'
@ -23,7 +23,7 @@ export class CarouselItemElement {
@Component({
selector: 'eqm-carousel',
templateUrl: './carousel.component.html',
styleUrls: ['./carousel.component.scss']
styleUrls: [ './carousel.component.scss' ]
})
export class CarouselComponent implements AfterViewInit, OnDestroy {
@ContentChildren(CarouselItemDirective) items: QueryList<CarouselItemDirective>
@ -41,6 +41,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
this.heightDiff.emit(diff)
}
}
@Output() heightDiff = new EventEmitter<number>()
@Output() heightChange = new EventEmitter<number>()
public recalculateHeightTimer
@ -54,6 +55,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
this.recalculateHeight()
this.itemCameIntoView.emit(this.selectedItemId)
}
get selectedItemId () { return this._selectedItemId }
@Output() selectedItemIdChange = new EventEmitter<string>()
@Output() animationCompleted = new EventEmitter<string>()
@ -75,13 +77,13 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
ngAfterViewInit () {
for (const item of this.items.toArray()) {
if (!item.eqmCarouselItem || typeof item.eqmCarouselItem !== 'string') {
throw new Error(`eqmCarouselItem directive was not provided an item ID`)
throw new Error('eqmCarouselItem directive was not provided an item ID')
}
}
this.animate()
this.recalculateHeight()
this.recalculateHeightTimer = setInterval(this.recalculateHeight.bind(this), 1000)
this.recalculateHeightTimer = setInterval(() => this.recalculateHeight(), 1000)
}
ngOnDestroy () {
@ -127,8 +129,7 @@ export class CarouselComponent implements AfterViewInit, OnDestroy {
}
public recalculateHeight () {
const itemEl = this.itemElems && this.itemElems.toArray()[this.currentIndex].nativeElement.nextElementSibling
itemEl && itemEl.offsetHeight && (this.height = itemEl.offsetHeight)
const itemEl = this.itemElems?.toArray()[this.currentIndex].nativeElement.nextElementSibling
itemEl?.offsetHeight && (this.height = itemEl.offsetHeight)
}
}

4
ui/src/app/modules/eqmac-components/components/checkbox/checkbox.component.ts
View File

@ -1,9 +1,9 @@
import { Component, OnInit, Input, Output, EventEmitter, HostBinding } from '@angular/core'
import { Component, Input, Output, EventEmitter, HostBinding } from '@angular/core'
@Component({
selector: 'eqm-checkbox',
templateUrl: './checkbox.component.html',
styleUrls: ['./checkbox.component.scss']
styleUrls: [ './checkbox.component.scss' ]
})
export class CheckboxComponent {
@Input() interactive: boolean = true

4
ui/src/app/modules/eqmac-components/components/container/container.component.ts
View File

@ -3,13 +3,11 @@ import { Component, OnInit, HostBinding, Input } from '@angular/core'
@Component({
selector: 'eqm-container',
templateUrl: './container.component.html',
styleUrls: ['./container.component.scss']
styleUrls: [ './container.component.scss' ]
})
export class ContainerComponent implements OnInit {
@HostBinding('class.disabled') @Input() disabled = false
constructor () { }
ngOnInit () {
}
}

5
ui/src/app/modules/eqmac-components/components/divider/divider.component.ts
View File

@ -1,9 +1,9 @@
import { Component, OnInit, Input, ElementRef, HostBinding } from '@angular/core'
import { Component, Input, ElementRef, HostBinding } from '@angular/core'
@Component({
selector: 'eqm-divider',
templateUrl: './divider.component.html',
styleUrls: ['./divider.component.scss']
styleUrls: [ './divider.component.scss' ]
})
export class DividerComponent {
@Input() orientation: 'vertical' | 'horizontal' = 'horizontal'
@ -41,5 +41,4 @@ export class DividerComponent {
get bottomtBorder () {
return this.orientation === 'horizontal' ? '1px solid rgb(96, 97, 101)' : undefined
}
}

20
ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.ts
View File

@ -1,34 +1,35 @@
import { Component, OnInit, Input, ViewChild, ElementRef, EventEmitter, Output, NgZone, HostBinding, HostListener } from '@angular/core'
import { SelectBoxComponent } from '../select-box/select-box.component'
import { UtilitiesService } from '../../services/utilities.service'
import { InputFieldComponent } from '../input-field/input-field.component'
import { FadeInOutAnimation } from 'src/app/modules/animations'
@Component({
selector: 'eqm-dropdown',
templateUrl: './dropdown.component.html',
styleUrls: ['./dropdown.component.scss'],
styleUrls: [ './dropdown.component.scss' ],
animations: [ FadeInOutAnimation ]
})
export class DropdownComponent implements OnInit {
constructor (
public utils: UtilitiesService,
public utils: UtilitiesService,
public zone: NgZone,
public ref: ElementRef
) {
}
public _items: any[] = []
@Input() editable = false
@Input()
get items () {
return this._items
}
set items (newItems) {
if (!newItems || !Array.isArray(newItems)) return
this.searchText = null
this._items = newItems
}
@Output() refChanged = new EventEmitter<DropdownComponent>()
@HostBinding('class.disabled') @Input() disabled = false
@Input() selectedItem = null
@ -54,7 +55,8 @@ export class DropdownComponent implements OnInit {
if (!this.items) this.items = []
this.setDimensions()
this.calculateYCoordinate()
for (let _ in [...Array(3)]) {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
for (const _ of [ ...Array(3) ]) {
await this.utils.delay(100)
this.calculateYCoordinate()
}
@ -78,19 +80,19 @@ export class DropdownComponent implements OnInit {
this.direction = preferredDirection
const inputEl = this.container.nativeElement
const inputHeight = inputEl.offsetHeight
const inputHeight = parseInt(inputEl.offsetHeight)
const inputPosition = inputEl.getBoundingClientRect()
const boxHeight = this.boxComponent.height
const downY = inputPosition.y + inputHeight + this.padding / 2
const downY = parseInt(inputPosition.y) + inputHeight + this.padding / 2
const downSpaceLeft = viewHeight - (downY + boxHeight)
const upY = inputPosition.top - boxHeight - this.padding
const upSpaceLeft = upY
this.direction = this.forceDirection ?? (downSpaceLeft > upSpaceLeft ? 'down' : 'up')
let y = this.direction === 'down' ? downY : upY
const y = this.direction === 'down' ? downY : upY
this.yCoordinate = y
}
@ -128,7 +130,7 @@ export class DropdownComponent implements OnInit {
}
searchText: string
@HostListener('document:keypress', ['$event'])
@HostListener('document:keypress', [ '$event' ])
keypress (event: KeyboardEvent) {
if (!this.disabled && this.shown && this.searchable) {
switch (event.key) {

64
ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.ts
View File

@ -1,6 +1,5 @@
import {
Component,
OnInit,
ViewChild,
Input,
Output,
@ -13,7 +12,7 @@ import {
UtilitiesService
} from '../../services/utilities.service'
import { FadeInOutAnimation } from '../../../animations'
import { SafeStyle, DomSanitizer } from '@angular/platform-browser'
import { DomSanitizer } from '@angular/platform-browser'
export interface FlatSliderValueChangedEvent {
value: number
@ -23,8 +22,8 @@ export interface FlatSliderValueChangedEvent {
@Component({
selector: 'eqm-flat-slider',
templateUrl: './flat-slider.component.html',
styleUrls: ['./flat-slider.component.scss'],
animations: [FadeInOutAnimation]
styleUrls: [ './flat-slider.component.scss' ],
animations: [ FadeInOutAnimation ]
})
export class FlatSliderComponent {
constructor (
@ -61,6 +60,7 @@ export class FlatSliderComponent {
this._enabled = shouldBeEnabled
this._color = this._enabled ? this.defaultColor : '#777'
}
get enabled () { return this._enabled }
public _color = this.defaultColor
@ -69,6 +69,7 @@ export class FlatSliderComponent {
this.defaultColor = newColor
this._color = this._enabled ? this.defaultColor : '#777'
}
get color () {
return this._color
}
@ -85,7 +86,7 @@ export class FlatSliderComponent {
public dragging = false
public thumbRadius = 4
public _value = .5
public _value = 0.5
@Input()
set value (newValue) {
let value = this.clampValue(newValue)
@ -98,10 +99,10 @@ export class FlatSliderComponent {
diffFromMiddle *= -1
}
const percFromMiddle = this.mapValue({
value: diffFromMiddle,
inMin: 0,
inMax: this.max - middleValue,
outMin: 0,
value: diffFromMiddle,
inMin: 0,
inMax: this.max - middleValue,
outMin: 0,
outMax: 100
})
if ((this._value).toFixed(2) === (middleValue).toFixed(2) && percFromMiddle < 5) {
@ -116,6 +117,7 @@ export class FlatSliderComponent {
this._value = this.clampValue(value)
this.valueChange.emit(this._value)
}
get value () { return this._value }
@Output() valueChange = new EventEmitter()
@ -128,13 +130,14 @@ export class FlatSliderComponent {
get width () {
return this.containerRef.nativeElement.offsetWidth
}
public clampValue (value) {
if (value < this.min) return this.min
if (value > this.max) return this.max
return value
}
@HostListener('mousewheel', ['$event'])
@HostListener('mousewheel', [ '$event' ])
mouseWheel (event: MouseWheelEvent) {
if (this.enabled && this.scrollEnabled) {
// const multiplier = (this.max - this.min) / 1000
@ -165,7 +168,8 @@ export class FlatSliderComponent {
if (progress > inMax) progress = inMax
return this.mapValue({
value: progress,
inMin, inMax,
inMin,
inMax,
outMin: this.min,
outMax: this.max
})
@ -173,7 +177,7 @@ export class FlatSliderComponent {
return value
}
@HostListener('mousedown', ['$event'])
@HostListener('mousedown', [ '$event' ])
mousedown (event: MouseEvent) {
if (this.enabled) {
this.dragging = true
@ -182,7 +186,7 @@ export class FlatSliderComponent {
}
}
@HostListener('mousemove', ['$event'])
@HostListener('mousemove', [ '$event' ])
mousemove (event: MouseEvent) {
if (this.enabled && this.dragging) {
this.value = this.getValueFromMouseEvent(event)
@ -195,6 +199,7 @@ export class FlatSliderComponent {
onMouseEnter (): void {
this.mouseInside = true
}
@HostListener('mouseleave')
onMouseLeave (): void {
this.mouseInside = false
@ -229,13 +234,13 @@ export class FlatSliderComponent {
value += step
this.value = value
}
return
}
@HostListener('mouseup', ['$event'])
@HostListener('mouseup', [ '$event' ])
onMouseUp () {
this.dragging = false
}
mouseup (event) {
this.dragging = false
}
@ -259,10 +264,10 @@ export class FlatSliderComponent {
const styles: { [style: string]: string } = {}
const narrow = this.thumbRadius * 2 + 2
if (this.orientation === 'horizontal') {
styles.width = `100%`
styles.width = '100%'
styles.height = `${narrow}px`
} else {
styles.height = `100%`
styles.height = '100%'
styles.width = `${narrow}px`
}
@ -329,20 +334,20 @@ export class FlatSliderComponent {
style.borderRadius = '100%'
if (this.orientation === 'horizontal') {
const left = this.mapValue({
value: this.value,
inMin: this.min,
inMax: this.max,
outMin: -borderSize,
value: this.value,
inMin: this.min,
inMax: this.max,
outMin: -borderSize,
outMax: this.width - this.thumbRadius * 2 - borderSize,
logInverse: true
})
style.left = `${left}px`
} else {
style.bottom = `${this.mapValue({
value: this.value,
inMin: this.min,
inMax: this.max,
outMin: -borderSize,
value: this.value,
inMin: this.min,
inMax: this.max,
outMin: -borderSize,
outMax: this.height - this.thumbRadius * 2 - borderSize,
logInverse: true
})}px`
@ -351,13 +356,16 @@ export class FlatSliderComponent {
}
private mapValue ({ value, inMin, inMax, outMin, outMax, logInverse }: {
value: number, inMin: number, inMax: number, outMin: number, outMax: number
value: number
inMin: number
inMax: number
outMin: number
outMax: number
logInverse?: boolean
}) {
switch (this.scale) {
case 'linear': return this.utils.mapValue(value, inMin, inMax, outMin, outMax)
case 'logarithmic': return (logInverse ? this.utils.logMapValueInverse : this.utils.logMapValue)
({ value, inMin, inMax, outMin, outMax })
case 'logarithmic': return (logInverse ? this.utils.logMapValueInverse : this.utils.logMapValue)({ value, inMin, inMax, outMin, outMax })
}
}
}

6
ui/src/app/modules/eqmac-components/components/icon/icon.component.ts
View File

@ -10,7 +10,7 @@ import { DomSanitizer, SafeHtml } from '@angular/platform-browser'
@Component({
selector: 'eqm-icon',
templateUrl: './icon.component.html',
styleUrls: ['./icon.component.scss'],
styleUrls: [ './icon.component.scss' ],
encapsulation: ViewEncapsulation.ShadowDom
})
export class IconComponent implements OnInit {
@ -18,10 +18,12 @@ export class IconComponent implements OnInit {
@Input() height = 20
svg: SafeHtml
icons = svgs
@Input() set size (newSize) {
this.width = newSize
this.height = newSize
}
_color = '#979aa0'
@Input()
set color (newColor) {
@ -47,6 +49,7 @@ export class IconComponent implements OnInit {
get rotate () {
return this._rotate
}
set rotate (angle: number) {
this._rotate = angle
}
@ -57,6 +60,7 @@ export class IconComponent implements OnInit {
this._name = iconName
this.svg = this.sanitizer.bypassSecurityTrustHtml(this.icons[this.name])
}
get name () { return this._name }
@Input() stroke: number = 0

4
ui/src/app/modules/eqmac-components/components/input-field/input-field.component.ts
View File

@ -3,7 +3,7 @@ import { Component, OnInit, Input, EventEmitter, Output, ViewChild, HostBinding
@Component({
selector: 'eqm-input-field',
templateUrl: './input-field.component.html',
styleUrls: ['./input-field.component.scss']
styleUrls: [ './input-field.component.scss' ]
})
export class InputFieldComponent implements OnInit {
@Input() text: string
@ -14,7 +14,6 @@ export class InputFieldComponent implements OnInit {
@HostBinding('class.disabled') @Input() disabled = false
@Input() fontSize = 12
@ViewChild('container', { static: true }) container
constructor () { }
ngOnInit () {
}
@ -26,5 +25,4 @@ export class InputFieldComponent implements OnInit {
enterPressed () {
this.enter.emit()
}
}

8
ui/src/app/modules/eqmac-components/components/knob/knob.component.ts
View File

@ -19,7 +19,7 @@ export interface KnobValueChangedEvent {
@Component({
selector: 'eqm-knob',
templateUrl: './knob.component.html',
styleUrls: ['./knob.component.scss']
styleUrls: [ './knob.component.scss' ]
})
export class KnobComponent implements OnInit {
@Input() size: 'large' | 'medium' | 'small' = 'medium'
@ -59,7 +59,6 @@ export class KnobComponent implements OnInit {
if (this._value === newValue || typeof newValue !== 'number') return
let value = newValue
if (this.stickToMiddle) {
let diffFromMiddle = this.middleValue - value
if (diffFromMiddle < 0) {
diffFromMiddle *= -1
@ -77,6 +76,7 @@ export class KnobComponent implements OnInit {
this._value = this.clampValue(value)
this.valueChange.emit(this._value)
}
get value () {
return this._value
}
@ -116,7 +116,7 @@ export class KnobComponent implements OnInit {
this.dragging = false
}
@HostListener('gesturechange', ['$event'])
@HostListener('gesturechange', [ '$event' ])
onGestureChange (event) {
if (!this.disabled) {
try {
@ -133,7 +133,6 @@ export class KnobComponent implements OnInit {
mousemove (event) {
if (!this.disabled) {
if (this.setDraggingFalseTimeout) {
window.clearTimeout(this.setDraggingFalseTimeout)
}
@ -236,7 +235,6 @@ export class KnobComponent implements OnInit {
}
}
this.continueAnimation = false
return
}
public getDegreesFromEvent (event) {

5
ui/src/app/modules/eqmac-components/components/label/label.component.ts
View File

@ -1,15 +1,14 @@
import { Component, OnInit, Input, HostBinding } from '@angular/core'
import { Component, Input, HostBinding } from '@angular/core'
@Component({
selector: 'eqm-label',
templateUrl: './label.component.html',
styleUrls: ['./label.component.scss']
styleUrls: [ './label.component.scss' ]
})
export class LabelComponent {
@Input() fontSize: number
@Input() color: string
@Input() clickable = false
constructor () { }
get style () {
return {

5
ui/src/app/modules/eqmac-components/components/loading/loading.component.ts
View File

@ -1,15 +1,16 @@
import { Component, ViewChild, ElementRef, OnInit, AfterViewInit } from '@angular/core'
import { Component, ViewChild, ElementRef, AfterViewInit } from '@angular/core'
@Component({
selector: 'eqm-loading',
templateUrl: './loading.component.html',
styleUrls: ['./loading.component.scss']
styleUrls: [ './loading.component.scss' ]
})
export class LoadingComponent implements AfterViewInit {
@ViewChild('wave', { static: true }) wave: ElementRef
ngAfterViewInit () {
const path = this.wave.nativeElement
// eslint-disable-next-line no-loss-of-precision
const m = 0.512286623256592433
const w = 90
const h = 60

6
ui/src/app/modules/eqmac-components/components/prompt/prompt.component.ts
View File

@ -3,13 +3,9 @@ import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-prompt',
templateUrl: './prompt.component.html',
styleUrls: ['./prompt.component.scss']
styleUrls: [ './prompt.component.scss' ]
})
export class PromptComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

6
ui/src/app/modules/eqmac-components/components/question/question.component.ts
View File

@ -1,13 +1,11 @@
import { Component, OnInit, Input } from '@angular/core'
import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-question',
template: '<eqm-icon stroke="0" color="#c9cdd0" width="8" height="8" name="help"></eqm-icon>',
styles: [':host { height: 12px; width: 12px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #2c2c2e; }']
styles: [ ':host { height: 12px; width: 12px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background-color: #2c2c2e; }' ]
})
export class QuestionComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

6
ui/src/app/modules/eqmac-components/components/screw/screw.component.ts
View File

@ -3,13 +3,9 @@ import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-screw',
templateUrl: './screw.component.html',
styleUrls: ['./screw.component.scss']
styleUrls: [ './screw.component.scss' ]
})
export class ScrewComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

5
ui/src/app/modules/eqmac-components/components/select-box/select-box.component.ts
View File

@ -3,16 +3,16 @@ import { Component, OnInit, Input, Output, EventEmitter, ViewChild, ElementRef }
@Component({
selector: 'eqm-select-box',
templateUrl: './select-box.component.html',
styleUrls: ['./select-box.component.scss']
styleUrls: [ './select-box.component.scss' ]
})
export class SelectBoxComponent implements OnInit {
_items: any[] = []
@Input()
set items (newItems: any[]) {
this._items = newItems
this.setHeight()
}
get items () {
return this._items
}
@ -67,5 +67,4 @@ export class SelectBoxComponent implements OnInit {
this.selectedItem = item
this.itemSelected.emit(item)
}
}

24
ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.ts
View File

@ -21,10 +21,9 @@ export interface SkeuomorphSliderValueChangedEvent {
@Component({
selector: 'eqm-skeuomorph-slider',
templateUrl: './skeuomorph-slider.component.html',
styleUrls: ['./skeuomorph-slider.component.scss']
styleUrls: [ './skeuomorph-slider.component.scss' ]
})
export class SkeuomorphSliderComponent implements OnInit {
constructor (public utils: UtilitiesService, public elRef: ElementRef) {}
@Input() min: number = 0
@ -50,7 +49,7 @@ export class SkeuomorphSliderComponent implements OnInit {
@HostBinding('class.disabled') @Input() disabled = false
public _value = .5
public _value = 0.5
@Input()
set value (newValue) {
let value = this.clampValue(newValue)
@ -74,11 +73,11 @@ export class SkeuomorphSliderComponent implements OnInit {
}
this._value = this.clampValue(value)
this.valueChange.emit(this._value)
}
get value () { return this._value }
@HostListener('mousewheel', ['$event'])
@HostListener('mousewheel', [ '$event' ])
onMouseWheel (event): void {
if (!this.disabled && this.scrollEnabled) {
this.value += -event.deltaY / 100
@ -105,7 +104,7 @@ export class SkeuomorphSliderComponent implements OnInit {
}
}
@HostListener('mousedown', ['$event'])
@HostListener('mousedown', [ '$event' ])
onMouseDown (event) {
if (!this.disabled) {
this.dragging = true
@ -119,7 +118,7 @@ export class SkeuomorphSliderComponent implements OnInit {
}
}
@HostListener('mousemove', ['$event'])
@HostListener('mousemove', [ '$event' ])
onMouseMove (event) {
if (!this.disabled && this.dragging) {
this.value = this.getValueFromMouseEvent(event)
@ -127,7 +126,7 @@ export class SkeuomorphSliderComponent implements OnInit {
}
}
@HostListener('mouseup', ['$event'])
@HostListener('mouseup', [ '$event' ])
onMouseUp () {
this.dragging = false
}
@ -154,7 +153,7 @@ export class SkeuomorphSliderComponent implements OnInit {
ngOnInit () {
if (this.showNotches) {
this.drawNotches()
setTimeout(this.drawNotches.bind(this))
setTimeout(() => this.drawNotches())
}
}
@ -171,7 +170,6 @@ export class SkeuomorphSliderComponent implements OnInit {
value += step
this.value = value
}
return
}
@HostListener('window:resize')
@ -186,9 +184,9 @@ export class SkeuomorphSliderComponent implements OnInit {
const gap = (height - padding * 2) / 10
ctx.strokeStyle = '#559e7d'
for (let i = 0; i <= 10; i++) {
const y = Math.round(padding + gap * i) - .5
const y = Math.round(padding + gap * i) - 0.5
ctx.beginPath()
const lineWidth = [0, 5, 10].includes(i) ? width : (width * 0.9)
const lineWidth = [ 0, 5, 10 ].includes(i) ? width : (width * 0.9)
ctx.moveTo((width - lineWidth) / 1, y)
ctx.lineTo(lineWidth, y)
ctx.stroke()
@ -198,6 +196,6 @@ export class SkeuomorphSliderComponent implements OnInit {
}
calculateTop () {
return this.utils.mapValue(this._value, this.min, this.max, this.elRef.nativeElement.offsetHeight - 25, 0) + 'px'
return `${this.utils.mapValue(this._value, this.min, this.max, parseInt(this.elRef.nativeElement.offsetHeight) - 25, 0)}px`
}
}

5
ui/src/app/modules/eqmac-components/components/toggle/toggle.component.ts
View File

@ -3,12 +3,9 @@ import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'
@Component({
selector: 'eqm-toggle',
templateUrl: './toggle.component.html',
styleUrls: ['./toggle.component.scss']
styleUrls: [ './toggle.component.scss' ]
})
export class ToggleComponent implements OnInit {
constructor () { }
@Input() state = false
@Output() stateChange = new EventEmitter()

4
ui/src/app/modules/eqmac-components/components/tooltip/tooltip-container.component.ts
View File

@ -16,10 +16,8 @@ import { FadeInOutAnimation } from '../../../animations/fade-in-out'
</eqm-tooltip>
</div>
`,
animations: [FadeInOutAnimation]
animations: [ FadeInOutAnimation ]
})
export class TooltipContainerComponent {
constructor (public tooltipService: TooltipService) {}
}

14
ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.ts
View File

@ -6,13 +6,13 @@ import {
ViewChild
} from '@angular/core'
import { UtilitiesService } from '../../services/utilities.service'
import { SafeStyle, DomSanitizer } from '@angular/platform-browser'
import { DomSanitizer } from '@angular/platform-browser'
export type TooltipPositionSide = 'top' | 'bottom' | 'left' | 'right'
@Component({
selector: 'eqm-tooltip',
templateUrl: './tooltip.component.html',
styleUrls: ['./tooltip.component.scss']
styleUrls: [ './tooltip.component.scss' ]
})
export class TooltipComponent implements OnInit {
@Input() text: string
@ -49,12 +49,11 @@ export class TooltipComponent implements OnInit {
const viewHeight = Math.max(body.scrollHeight, body.offsetHeight, html.clientHeight, html.scrollHeight, html.offsetHeight)
const viewWidth = Math.max(body.scrollWidth, body.offsetWidth, html.clientWidth, html.scrollWidth, html.offsetWidth)
const tooltipEl = this.tooltip.nativeElement
const tooltipWidth = tooltipEl.offsetWidth + 3
const tooltipHeight = tooltipEl.offsetHeight + 2
const tooltipWidth = parseInt(tooltipEl.offsetWidth) + 3
const tooltipHeight = parseInt(tooltipEl.offsetHeight) + 2
const parentEl = this.parent.nativeElement
const parentPosition = this.utils.getElementPosition(parentEl)
const parentWidth = parentEl.offsetWidth
const parentHeight = parentEl.offsetHeight
const parentHeight = parseInt(parentEl.offsetHeight)
x = parentPosition.x
y = parentPosition.y
@ -98,14 +97,12 @@ export class TooltipComponent implements OnInit {
let angle = 0
const style: { [style: string]: string } = {}
const tooltipEl = this.tooltip.nativeElement
const tooltipWidth = tooltipEl.offsetWidth
const tooltipHeight = tooltipEl.offsetHeight
const tooltipPosition = this.utils.getElementPosition(tooltipEl)
const parentEl = this.parent.nativeElement
const parentPosition = this.utils.getElementPosition(parentEl)
const parentWidth = parentEl.offsetWidth
const parentHeight = parentEl.offsetHeight
x = parentPosition.x + parentWidth / 2 - tooltipPosition.x - arrowSize / 2 + 3
if (this.positionSide === 'top') {
@ -126,5 +123,4 @@ export class TooltipComponent implements OnInit {
return style
}
}

1
ui/src/app/modules/eqmac-components/components/tooltip/tooltip.directive.ts
View File

@ -51,5 +51,4 @@ export class TooltipDirective implements OnDestroy {
destroy (): void {
this.tooltipService.components = []
}
}

1
ui/src/app/modules/eqmac-components/components/tooltip/tooltip.service.ts
View File

@ -4,6 +4,5 @@ import { Injectable } from '@angular/core'
providedIn: 'root'
})
export class TooltipService {
components: any[] = []
}

7
ui/src/app/modules/eqmac-components/components/value-screen/value-screen.component.ts
View File

@ -1,20 +1,17 @@
import {
Component,
OnInit,
Input,
HostBinding
Input
} from '@angular/core'
@Component({
selector: 'eqm-value-screen',
templateUrl: './value-screen.component.html',
styleUrls: ['./value-screen.component.scss']
styleUrls: [ './value-screen.component.scss' ]
})
export class ValueScreenComponent implements OnInit {
@Input() fontSize = 10
@Input() disabled = false
constructor () {}
ngOnInit () {}
}

4
ui/src/app/modules/eqmac-components/components/vent/vent.component.ts
View File

@ -3,11 +3,9 @@ import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-vent',
template: '',
styleUrls: ['./vent.component.scss']
styleUrls: [ './vent.component.scss' ]
})
export class VentComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

7
ui/src/app/modules/eqmac-components/directives/clicked-outside.directive.ts
View File

@ -1,6 +1,6 @@
import { Component, Directive, EventEmitter, HostListener, Output } from "@angular/core";
import { Directive, EventEmitter, HostListener, Output } from '@angular/core'
@Directive({ selector: `[clickedOutside]` })
@Directive({ selector: '[clickedOutside]' })
export class ClickedOutsideDirective {
@Output() clickedOutside = new EventEmitter()
@ -9,6 +9,7 @@ export class ClickedOutsideDirective {
insideClick () {
this.inside = true
}
@HostListener('document:click')
outsideClick () {
if (!this.inside) {
@ -16,4 +17,4 @@ export class ClickedOutsideDirective {
}
this.inside = false
}
}
}

8
ui/src/app/modules/eqmac-components/directives/mousewheel.directive.ts
View File

@ -4,21 +4,20 @@ import { Directive, Output, HostListener, EventEmitter } from '@angular/core'
export class MouseWheelDirective {
@Output() mouseWheel = new EventEmitter()
@HostListener('mousewheel', ['$event']) onMouseWheelChrome (event: any) {
@HostListener('mousewheel', [ '$event' ]) onMouseWheelChrome (event: any) {
this.mouseWheelFunc(event)
}
@HostListener('DOMMouseScroll', ['$event']) onMouseWheelFirefox (event: any) {
@HostListener('DOMMouseScroll', [ '$event' ]) onMouseWheelFirefox (event: any) {
this.mouseWheelFunc(event)
}
@HostListener('onmousewheel', ['$event']) onMouseWheelIE (event: any) {
@HostListener('onmousewheel', [ '$event' ]) onMouseWheelIE (event: any) {
this.mouseWheelFunc(event)
}
mouseWheelFunc (event: any) {
event = window.event || event // old IE support
const delta = Math.max(-1, Math.min(1, (event.wheelDelta || -event.detail)))
this.mouseWheel.emit(event)
// for IE
event.returnValue = false
@ -27,5 +26,4 @@ export class MouseWheelDirective {
event.preventDefault()
}
}
}

4
ui/src/app/modules/eqmac-components/eqmac-components.module.ts
View File

@ -1,5 +1,5 @@
import {
NgModule, TemplateRef
NgModule
} from '@angular/core'
import {
CommonModule
@ -46,7 +46,7 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { CarouselComponent, CarouselItemDirective, CarouselItemElement } from './components/carousel/carousel.component'
import { QuestionComponent } from './components/question/question.component'
import { ClickedOutsideDirective } from './directives/clicked-outside.directive'
import { ScrollingModule } from '@angular/cdk/scrolling';
import { ScrollingModule } from '@angular/cdk/scrolling'
import { BreadcrumbsComponent } from './components/breadcrumbs/breadcrumbs.component'
@NgModule({

25
ui/src/app/modules/eqmac-components/services/utilities.service.ts
View File

@ -2,14 +2,16 @@ import { Injectable } from '@angular/core'
@Injectable()
export class UtilitiesService {
constructor () { }
mapValue (value: number, inMin: number, inMax: number, outMin: number, outMax: number): number {
return (value - inMin) * (outMax - outMin) / (inMax - inMin) + outMin
}
logMapValue ({ value, inMin, inMax, outMin, outMax }: {
value: number, inMin: number, inMax: number, outMin: number, outMax: number
value: number
inMin: number
inMax: number
outMin: number
outMax: number
}) {
outMin = Math.log(outMin)
outMax = Math.log(outMax)
@ -18,7 +20,11 @@ export class UtilitiesService {
}
logMapValueInverse ({ value, inMin, inMax, outMin, outMax }: {
value: number, inMin: number, inMax: number, outMin: number, outMax: number
value: number
inMin: number
inMax: number
outMin: number
outMax: number
}) {
inMin = Math.log(inMin || 1)
inMax = Math.log(inMax)
@ -31,7 +37,7 @@ export class UtilitiesService {
getImageFromSrcWhenLoaded (src) {
return new Promise<HTMLImageElement>((resolve, reject) => {
const image = new Image()
image.crossOrigin = 'anonymous' // This enables CORS
image.crossOrigin = 'anonymous' // This enables CORS
image.onload = () => resolve(image)
image.onerror = () => reject(image)
image.src = src
@ -52,12 +58,12 @@ export class UtilitiesService {
return this.getImageFromSrcWhenLoaded(this.getBackgroundImageSrcFromClass(className))
}
getRandomFloatInRange (min, max) {
getRandomFloatInRange (min: number, max: number) {
return (Math.random() * (max - min) + min)
}
getCoordinatesInsideElementFromEvent (event: MouseEvent, element?) {
let el = element || event.target
const el = element || event.target
const rect = el.getBoundingClientRect()
return {
x: event.clientX - rect.left,
@ -75,7 +81,7 @@ export class UtilitiesService {
const rect = el.getBoundingClientRect()
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft
const scrollTop = window.pageYOffset || document.documentElement.scrollTop
return { y: rect.top + scrollTop, x: rect.left + scrollLeft }
return { y: parseInt(rect.top) + scrollTop, x: parseInt(rect.left) + scrollLeft }
}
hexToRgb (hex: string) {
@ -86,7 +92,7 @@ export class UtilitiesService {
g: result[2],
b: result[3]
}
for (const [color, hex] of Object.entries(rgb)) {
for (const [ color, hex ] of Object.entries(rgb)) {
if ((hex as string).length < 2) rgb[color] = `${hex}${hex}`
rgb[color] = parseInt(rgb[color], 16)
}
@ -99,5 +105,4 @@ export class UtilitiesService {
rgbToHex ({ r, g, b }: { r: number, g: number, b: number }) {
return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)
}
}

2
ui/src/app/modules/pipes/clip-value.pipe.ts
View File

@ -4,11 +4,9 @@ import { Pipe, PipeTransform } from '@angular/core'
name: 'clipValue'
})
export class ClipValuePipe implements PipeTransform {
transform (value: number, min: number, max: number): number {
if (value < min) { return min }
if (value > max) { return max }
return value
}
}

2
ui/src/app/modules/pipes/fix-float.pipe.ts
View File

@ -4,7 +4,6 @@ import { Pipe, PipeTransform } from '@angular/core'
name: 'fixFloat'
})
export class FixFloatPipe implements PipeTransform {
transform (value: number, fixTo: number, showZeros = true) {
let fixedValue: any = value.toFixed(fixTo)
if (!showZeros) {
@ -12,5 +11,4 @@ export class FixFloatPipe implements PipeTransform {
}
return fixedValue
}
}

2
ui/src/app/modules/pipes/map-value.pipe.ts
View File

@ -4,9 +4,7 @@ import { Pipe, PipeTransform } from '@angular/core'
name: 'mapValue'
})
export class MapValuePipe implements PipeTransform {
constructor () {}
transform (value: number, inMin: number, inMax: number, outMin: number, outMax: number): number {
return (value - inMin) * (outMax - outMin) / (inMax - inMin) + outMin
}
}

2
ui/src/app/sections/effects/effect.service.ts
View File

@ -17,6 +17,6 @@ export class EffectService extends DataService {
}
onEnabledChanged (callback: (enabled: boolean) => void) {
this.on(`/enabled`, ({ enabled }) => callback(enabled))
this.on('/enabled', ({ enabled }) => callback(enabled))
}
}

23
ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.ts
View File

@ -15,7 +15,7 @@ import { ApplicationService } from '../../../../services/app.service'
@Component({
selector: 'eqm-advanced-equalizer',
templateUrl: './advanced-equalizer.component.html',
styleUrls: ['./advanced-equalizer.component.scss']
styleUrls: [ './advanced-equalizer.component.scss' ]
})
export class AdvancedEqualizerComponent extends EqualizerComponent implements OnInit {
@Input() enabled = true
@ -26,7 +26,8 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
value: false,
toggled: (show) => this.service.setShowDefaultPresets(show)
}
settings: Options = [[
settings: Options = [ [
{
type: 'button',
label: 'Import Presets',
@ -38,7 +39,8 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
}
], [
this.ShowDefaultPresetsCheckbox
]]
] ]
public _presets: AdvancedEqualizerPreset[]
@Output() presetsChange = new EventEmitter<AdvancedEqualizerPreset[]>()
set presets (newPresets: AdvancedEqualizerPreset[]) {
@ -46,10 +48,11 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
[
newPresets.find(p => p.id === 'manual'),
newPresets.find(p => p.id === 'flat'),
...newPresets.filter(p => !['manual', 'flat'].includes(p.id)).sort((a, b) => a.name > b.name ? 1 : -1)
...newPresets.filter(p => ![ 'manual', 'flat' ].includes(p.id)).sort((a, b) => a.name > b.name ? 1 : -1)
]
this.presetsChange.emit(this.presets)
}
get presets () { return this._presets }
public _selectedPreset: AdvancedEqualizerPreset
@ -58,10 +61,11 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
this._selectedPreset = newSelectedPreset
this.selectedPresetChange.emit(this.selectedPreset)
}
get selectedPreset () { return this._selectedPreset }
bandFrequencyLabels = ['32', '64', '125', '250', '500', '1K', '2K', '4K', '8K', '16K']
bands = [...Array(10)].map(() => 0)
get selectedPreset () { return this._selectedPreset }
bandFrequencyLabels = [ '32', '64', '125', '250', '500', '1K', '2K', '4K', '8K', '16K' ]
bands = [ ...Array(10) ].map(() => 0)
global = 0
stickSlidersToMiddle = true
@ -80,7 +84,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
this.change.detectChanges()
})
}
for (const [i, gain] of this.selectedPreset.gains.bands.entries()) {
for (const [ i, gain ] of this.selectedPreset.gains.bands.entries()) {
const currentGain = this.bands[i]
if (currentGain !== gain) {
this.stickSlidersToMiddle = false
@ -101,7 +105,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
public transition: TransitionService,
public change: ChangeDetectorRef,
public app: ApplicationService
) {
) {
super()
this.getImportLegacyAvailable()
}
@ -134,6 +138,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On
)
}
}
public async syncPresets () {
const [ presets, selectedPreset ] = await Promise.all([
this.service.getPresets(),

18
ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.service.ts
View File

@ -24,27 +24,27 @@ export class AdvancedEqualizerService extends EqualizersService {
}
createPreset (preset: AdvancedEqualizerPreset, select: boolean = false) {
return this.request({ method: 'POST', endpoint: `/presets`, data: { ...preset, select } })
return this.request({ method: 'POST', endpoint: '/presets', data: { ...preset, select } })
}
updatePreset (preset: AdvancedEqualizerPreset, opts?: { select?: boolean, transition?: boolean }) {
return this.request({
method: 'POST',
endpoint: `/presets`,
endpoint: '/presets',
data: {
...preset,
select: opts && opts.select,
transition: opts && opts.transition
// ...preset,
select: opts?.select,
transition: opts?.transition
}
})
}
selectPreset (preset: AdvancedEqualizerPreset) {
return this.request({ method: 'POST', endpoint: `/presets/select`, data: { ...preset } })
return this.request({ method: 'POST', endpoint: '/presets/select', data: { ...preset } })
}
deletePreset (preset: AdvancedEqualizerPreset) {
return this.request({ method: 'DELETE', endpoint: `/presets`, data: { ...preset } })
return this.request({ method: 'DELETE', endpoint: '/presets', data: { ...preset } })
}
async getImportLegacyAvailable () {
@ -81,10 +81,10 @@ export class AdvancedEqualizerService extends EqualizersService {
}
onPresetsChanged (callback: (presets: AdvancedEqualizerPreset[]) => void) {
this.on(`/presets`, (presets) => callback(presets))
this.on('/presets', (presets) => callback(presets))
}
onSelectedPresetChanged (callback: (preset: AdvancedEqualizerPreset) => void) {
this.on(`/presets/selected`, (preset) => callback(preset))
this.on('/presets/selected', (preset) => callback(preset))
}
}

14
ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.ts
View File

@ -1,16 +1,15 @@
import { Component, OnInit, Input, Output, EventEmitter, ChangeDetectorRef } from '@angular/core'
import { BasicEqualizerService, BasicEqualizerPreset, BasicEqualizerBand, BasicEqualizerPresetGains } from './basic-equalizer.service'
import { BridgeService } from '../../../../services/bridge.service'
import { EqualizerComponent } from '../equalizer.component'
import { KnobValueChangedEvent } from '../../../../modules/eqmac-components/components/knob/knob.component'
import { TransitionService } from '../../../../services/transitions.service'
import { ApplicationService } from '../../../../services/app.service'
import { UISettings, UIService } from '../../../../services/ui.service'
import { UIService } from '../../../../services/ui.service'
@Component({
selector: 'eqm-basic-equalizer',
templateUrl: './basic-equalizer.component.html',
styleUrls: ['./basic-equalizer.component.scss']
styleUrls: [ './basic-equalizer.component.scss' ]
})
export class BasicEqualizerComponent extends EqualizerComponent implements OnInit {
@Input() enabled = true
@ -20,6 +19,7 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni
mid: 0,
treble: 0
}
peakLimiter = false
replaceKnobsWithSliders = false
@ -31,10 +31,11 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni
[
newPresets.find(p => p.id === 'manual'),
newPresets.find(p => p.id === 'flat'),
...newPresets.filter(p => !['manual', 'flat'].includes(p.id)).sort((a, b) => a.name > b.name ? 1 : -1)
...newPresets.filter(p => ![ 'manual', 'flat' ].includes(p.id)).sort((a, b) => a.name > b.name ? 1 : -1)
]
this.presetsChange.emit(this.presets)
}
get presets () { return this._presets }
public _selectedPreset: BasicEqualizerPreset
@ -43,6 +44,7 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni
this._selectedPreset = newSelectedPreset
this.selectedPresetChange.emit(this.selectedPreset)
}
get selectedPreset () { return this._selectedPreset }
settings = []
@ -108,8 +110,8 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni
// TODO: Refactor this bollocks
this.peakLimiter = this.selectedPreset.peakLimiter || false
for (const [type, gain] of Object.entries(this.selectedPreset.gains)) {
const currentGain: number = this.gains[type]
for (const [ type, gain ] of Object.entries(this.selectedPreset.gains)) {
const currentGain = this.gains[type] as number
if (currentGain !== gain) {
this.stickSlidersToMiddle = false
this.change.detectChanges()

21
ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.service.ts
View File

@ -1,9 +1,8 @@
import { Injectable } from '@angular/core'
import { EqualizersService } from '../equalizers.service'
import { EqualizerPreset } from '../presets/equalizer-presets.component'
import { JSONEncodable, JSONData } from '../../../../services/data.service'
export type BasicEqualizerPresetGains = {
export interface BasicEqualizerPresetGains {
bass: number
mid: number
treble: number
@ -31,34 +30,34 @@ export class BasicEqualizerService extends EqualizersService {
}
createPreset (preset: BasicEqualizerPreset, select: boolean = false) {
return this.request({ method: 'POST', endpoint: `/presets`, data: { ...preset, select } })
return this.request({ method: 'POST', endpoint: '/presets', data: { ...preset, select } as any })
}
updatePreset (preset: BasicEqualizerPreset, opts?: { select?: boolean, transition?: boolean }) {
return this.request({
method: 'POST',
endpoint: `/presets`,
endpoint: '/presets',
data: {
...preset,
select: opts && opts.select,
transition: opts && opts.transition
}
select: opts?.select,
transition: opts?.transition
} as any
})
}
selectPreset (preset: BasicEqualizerPreset) {
return this.request({ method: 'POST', endpoint: `/presets/select`, data: { ...preset } })
return this.request({ method: 'POST', endpoint: '/presets/select', data: { ...preset } as any })
}
deletePreset (preset: BasicEqualizerPreset) {
return this.request({ method: 'DELETE', endpoint: `/presets`, data: { ...preset } })
return this.request({ method: 'DELETE', endpoint: '/presets', data: { ...preset } as any })
}
onPresetsChanged (callback: (presets: BasicEqualizerPreset[]) => void) {
this.on(`/presets`, (presets) => callback(presets))
this.on('/presets', (presets) => callback(presets))
}
onSelectedPresetChanged (callback: (preset: BasicEqualizerPreset) => void) {
this.on(`/presets/selected`, (preset) => callback(preset))
this.on('/presets/selected', (preset) => callback(preset))
}
}

5
ui/src/app/sections/effects/equalizers/equalizer.component.ts
View File

@ -1,9 +1,10 @@
import { Option, Options } from 'src/app/components/options/options.component'
import { Options } from 'src/app/components/options/options.component'
import { AdditionalPresetOption, EqualizerPreset } from './presets/equalizer-presets.component'
import { Input } from '@angular/core'
import { Component, Input } from '@angular/core'
import { MatDialogRef } from '@angular/material/dialog'
import { OptionsDialogComponent } from '../../../components/options-dialog/options-dialog.component'
@Component({ template: '' })
export abstract class EqualizerComponent {
@Input() animationDuration = 500
@Input() animationFps = 30

8
ui/src/app/sections/effects/equalizers/equalizers.component.ts
View File

@ -12,7 +12,7 @@ import { UIService } from '../../../services/ui.service'
@Component({
selector: 'eqm-equalizers',
templateUrl: './equalizers.component.html',
styleUrls: ['./equalizers.component.scss'],
styleUrls: [ './equalizers.component.scss' ],
animations: [ FadeInOutAnimation ]
})
export class EqualizersComponent implements OnInit {
@ -38,6 +38,7 @@ export class EqualizersComponent implements OnInit {
this.changeRef.detectChanges()
this.activeEqualizer = this.getEqualizerFromType(this.type)
}
get type () { return this._type }
gain: number = 0
@ -48,8 +49,8 @@ export class EqualizersComponent implements OnInit {
public equalizersService: EqualizersService,
public dialog: MatDialog,
public ui: UIService,
private changeRef: ChangeDetectorRef
) { }
private readonly changeRef: ChangeDetectorRef
) { }
async ngOnInit () {
await this.sync()
@ -132,5 +133,4 @@ export class EqualizersComponent implements OnInit {
selectPreset (preset: EqualizerPreset) {
return this.activeEqualizer.selectPreset(preset)
}
}

9
ui/src/app/sections/effects/equalizers/presets/equalizer-presets.component.ts
View File

@ -20,7 +20,7 @@ export interface AdditionalPresetOption {
@Component({
selector: 'eqm-equalizer-presets',
templateUrl: './equalizer-presets.component.html',
styleUrls: ['./equalizer-presets.component.scss']
styleUrls: [ './equalizer-presets.component.scss' ]
})
export class EqualizerPresetsComponent implements OnInit {
@Input() presets: EqualizerPreset[]
@ -62,7 +62,7 @@ export class EqualizerPresetsComponent implements OnInit {
data: {
confirmText: 'Yes, save',
cancelText: 'No, cancel',
text: `A Default preset with this name already exists. Would you like to use this name anyway? You might see Duplicate names in the Preset list.`
text: 'A Default preset with this name already exists. Would you like to use this name anyway? You might see Duplicate names in the Preset list.'
}
}).afterClosed().toPromise()
if (!saveAnyway) return this.savePreset(presetName)
@ -73,7 +73,7 @@ export class EqualizerPresetsComponent implements OnInit {
data: {
confirmText: 'Yes, overwrite',
cancelText: 'No, cancel',
text: `A preset with this name already exists. Would you like to overwrite it?`
text: 'A preset with this name already exists. Would you like to overwrite it?'
}
}).afterClosed().toPromise()
if (!overwrite) return this.savePreset(presetName)
@ -90,7 +90,7 @@ export class EqualizerPresetsComponent implements OnInit {
data: {
confirmText: 'Yes, remove',
cancelText: 'No, cancel',
text: `Are you sure you want to remove this Preset?`
text: 'Are you sure you want to remove this Preset?'
}
}).afterClosed().toPromise()
@ -98,5 +98,4 @@ export class EqualizerPresetsComponent implements OnInit {
this.presetDeleted.emit()
}
}
}

4
ui/src/app/sections/effects/reverb/reverb.component.ts
View File

@ -11,7 +11,7 @@ import {
@Component({
selector: 'eqm-reverb',
templateUrl: './reverb.component.html',
styleUrls: ['./reverb.component.scss']
styleUrls: [ './reverb.component.scss' ]
})
export class ReverbComponent implements OnInit {
presets = []
@ -51,7 +51,6 @@ export class ReverbComponent implements OnInit {
this.getSelectedPreset()
this.getMix()
this.getEnabled()
}
async getPresets () {
@ -87,5 +86,4 @@ export class ReverbComponent implements OnInit {
this.hide = !this.hide
this.visibilityToggled.emit()
}
}

9
ui/src/app/sections/header/header.component.ts
View File

@ -9,7 +9,7 @@ import { SettingsService, IconMode } from '../settings/settings.service'
@Component({
selector: 'eqm-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss'],
styleUrls: [ './header.component.scss' ],
animations: [ FadeInOutAnimation ]
})
export class HeaderComponent implements OnInit {
@ -25,7 +25,7 @@ export class HeaderComponent implements OnInit {
public ui: UIService,
public dialog: MatDialog,
public settings: SettingsService
) { }
) { }
async ngOnInit () {
await this.sync()
@ -41,8 +41,8 @@ export class HeaderComponent implements OnInit {
this.uiMode = await this.ui.getMode()
}
setShowBoolean (name, bool) {
if (this.showBooleanDebouncers.hasOwnProperty(name)) {
setShowBoolean (name: string, bool: boolean) {
if (name in this.showBooleanDebouncers) {
clearTimeout(this.showBooleanDebouncers[name])
delete this.showBooleanDebouncers[name]
this[name] = bool
@ -104,5 +104,4 @@ export class HeaderComponent implements OnInit {
// this.mode = this.mode === 'window' ? 'popover' : 'window'
// return this.ui.setMode(this.mode)
// }
}

4
ui/src/app/sections/help/help.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core'
import { Option, Options } from 'src/app/components/options/options.component'
import { Options } from 'src/app/components/options/options.component'
import { ApplicationService, MacInfo } from 'src/app/services/app.service'
import { ConstantsService } from 'src/app/services/constants.service'
import { version } from '../../../../package.json'
@ -8,7 +8,7 @@ import { UIService } from '../../services/ui.service.js'
@Component({
selector: 'eqm-help',
templateUrl: './help.component.html',
styleUrls: ['./help.component.scss']
styleUrls: [ './help.component.scss' ]
})
export class HelpComponent implements OnInit {
options: Options = [

2
ui/src/app/sections/outputs/outputs.component.ts
View File

@ -4,7 +4,7 @@ import { OutputsService, Output } from './outputs.service'
@Component({
selector: 'eqm-outputs',
templateUrl: './outputs.component.html',
styleUrls: ['./outputs.component.scss']
styleUrls: [ './outputs.component.scss' ]
})
export class OutputsComponent implements OnInit {
outputs: Output[]

2
ui/src/app/sections/outputs/outputs.service.ts
View File

@ -18,7 +18,7 @@ export type DeviceTransportType =
export interface Output {
id: number
name: string
transportType: DeviceTransportType,
transportType: DeviceTransportType
icon?: IconName
}
@Injectable({

3
ui/src/app/sections/recorder/recorder.component.ts
View File

@ -4,7 +4,7 @@ import { UtilitiesService } from '../../services/utilities.service'
@Component({
selector: 'eqm-recorder',
templateUrl: './recorder.component.html',
styleUrls: ['./recorder.component.scss']
styleUrls: [ './recorder.component.scss' ]
})
export class RecorderComponent implements OnInit {
recording = false
@ -29,5 +29,4 @@ export class RecorderComponent implements OnInit {
}, 1000)
}
}
}

9
ui/src/app/sections/settings/settings.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core'
import { Option, CheckboxOption, ButtonOption, Options, SelectOption } from 'src/app/components/options/options.component'
import { CheckboxOption, ButtonOption, Options, SelectOption } from 'src/app/components/options/options.component'
import { SettingsService, IconMode } from './settings.service'
import { ApplicationService } from '../../services/app.service'
import { MatDialog } from '@angular/material/dialog'
@ -9,7 +9,7 @@ import { UIService } from '../../services/ui.service'
@Component({
selector: 'eqm-settings',
templateUrl: './settings.component.html',
styleUrls: ['./settings.component.scss']
styleUrls: [ './settings.component.scss' ]
})
export class SettingsComponent implements OnInit {
launchOnStartupOption: CheckboxOption = {
@ -29,7 +29,7 @@ export class SettingsComponent implements OnInit {
iconModeOption: SelectOption = {
type: 'select',
label: 'Show Icon',
options: [{
options: [ {
id: IconMode.dock,
label: 'Dock'
}, {
@ -38,7 +38,7 @@ export class SettingsComponent implements OnInit {
}, {
id: IconMode.statusBar,
label: 'Status Bar'
}],
} ],
selectedId: IconMode.both,
selected: async iconMode => {
const uiMode = await this.ui.getMode()
@ -48,6 +48,7 @@ export class SettingsComponent implements OnInit {
await this.settingsService.setIconMode(iconMode as IconMode)
}
}
uninstallOption: ButtonOption = {
type: 'button',
label: 'Uninstall eqMac',

2
ui/src/app/sections/settings/settings.service.ts
View File

@ -31,7 +31,7 @@ export class SettingsService extends DataService {
return this.request({ method: 'POST', endpoint: '/icon-mode', data: { mode } })
}
// async getMode () {
// async getMode () {
// const { mode } = await this.request({ method: 'GET', endpoint: '/mode' })
// return mode as UIMode
// }

13
ui/src/app/sections/source/file/file.component.ts
View File

@ -19,7 +19,7 @@ interface FileMeta {
@Component({
selector: 'eqm-file',
templateUrl: './file.component.html',
styleUrls: ['./file.component.scss']
styleUrls: [ './file.component.scss' ]
})
export class FileComponent implements OnInit, OnDestroy {
@ -27,6 +27,7 @@ export class FileComponent implements OnInit, OnDestroy {
name: null,
duration: 0
}
public syncedOnce = false
public progressProjectionInterval = null
public progressSetDebouncer = null
@ -95,14 +96,13 @@ export class FileComponent implements OnInit, OnDestroy {
]
if (this.selected || !this.syncedOnce) {
thingsToSync.push(
this.getFile(),
this.getProgress(),
this.getPlaybackState()
)
this.getFile(),
this.getProgress(),
this.getPlaybackState()
)
}
await Promise.all(thingsToSync)
this.syncedOnce = true
}
async getSelected () {
@ -112,6 +112,7 @@ export class FileComponent implements OnInit, OnDestroy {
this.selected = false
}
}
async getFile () {
try {
this.meta = await this.fileService.getMeta()

4
ui/src/app/sections/source/file/file.service.ts
View File

@ -46,10 +46,10 @@ export class FileService extends SourceService {
}
onPlayingChanged (callback: (playing: boolean) => void) {
this.on(`/playing`, ({ playing }) => callback(playing))
this.on('/playing', ({ playing }) => callback(playing))
}
onProgressChanged (callback: (progress: number) => void) {
this.on(`/progress`, ({ progress }) => callback(progress))
this.on('/progress', ({ progress }) => callback(progress))
}
}

5
ui/src/app/sections/source/input/input.component.ts
View File

@ -10,10 +10,9 @@ export interface InputDevice {
@Component({
selector: 'eqm-input',
templateUrl: './input.component.html',
styleUrls: ['./input.component.scss']
styleUrls: [ './input.component.scss' ]
})
export class InputComponent implements OnInit {
constructor (public inputService: InputService) { }
devices: InputDevice[] = []
@ -36,7 +35,7 @@ export class InputComponent implements OnInit {
}
async syncSelectedDevice () {
const selectedDevice = await this.inputService.getDevice()
await this.inputService.getDevice()
}
protected setupEvents () {

4
ui/src/app/sections/source/source.component.ts
View File

@ -4,10 +4,9 @@ import { SourceService, SourceType } from './source.service'
@Component({
selector: 'eqm-source',
templateUrl: './source.component.html',
styleUrls: ['./source.component.scss']
styleUrls: [ './source.component.scss' ]
})
export class SourceComponent implements OnInit {
source: SourceType = 'File'
constructor (public sourceService: SourceService) { }
@ -27,5 +26,4 @@ export class SourceComponent implements OnInit {
this.sourceService.setSource(this.source)
}
}
}

6
ui/src/app/sections/source/system/system.component.ts
View File

@ -3,13 +3,9 @@ import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-system',
templateUrl: './system.component.html',
styleUrls: ['./system.component.scss']
styleUrls: [ './system.component.scss' ]
})
export class SystemComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

4
ui/src/app/sections/volume/booster-balance/balance/balance.component.ts
View File

@ -3,12 +3,12 @@ import { BalanceService } from './balance.service'
import { ApplicationService } from '../../../../services/app.service'
import { KnobValueChangedEvent } from '../../../../modules/eqmac-components/components/knob/knob.component'
import { FlatSliderValueChangedEvent } from '../../../../modules/eqmac-components/components/flat-slider/flat-slider.component'
import { UIService, UISettings } from '../../../../services/ui.service'
import { UIService } from '../../../../services/ui.service'
@Component({
selector: 'eqm-balance',
templateUrl: './balance.component.html',
styleUrls: ['./balance.component.scss']
styleUrls: [ './balance.component.scss' ]
})
export class BalanceComponent implements OnInit {
balance = 0

1
ui/src/app/sections/volume/booster-balance/balance/balance.service.ts
View File

@ -5,7 +5,6 @@ import { VolumeService } from '../../../../services/volume.service'
providedIn: 'root'
})
export class BalanceService extends VolumeService {
async getBalance () {
const resp = await this.request({ method: 'GET', endpoint: '/balance' })
return resp.balance

4
ui/src/app/sections/volume/booster-balance/booster/booster.component.ts
View File

@ -7,12 +7,12 @@ import {
import { BoosterService } from './booster.service'
import { ApplicationService } from '../../../../services/app.service'
import { UIService, UISettings } from '../../../../services/ui.service'
import { UIService } from '../../../../services/ui.service'
@Component({
selector: 'eqm-booster',
templateUrl: './booster.component.html',
styleUrls: ['./booster.component.scss']
styleUrls: [ './booster.component.scss' ]
})
export class BoosterComponent implements OnInit {
gain = 1

3
ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.ts
View File

@ -4,7 +4,7 @@ import { UIService } from '../../../services/ui.service'
@Component({
selector: 'eqm-volume-booster-balance',
templateUrl: './volume-booster-balance.component.html',
styleUrls: ['./volume-booster-balance.component.scss']
styleUrls: [ './volume-booster-balance.component.scss' ]
})
export class VolumeBoosterBalanceComponent implements OnInit {
hide = false
@ -34,5 +34,4 @@ export class VolumeBoosterBalanceComponent implements OnInit {
this.hide = !this.hide
this.visibilityToggled.emit()
}
}

3
ui/src/app/sections/volume/volume-mixer/volume-mixer.component.html
View File

@ -1,3 +0,0 @@
<p>
volume-mixer works!
</p>

0
ui/src/app/sections/volume/volume-mixer/volume-mixer.component.scss
View File

15
ui/src/app/sections/volume/volume-mixer/volume-mixer.component.ts
View File

@ -1,15 +0,0 @@
import { Component, OnInit } from '@angular/core'
@Component({
selector: 'eqm-volume-mixer',
templateUrl: './volume-mixer.component.html',
styleUrls: ['./volume-mixer.component.scss']
})
export class VolumeMixerComponent implements OnInit {
constructor () { }
ngOnInit () {
}
}

3
ui/src/app/services/bridge.service.ts
View File

@ -47,7 +47,7 @@ export class BridgeService {
if (window[bridgeCallbacksKey]) {
return window[bridgeCallbacksKey].push(resolve)
}
window[bridgeCallbacksKey] = [resolve]
window[bridgeCallbacksKey] = [ resolve ]
const WVJBIframe = document.createElement('iframe')
WVJBIframe.style.display = 'none'
@ -78,6 +78,7 @@ export class BridgeService {
bridge.registerHandler(event, async (data, cb) => {
const handleError = (err: string | Error) => {
console.error(err)
// eslint-disable-next-line @typescript-eslint/no-base-to-string
cb({ error: err.toString() })
}
try {

2
ui/src/app/services/constants.service.ts
View File

@ -7,6 +7,6 @@ export class ConstantsService {
readonly DOMAIN = 'eqmac.app'
readonly FAQ_URL = new URL(`https://${this.DOMAIN}/faq`)
readonly BUG_REPORT_URL = new URL(`https://${this.DOMAIN}/report-bug`)
readonly LOCAL_API_URL = `https://127.0.0.1`
readonly LOCAL_API_URL = 'https://127.0.0.1'
readonly REMOTE_API_URL = `https://api.${this.DOMAIN}`
}

1
ui/src/app/services/cookies.service.ts
View File

@ -10,6 +10,7 @@ export class CookiesService {
constructor (
public CONST: ConstantsService
) {}
set (key: string, value: any) {
if (typeof value !== 'string') {
value = JSON.stringify(value)

3
ui/src/app/services/data.service.ts
View File

@ -1,6 +1,5 @@
import { Injectable } from '@angular/core'
import { BridgeService } from './bridge.service'
import { Logger } from './logger.service'
import { CookiesService } from './cookies.service'
export type JSONEncodable = null | boolean | number | string | JSONData
@ -27,7 +26,7 @@ export class DataService {
async request (opts: RequestOptions): Promise<any> {
if (opts.endpoint && opts.endpoint[0] !== '/') opts.endpoint = `/${opts.endpoint}`
const args: [string, any?] = [`${opts.method} ${this.route}${opts.endpoint || ''}`, opts.data]
const args: [string, any?] = [ `${opts.method} ${this.route}${opts.endpoint || ''}`, opts.data ]
const resp = await this.bridge.call(...args)
return resp
}

2
ui/src/app/services/logger.service.ts
View File

@ -5,7 +5,7 @@ export class Logger {
this.console('log', ...something)
}
public static console (func: 'log' , ...something: any[]) {
public static console (func: 'log', ...something: any[]) {
if (!environment.production) {
console[func](...something)
}

4
ui/src/app/services/transitions.service.ts
View File

@ -36,9 +36,9 @@ export class TransitionService extends DataService {
perform (from: number, to: number, cb: (value: number) => any) {
const distance = to - from
const step = distance / this.FRAME_COUNT
const frames = [...Array(this.FRAME_COUNT)].map((_, i) => i + 1)
const frames = [ ...Array(this.FRAME_COUNT) ].map((_, i) => i + 1)
for (const frame of frames) {
let delay = Math.round(this.FRAME_DURATION * frame)
const delay = Math.round(this.FRAME_DURATION * frame)
setTimeout(() => {
cb(from + step * frame)
}, delay)

15
ui/src/app/services/ui.service.ts
View File

@ -1,8 +1,8 @@
import { Injectable, EventEmitter } from '@angular/core'
import { Injectable } from '@angular/core'
import { DataService } from './data.service'
import { Observable, Subject } from 'rxjs'
import { Subject } from 'rxjs'
export type UISettings = {
export interface UISettings {
replaceKnobsWithSliders?: boolean
}
@ -24,12 +24,12 @@ export class UIService extends DataService {
settingsChanged = new Subject<UISettings>()
readonly colors = {
'accent': '#4f8d71',
'warning': '#e80415',
accent: '#4f8d71',
warning: '#e80415',
'gradient-start': '#5a5b5f',
'gradient-end': '#2c2c2e',
'light': '#c9cdd0',
'dark': '#16191c'
light: '#c9cdd0',
dark: '#16191c'
}
get isLocal () {
@ -84,5 +84,4 @@ export class UIService extends DataService {
settings = await this.request({ method: 'POST', endpoint: '/settings', data: settings })
this.settingsChanged.next(settings)
}
}

4
ui/src/main.ts
View File

@ -10,11 +10,11 @@ if (environment.production) {
}
platformBrowserDynamic()
.bootstrapModule(AppModule)
.bootstrapModule(AppModule)
.then(() => {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.getRegistration('ngsw-worker.js')
.then(registration => registration && registration.unregister())
.then(async registration => await registration?.unregister())
}
})
.catch(err => console.error(err))

13
ui/src/polyfills.ts
View File

@ -52,18 +52,18 @@
* Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
* Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
**/
import 'web-animations-js' // Run `npm install --save web-animations-js`.
import 'web-animations-js' // Run `npm install --save web-animations-js`.
/**
* By default, zone.js will patch all possible macroTask and DomEvents
* user can disable parts of macroTask/DomEvents patch by setting following flags
*/
// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
/*
/*
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge
*/
@ -72,8 +72,7 @@ import 'web-animations-js' // Run `npm install --save web-animations-js`.
/***************************************************************************************************
* Zone JS is required by default for Angular itself.
*/
import 'zone.js/dist/zone'; // Included with Angular CLI.
import 'zone.js/dist/zone' // Included with Angular CLI.
/***************************************************************************************************
* APPLICATION IMPORTS

3
ui/src/tsconfig.app.json
View File

@ -6,7 +6,8 @@
"resolveJsonModule": true
},
"angularCompilerOptions": {
"enableIvy": false
"enableIvy": true,
"strictTemplates": true
},
"exclude": []
}

17
ui/tsconfig.eslint.json Normal file
View File

@ -0,0 +1,17 @@
{
// extend your base config to share compilerOptions, etc
"extends": "./tsconfig.json",
"compilerOptions": {
// ensure that nobody can accidentally use this config for a build
"noEmit": true
},
"include": [
// whatever paths you intend to lint
"src",
"scripts"
],
"exclude": [
"node_modules",
"dist"
]
}

2
ui/tsconfig.json
View File

@ -18,6 +18,6 @@
"lib": [
"es2018",
"dom"
]
],
}
}

6
ui/tslint.json
View File

@ -1,6 +0,0 @@
{
"extends": "tslint-config-standard",
"rules": {
"no-empty": false
}
}