From 6fad587780dbb7555c0ce842eb442599a3cf78d6 Mon Sep 17 00:00:00 2001 From: Nodeful Date: Sun, 18 Oct 2020 19:25:41 +0300 Subject: [PATCH] made the UI work on macOS 10.12 --- native/app/Source/Constants.swift | 2 +- native/app/eqMac.xcodeproj/project.pbxproj | 8 +- native/pkg/introduction.txt | 6 + native/pkg/postinstall.sh | 119 ++++++++++-------- ui/.browserslistrc | 2 + ui/.vscode/launch.json | 4 +- ui/package-lock.json | 12 +- ui/package.json | 4 +- ui/src/app/app.component.ts | 12 +- .../components/options/options.component.html | 4 +- .../components/options/options.component.ts | 11 +- .../components/analyzer/analyzer.component.ts | 4 +- .../components/button/button.component.html | 2 +- .../components/button/button.component.ts | 7 ++ .../carousel/carousel.component.html | 2 +- .../components/carousel/carousel.component.ts | 20 ++- .../components/divider/divider.component.html | 1 - .../components/divider/divider.component.scss | 17 +-- .../components/divider/divider.component.ts | 46 ++++--- .../dropdown/dropdown.component.scss | 19 +-- .../components/dropdown/dropdown.component.ts | 6 +- .../flat-slider/flat-slider.component.html | 11 +- .../flat-slider/flat-slider.component.scss | 20 ++- .../flat-slider/flat-slider.component.ts | 64 +++++----- .../components/icon/icon.component.ts | 4 +- .../components/knob/knob.component.html | 2 +- .../components/knob/knob.component.ts | 24 ++-- .../select-box/select-box.component.ts | 10 +- .../skeuomorph-slider.component.scss | 15 ++- .../skeuomorph-slider.component.ts | 12 +- .../components/tooltip/tooltip.component.html | 28 +++-- .../components/tooltip/tooltip.component.scss | 55 ++++---- .../components/tooltip/tooltip.component.ts | 33 ++--- .../components/tooltip/tooltip.directive.ts | 6 +- .../advanced-equalizer.component.html | 4 +- .../advanced-equalizer.component.ts | 22 ++-- .../basic-equalizer.component.html | 4 +- .../basic-equalizer.component.ts | 14 +-- .../equalizers/equalizers.component.html | 4 +- .../equalizers/equalizers.component.ts | 10 +- .../presets/equalizer-presets.component.ts | 2 +- .../effects/reverb/reverb.component.ts | 2 +- .../app/sections/header/header.component.ts | 8 +- ui/src/app/sections/help/help.component.ts | 2 +- .../app/sections/outputs/outputs.component.ts | 2 +- .../sections/settings/settings.component.ts | 2 +- .../sections/source/file/file.component.ts | 12 +- .../sections/source/input/input.component.ts | 2 +- .../app/sections/source/source.component.ts | 2 +- .../balance/balance.component.ts | 4 +- .../booster/booster.component.ts | 10 +- .../volume-booster-balance.component.html | 2 +- .../volume-booster-balance.component.ts | 2 +- ui/src/app/services/analytics.service.ts | 6 +- ui/src/app/services/bridge.service.ts | 6 +- ui/src/app/services/cookies.service.ts | 2 +- ui/src/app/services/logger.service.ts | 2 +- ui/src/index.html | 1 + ui/src/polyfills.ts | 2 +- 59 files changed, 396 insertions(+), 325 deletions(-) create mode 100644 native/pkg/introduction.txt diff --git a/native/app/Source/Constants.swift b/native/app/Source/Constants.swift index 8b0da69..74c1e57 100644 --- a/native/app/Source/Constants.swift +++ b/native/app/Source/Constants.swift @@ -13,7 +13,7 @@ import AMCoreAudio struct Constants { #if DEBUG - static let UI_ENDPOINT_URL = URL(string: "http://localhost:4200")! + static let UI_ENDPOINT_URL = URL(string: "http://localhost:8080")! // static let UI_ENDPOINT_URL = URL(string: "https://ui-v1.eqmac.app")! static let DEBUG = true #else diff --git a/native/app/eqMac.xcodeproj/project.pbxproj b/native/app/eqMac.xcodeproj/project.pbxproj index 819db41..7b6f6e1 100644 --- a/native/app/eqMac.xcodeproj/project.pbxproj +++ b/native/app/eqMac.xcodeproj/project.pbxproj @@ -1048,7 +1048,7 @@ CODE_SIGN_IDENTITY = "Developer ID Application"; CODE_SIGN_STYLE = Manual; COMBINE_HIDPI_IMAGES = YES; - CURRENT_PROJECT_VERSION = 0.3.4; + CURRENT_PROJECT_VERSION = 0.3.5; DEFINES_MODULE = YES; DEVELOPMENT_TEAM = JZA6C97KJA; ENABLE_HARDENED_RUNTIME = YES; @@ -1085,7 +1085,7 @@ "$(PROJECT_DIR)/Source/Vendor", ); MACOSX_DEPLOYMENT_TARGET = 10.12; - MARKETING_VERSION = v0.3.4; + MARKETING_VERSION = v0.3.5; PRODUCT_BUNDLE_IDENTIFIER = com.bitgapp.eqmac; PRODUCT_NAME = "$(TARGET_NAME)"; PROVISIONING_PROFILE_SPECIFIER = ""; @@ -1109,7 +1109,7 @@ CODE_SIGN_IDENTITY = "Developer ID Application"; CODE_SIGN_STYLE = Manual; COMBINE_HIDPI_IMAGES = YES; - CURRENT_PROJECT_VERSION = 0.3.4; + CURRENT_PROJECT_VERSION = 0.3.5; DEFINES_MODULE = YES; DEVELOPMENT_TEAM = JZA6C97KJA; ENABLE_HARDENED_RUNTIME = YES; @@ -1146,7 +1146,7 @@ "$(PROJECT_DIR)/Source/Vendor", ); MACOSX_DEPLOYMENT_TARGET = 10.12; - MARKETING_VERSION = v0.3.4; + MARKETING_VERSION = v0.3.5; PRODUCT_BUNDLE_IDENTIFIER = com.bitgapp.eqmac; PRODUCT_NAME = "$(TARGET_NAME)"; PROVISIONING_PROFILE_SPECIFIER = ""; diff --git a/native/pkg/introduction.txt b/native/pkg/introduction.txt new file mode 100644 index 0000000..96bbf10 --- /dev/null +++ b/native/pkg/introduction.txt @@ -0,0 +1,6 @@ +You will be guided through the steps necessary to install eqMac. + +⚠️ WARNING ⚠️ +If the Installer will need to install/update the Audio Driver (required for eqMac to work correctly), by the end of the installation: +⚠️YOU MIGHT BE LOGGED OUT OF YOUR CURRENT USER SESSION +so please save any work progress you might have! \ No newline at end of file diff --git a/native/pkg/postinstall.sh b/native/pkg/postinstall.sh index f5a6d31..541536c 100644 --- a/native/pkg/postinstall.sh +++ b/native/pkg/postinstall.sh @@ -13,61 +13,76 @@ if [ "$CURRENT_DRIVER_VERSION" != "$NEEDED_DRIVER_VERSION" ]; then # Copy driver into Plug-Ins folder cp -f -r "$DIR/eqMac.driver" /Library/Audio/Plug-Ins/HAL/ &>/dev/null - if osascript </dev/null || \ + launchctl kill SIGTERM system/com.apple.audio.coreaudiod &>/dev/null || \ + launchctl kill TERM system/com.apple.audio.coreaudiod &>/dev/null || \ + launchctl kill 15 system/com.apple.audio.coreaudiod &>/dev/null || \ + launchctl kill -15 system/com.apple.audio.coreaudiod &>/dev/null || \ + (launchctl unload "$coreaudiod_plist" &>/dev/null && \ + launchctl load "$coreaudiod_plist" &>/dev/null) || \ + killall coreaudiod &>/dev/null) + + # Logout + pkill loginwindow +# if osascript </dev/null || \ - launchctl kill SIGTERM system/com.apple.audio.coreaudiod &>/dev/null || \ - launchctl kill TERM system/com.apple.audio.coreaudiod &>/dev/null || \ - launchctl kill 15 system/com.apple.audio.coreaudiod &>/dev/null || \ - launchctl kill -15 system/com.apple.audio.coreaudiod &>/dev/null || \ - (launchctl unload "$coreaudiod_plist" &>/dev/null && \ - launchctl load "$coreaudiod_plist" &>/dev/null) || \ - killall coreaudiod &>/dev/null) && \ - sleep 5 +# # Restart CoreAudio +# coreaudiod_plist="/System/Library/LaunchDaemons/com.apple.audio.coreaudiod.plist" +# (launchctl kickstart -k system/com.apple.audio.coreaudiod &>/dev/null || \ +# launchctl kill SIGTERM system/com.apple.audio.coreaudiod &>/dev/null || \ +# launchctl kill TERM system/com.apple.audio.coreaudiod &>/dev/null || \ +# launchctl kill 15 system/com.apple.audio.coreaudiod &>/dev/null || \ +# launchctl kill -15 system/com.apple.audio.coreaudiod &>/dev/null || \ +# (launchctl unload "$coreaudiod_plist" &>/dev/null && \ +# launchctl load "$coreaudiod_plist" &>/dev/null) || \ +# killall coreaudiod &>/dev/null) - # Wait until coreaudiod has restarted and device is ready to use. - retries=5 - while [[ $retries -gt 0 ]]; do - if ! system_profiler SPAudioDataType | grep "eqMac:" >/dev/null 2>&1; then - retries=$((retries - 1)) - if [[ $retries -gt 0 ]]; then - echo "Device not ready yet, waiting..." - sleep 3 - else - echo "ERROR: Device did not become active" - exit 1 - fi - else - retries=0 - fi - done - echo "Device became active" +# # Wait until CoreAudio restarts +# sleep 5 - open /Applications/eqMac.app - fi +# # Wait until coreaudiod has restarted and device is ready to use. +# retries=5 +# while [[ $retries -gt 0 ]]; do +# if ! system_profiler SPAudioDataType | grep "eqMac:" >/dev/null 2>&1; then +# retries=$((retries - 1)) +# if [[ $retries -gt 0 ]]; then +# echo "Device not ready yet, waiting..." +# sleep 3 +# else +# echo "ERROR: Device did not become active" +# exit 1 +# fi +# else +# retries=0 +# fi +# done +# echo "Device became active" + +# fi fi +open /Applications/eqMac.app + diff --git a/ui/.browserslistrc b/ui/.browserslistrc index 1da540f..cf0a601 100644 --- a/ui/.browserslistrc +++ b/ui/.browserslistrc @@ -4,5 +4,7 @@ last 2 versions Firefox ESR safari 12.1 safari 12 +safari 10.1 +safari 10 not dead # IE 9-11 \ No newline at end of file diff --git a/ui/.vscode/launch.json b/ui/.vscode/launch.json index 73f51b7..f8bf019 100644 --- a/ui/.vscode/launch.json +++ b/ui/.vscode/launch.json @@ -8,7 +8,7 @@ "name": "Launch Client", "type": "chrome", "request": "launch", - "url": "http://localhost:4200/#", + "url": "http://localhost:8080/#", "port": 9223, "sourceMaps": true, "diagnosticLogging": true, @@ -24,7 +24,7 @@ "type": "chrome", "request": "attach", "port": 9000, - "url": "http://localhost:4200/#", + "url": "http://localhost:8080/#", "webRoot": "${workspaceRoot}/src" }, { "name": "Deploy (production)", diff --git a/ui/package-lock.json b/ui/package-lock.json index 835f30b..21d2147 100644 --- a/ui/package-lock.json +++ b/ui/package-lock.json @@ -1,6 +1,6 @@ { "name": "eqmac", - "version": "1.2.0", + "version": "1.2.1", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -2354,6 +2354,11 @@ "@xtuc/long": "4.2.2" } }, + "@webcomponents/custom-elements": { + "version": "1.4.2", + "resolved": "https://registry.npmjs.org/@webcomponents/custom-elements/-/custom-elements-1.4.2.tgz", + "integrity": "sha512-bLw2XH9+2NBwmn7BI6WA2oIo2eOfBpl+GjAqkF/qnkZ8kq3HY5tKYTxtKowWALAferTp3wKD8W6FSn5OyK+rtQ==" + }, "@xtuc/ieee754": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz", @@ -10637,6 +10642,11 @@ "minimalistic-assert": "^1.0.0" } }, + "web-animations-js": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/web-animations-js/-/web-animations-js-2.3.2.tgz", + "integrity": "sha512-TOMFWtQdxzjWp8qx4DAraTWTsdhxVSiWa6NkPFSaPtZ1diKUxTn4yTix73A1euG1WbSOMMPcY51cnjTIHrGtDA==" + }, "webpack": { "version": "4.39.2", "resolved": "https://registry.npmjs.org/webpack/-/webpack-4.39.2.tgz", diff --git a/ui/package.json b/ui/package.json index fa88051..62954a8 100644 --- a/ui/package.json +++ b/ui/package.json @@ -2,7 +2,7 @@ "name": "eqmac", "version": "1.2.1", "scripts": { - "start": "ng serve", + "start": "ng serve --port 8080", "build": "rm -rf dist/ && ng build --prod && cd dist/ && zip -r -D ui.zip * -x '*.DS_Store' && cp ui.zip ../../native/app/Embedded", "deploy": "export $(egrep -v '^#' .env | xargs) && ./scripts/deploy.sh", "purge-cache": "./node_modules/.bin/ts-node -O '{\"module\":\"commonjs\"}' ./scripts/purge-cache.ts" @@ -22,11 +22,13 @@ "@angular/pwa": "^0.803.8", "@angular/router": "~8.2.9", "@angular/service-worker": "~8.2.9", + "@webcomponents/custom-elements": "^1.4.2", "core-js": "^3.2.1", "js-cookie": "^2.2.1", "ng-click-outside": "^5.1.1", "rxjs": "~6.5.3", "ui-carousel": "^0.2.0", + "web-animations-js": "^2.3.2", "zone.js": "~0.10.2" }, "devDependencies": { diff --git a/ui/src/app/app.component.ts b/ui/src/app/app.component.ts index f9bab43..34623ca 100644 --- a/ui/src/app/app.component.ts +++ b/ui/src/app/app.component.ts @@ -32,13 +32,13 @@ export class AppComponent implements OnInit, AfterContentInit { } constructor ( - private utils: UtilitiesService, - private ui: UIService, + public utils: UtilitiesService, + public ui: UIService, public matDialog: MatDialog, - private transitions: TransitionService, - private analytics: AnalyticsService, - private app: ApplicationService, - private settings: SettingsService + public transitions: TransitionService, + public analytics: AnalyticsService, + public app: ApplicationService, + public settings: SettingsService ) { } async ngOnInit () { diff --git a/ui/src/app/components/options/options.component.html b/ui/src/app/components/options/options.component.html index f3c07f4..5316adb 100644 --- a/ui/src/app/components/options/options.component.html +++ b/ui/src/app/components/options/options.component.html @@ -1,6 +1,6 @@
-
-
+
+
diff --git a/ui/src/app/components/options/options.component.ts b/ui/src/app/components/options/options.component.ts index e1a09e1..d47c760 100644 --- a/ui/src/app/components/options/options.component.ts +++ b/ui/src/app/components/options/options.component.ts @@ -41,7 +41,16 @@ export class OptionsComponent { @Input() options: Options = [] @Output() checkboxToggled = new EventEmitter() - constructor (private ref: ChangeDetectorRef) {} + constructor (public ref: ChangeDetectorRef) {} + + getOptionStyle (type: Option['type']) { + let style: any = {} + if (type === 'button') { + style.width = '100%' + } + + return style + } toggleCheckbox (checkbox: CheckboxOption) { checkbox.value = !checkbox.value diff --git a/ui/src/app/modules/eqmac-components/components/analyzer/analyzer.component.ts b/ui/src/app/modules/eqmac-components/components/analyzer/analyzer.component.ts index 844db4f..b886900 100644 --- a/ui/src/app/modules/eqmac-components/components/analyzer/analyzer.component.ts +++ b/ui/src/app/modules/eqmac-components/components/analyzer/analyzer.component.ts @@ -16,14 +16,14 @@ export class AnalyzerComponent implements OnInit { @ViewChild('container', { read: ElementRef, static: true -}) container + }) container height = 0 width = 0 halfHeight = 0 halfWidth = 0 - constructor (private elRef: ElementRef) {} + constructor (public elRef: ElementRef) {} ngOnInit () { } diff --git a/ui/src/app/modules/eqmac-components/components/button/button.component.html b/ui/src/app/modules/eqmac-components/components/button/button.component.html index 1e07e4a..e6a2f18 100644 --- a/ui/src/app/modules/eqmac-components/components/button/button.component.html +++ b/ui/src/app/modules/eqmac-components/components/button/button.component.html @@ -1,3 +1,3 @@ -
+
\ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/button/button.component.ts b/ui/src/app/modules/eqmac-components/components/button/button.component.ts index 6b13c15..3b6a3d9 100644 --- a/ui/src/app/modules/eqmac-components/components/button/button.component.ts +++ b/ui/src/app/modules/eqmac-components/components/button/button.component.ts @@ -20,6 +20,13 @@ export class ButtonComponent implements OnInit { ngOnInit () { } + get style () { + return { + width: `${this.width}px`, + height: `${this.height}px` + } + } + computeClass () { let className = 'button' className += ` ${this.type}` diff --git a/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.html b/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.html index 6dad4e3..19690c1 100644 --- a/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.html +++ b/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.html @@ -1,3 +1,3 @@ -
+
diff --git a/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.ts b/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.ts index 16caf00..77c313a 100644 --- a/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.ts +++ b/ui/src/app/modules/eqmac-components/components/carousel/carousel.component.ts @@ -43,9 +43,9 @@ export class CarouselComponent implements AfterViewInit, OnDestroy { } @Output() heightDiff = new EventEmitter() @Output() heightChange = new EventEmitter() - private recalculateHeightTimer + public recalculateHeightTimer - private _selectedItemId: string + public _selectedItemId: string @Input() set selectedItemId (newSelectedItemId: string) { if (this._selectedItemId !== newSelectedItemId) { this._selectedItemId = newSelectedItemId @@ -60,10 +60,18 @@ export class CarouselComponent implements AfterViewInit, OnDestroy { @Output() itemCameIntoView = new EventEmitter() constructor ( - private builder: AnimationBuilder + public builder: AnimationBuilder ) { } + get wrapperStyle () { + return { + height: `${this.height}px`, + transitionDuration: `${this.animationDuration}ms`, + width: `${this.items.length * 100}%` + } + } + ngAfterViewInit () { for (const item of this.items.toArray()) { if (!item.eqmCarouselItem || typeof item.eqmCarouselItem !== 'string') { @@ -104,21 +112,21 @@ export class CarouselComponent implements AfterViewInit, OnDestroy { this.selectedItemIdChange.emit(this.selectedItemId) } - private animate () { + public animate () { const myAnimation: AnimationFactory = this.animation const player = myAnimation.create(this.wrapper.nativeElement) player.play() setTimeout(() => this.animationCompleted.emit(), this.animationDuration) } - private get animation () { + public get animation () { const offset = this.currentIndex * 100 / this.items.length return this.builder.build([ animate(`${this.animationDuration}ms ease-in`, style({ transform: `translateX(-${offset}%)` })) ]) } - private recalculateHeight () { + public recalculateHeight () { const itemEl = this.itemElems && this.itemElems.toArray()[this.currentIndex].nativeElement.nextElementSibling itemEl && itemEl.offsetHeight && (this.height = itemEl.offsetHeight) } diff --git a/ui/src/app/modules/eqmac-components/components/divider/divider.component.html b/ui/src/app/modules/eqmac-components/components/divider/divider.component.html index 9c6bbd6..e69de29 100644 --- a/ui/src/app/modules/eqmac-components/components/divider/divider.component.html +++ b/ui/src/app/modules/eqmac-components/components/divider/divider.component.html @@ -1 +0,0 @@ -
\ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/divider/divider.component.scss b/ui/src/app/modules/eqmac-components/components/divider/divider.component.scss index 878748d..8c2efbb 100644 --- a/ui/src/app/modules/eqmac-components/components/divider/divider.component.scss +++ b/ui/src/app/modules/eqmac-components/components/divider/divider.component.scss @@ -1,16 +1,5 @@ -.divider { +:host { + display: block; + overflow: hidden; background-color: black; } -.horizontal { - width: 100%; - height: 1px; - border-top: 1px solid rgb(58, 59, 61); - border-bottom: 1px solid rgb(96, 97, 101); -} - -.vertical { - height: 100%; - width: 1px; - border-left: 1px solid rgb(58, 59, 61); - border-right: 1px solid rgb(96, 97, 101); -} \ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/divider/divider.component.ts b/ui/src/app/modules/eqmac-components/components/divider/divider.component.ts index d8f7ba8..abf44d8 100644 --- a/ui/src/app/modules/eqmac-components/components/divider/divider.component.ts +++ b/ui/src/app/modules/eqmac-components/components/divider/divider.component.ts @@ -1,27 +1,45 @@ -import { Component, OnInit, Input, ElementRef } from '@angular/core' +import { Component, OnInit, Input, ElementRef, HostBinding } from '@angular/core' @Component({ selector: 'eqm-divider', templateUrl: './divider.component.html', styleUrls: ['./divider.component.scss'] }) -export class DividerComponent implements OnInit { +export class DividerComponent { + @Input() orientation: 'vertical' | 'horizontal' = 'horizontal' - constructor (private elRef: ElementRef) { } - _horizontal = true - _vertical = false - @Input() - set horizontal (isHorizontal) { - this._horizontal = isHorizontal - this._vertical = !isHorizontal + constructor ( + public elem: ElementRef + ) {} + + @HostBinding('style.width') + get width () { + return this.orientation === 'vertical' ? '1px' : `${this.elem.nativeElement.parentElement.offsetWidth}` } - @Input() - set vertical (isVertical) { - this._vertical = isVertical - this._horizontal = !isVertical + @HostBinding('style.height') + get height () { + return this.orientation === 'vertical' ? `${this.elem.nativeElement.parentElement.offsetHeight}` : '1px' } - ngOnInit () { + + @HostBinding('style.border-left') + get leftBorder () { + return this.orientation === 'vertical' ? '1px solid rgb(58, 59, 61)' : undefined + } + + @HostBinding('style.border-right') + get rightBorder () { + return this.orientation === 'vertical' ? '1px solid rgb(96, 97, 101)' : undefined + } + + @HostBinding('style.border-top') + get topBorder () { + return this.orientation === 'horizontal' ? '1px solid rgb(58, 59, 61)' : undefined + } + + @HostBinding('style.border-bottom') + get bottomtBorder () { + return this.orientation === 'horizontal' ? '1px solid rgb(96, 97, 101)' : undefined } } diff --git a/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.scss b/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.scss index 01114c6..e6f66d9 100644 --- a/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.scss +++ b/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.scss @@ -7,15 +7,6 @@ transition-duration: 0.5s; } -.arrows { - width: 20px; - display: inline-flex; - flex-direction: column; - text-align: center; - position: absolute; - right: 0px; -} - .container { z-index: 3; width: 100%; @@ -28,6 +19,16 @@ transform: translateX(-2px); } +.arrows { + width: 20px; + display: inline-flex; + flex-direction: column; + text-align: center; + position: absolute; + right: 0px; + top: calc(50% - 16px/2); +} + $animation-duration: .2s; .items-select-box{ diff --git a/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.ts b/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.ts index 5c56f35..0987fcb 100644 --- a/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.ts +++ b/ui/src/app/modules/eqmac-components/components/dropdown/dropdown.component.ts @@ -11,8 +11,8 @@ import { FadeInOutAnimation } from 'src/app/modules/animations' animations: [ FadeInOutAnimation ] }) export class DropdownComponent implements OnInit { - constructor (private utils: UtilitiesService, private zone: NgZone) { } - private _items: any[] = [] + constructor (public utils: UtilitiesService, public zone: NgZone) { } + public _items: any[] = [] hasSelection = false @Input() editable = false @Input() @@ -40,7 +40,7 @@ export class DropdownComponent implements OnInit { shown = false yCoordinate = 0 direction: 'down' | 'up' = 'down' - private padding = 5 + public padding = 5 async ngOnInit () { if (!this.items) this.items = [] diff --git a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.html b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.html index e855390..dd5a734 100644 --- a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.html +++ b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.html @@ -1,4 +1,7 @@ -
-
-
-
\ No newline at end of file + +
+
+
+
+
+
\ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.scss b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.scss index fa4ef69..804074d 100644 --- a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.scss +++ b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.scss @@ -1,24 +1,18 @@ :host { - position: relative; - display: flex; - align-items: center; - justify-content: center; + display: block; + padding: 2px; } :host.disabled { filter: grayscale(80%); } +.container { + position: relative; -.groove { - position: absolute; + * { + position: absolute; + } } -.groove-filling { - position: absolute; -} - -.thumb { - position: absolute; -} \ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.ts b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.ts index 91569a1..25e25ba 100644 --- a/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.ts +++ b/ui/src/app/modules/eqmac-components/components/flat-slider/flat-slider.component.ts @@ -28,9 +28,9 @@ export interface FlatSliderValueChangedEvent { }) export class FlatSliderComponent { constructor ( - private utils: UtilitiesService, - private elem: ElementRef, - private sanitizer: DomSanitizer + public utils: UtilitiesService, + public elem: ElementRef, + public sanitizer: DomSanitizer ) {} @Input() doubleClickToAnimateToMiddle = true @@ -44,12 +44,14 @@ export class FlatSliderComponent { @Input() thickness = 2 @Input() orientation: 'vertical' | 'horizontal' = 'horizontal' @Output() stickedToMiddle = new EventEmitter() + @ViewChild('container', { static: true }) containerRef: ElementRef + get middleValue () { return typeof this.middle === 'number' ? this.middle : (this.min + this.max) / 2 } - private defaultColor = '#4f8d71' - private _enabled = true + public defaultColor = '#4f8d71' + public _enabled = true @HostBinding('class.disabled') get disabled () { return !this.enabled } @Input() @@ -59,7 +61,7 @@ export class FlatSliderComponent { } get enabled () { return this._enabled } - private _color = this.defaultColor + public _color = this.defaultColor @Input() set color (newColor) { this.defaultColor = newColor @@ -78,10 +80,10 @@ export class FlatSliderComponent { return hex } - private dragging = false - private knobRadius = 4 + public dragging = false + public knobRadius = 4 - private _value = .5 + public _value = .5 @Input() set value (newValue) { let value = this.clampValue(newValue) @@ -112,13 +114,13 @@ export class FlatSliderComponent { @Output() userChangedValue = new EventEmitter() get height () { - return this.elem.nativeElement.offsetHeight + return this.containerRef.nativeElement.offsetHeight } get width () { - return this.elem.nativeElement.offsetWidth + return this.containerRef.nativeElement.offsetWidth } - private clampValue (value) { + public clampValue (value) { if (value < this.min) return this.min if (value > this.max) return this.max return value @@ -133,7 +135,7 @@ export class FlatSliderComponent { } } - private getValueFromMouseEvent (event: MouseEvent) { + public getValueFromMouseEvent (event: MouseEvent) { const coords = this.utils.getCoordinatesInsideElementFromEvent(event, this.elem.nativeElement) const progress = this.orientation === 'vertical' ? coords.y : coords.x const value = this.utils.mapValue(progress, this.knobRadius, (this.orientation === 'vertical' ? this.height : this.width) - this.knobRadius, this.min, this.max) @@ -157,7 +159,7 @@ export class FlatSliderComponent { } } - private mouseInside = false + public mouseInside = false @HostListener('mouseenter') onMouseEnter (): void { this.mouseInside = true @@ -168,7 +170,7 @@ export class FlatSliderComponent { this.dragging = false } - private doubleclickTimeout = null + public doubleclickTimeout = null doubleclick () { if (this.enabled && this.doubleClickToAnimateToMiddle) { if (this.doubleclickTimeout) { @@ -211,34 +213,30 @@ export class FlatSliderComponent { return this.utils.mapValue(this.value, this.min, this.max, 0, 1) } - @HostBinding('style') - get style (): SafeStyle { + get containerStyle () { const styles: { [style: string]: string } = {} - const thickness = this.knobRadius * 2 + 2 + const height = this.knobRadius * 2 + 2 if (this.orientation === 'horizontal') { styles.width = `100%` - styles.height = `${thickness}px` - styles.flexDirection = 'column' + styles.height = `${height}px` } else { styles.height = `100%` - styles.width = `${thickness}px` - styles.flexDirection = 'row' + styles.width = `${height}px` } - const style = Object.entries(styles) - .map(([ key, value ]) => `${key}: ${value}`) - .join('; ') - return this.sanitizer.bypassSecurityTrustStyle(style) + return styles } get grooveStyle () { const style: { [style: string]: string | number } = {} if (this.orientation === 'horizontal') { style.left = `${this.knobRadius}px` + style.top = `calc(50% - ${this.thickness}px / 2)` style.width = `calc(100% - ${this.knobRadius * 2}px)` style.height = `${this.thickness}px` } else { - style.bottom = `${this.knobRadius}px` + style.top = `${this.knobRadius}px` + style.left = `calc(50% - ${this.thickness}px / 2)` style.height = `calc(100% - ${this.knobRadius * 2}px)` style.width = `${this.thickness}px` } @@ -250,10 +248,12 @@ export class FlatSliderComponent { const style: { [style: string]: string } = {} if (this.orientation === 'horizontal') { style.left = `${this.knobRadius}px` + style.top = `calc(50% - ${this.thickness}px / 2)` style.width = `calc(${this.progress * 100}% - ${this.knobRadius}px)` style.height = `${this.thickness}px` } else { - style.bottom = `${this.knobRadius}px` + style.top = `${this.knobRadius}px` + style.left = `calc(50% - ${this.thickness}px / 2)` style.height = `calc(${this.progress * 100}% - ${this.knobRadius * 2}px)` style.width = `${this.thickness}px` } @@ -268,11 +268,9 @@ export class FlatSliderComponent { style.backgroundColor = this.value >= this.middleValue ? this.color : this.darkerColor style.borderRadius = '100%' - if (this.orientation === 'horizontal') { - style.left = `${this.utils.mapValue(this.middleValue, this.min, this.max, 0, this.width)}px` - } else { - style.bottom = `${this.utils.mapValue(this.middleValue, this.min, this.max, 0, this.height)}px` - } + const center = `calc(50% - ${this.knobRadius}px)` + style.left = center + style.top = center return style } diff --git a/ui/src/app/modules/eqmac-components/components/icon/icon.component.ts b/ui/src/app/modules/eqmac-components/components/icon/icon.component.ts index e8d463c..5738f35 100644 --- a/ui/src/app/modules/eqmac-components/components/icon/icon.component.ts +++ b/ui/src/app/modules/eqmac-components/components/icon/icon.component.ts @@ -42,7 +42,7 @@ export class IconComponent implements OnInit { } } - private _rotate = 0 + public _rotate = 0 @Input() get rotate () { return this._rotate @@ -61,7 +61,7 @@ export class IconComponent implements OnInit { @Input() stroke: number = 0 - constructor (private sanitizer: DomSanitizer) {} + constructor (public sanitizer: DomSanitizer) {} ngOnInit () { } diff --git a/ui/src/app/modules/eqmac-components/components/knob/knob.component.html b/ui/src/app/modules/eqmac-components/components/knob/knob.component.html index aa8d013..651464c 100644 --- a/ui/src/app/modules/eqmac-components/components/knob/knob.component.html +++ b/ui/src/app/modules/eqmac-components/components/knob/knob.component.html @@ -38,7 +38,7 @@ -
+
() @Output() userChangedValue = new EventEmitter() @Input() @@ -82,12 +82,12 @@ export class KnobComponent implements OnInit { } middleValue: number = this.calculateMiddleValue() - private calculateMiddleValue () { + public calculateMiddleValue () { this.middleValue = (this.min + this.max) / 2 return this.middleValue } - constructor (private utils: UtilitiesService) {} + constructor (public utils: UtilitiesService) {} async ngOnInit () { this.container = this.containerRef.nativeElement @@ -239,7 +239,7 @@ export class KnobComponent implements OnInit { return } - private getDegreesFromEvent (event) { + public getDegreesFromEvent (event) { const coords = this.utils.getCoordinatesInsideElementFromEvent(event, this.container) const knobCenterX = (this.container.clientWidth) / 2 const knobCenterY = (this.container.clientHeight) / 2 @@ -247,7 +247,7 @@ export class KnobComponent implements OnInit { return rads * 100 } - private getDistanceFromCenterOfElementAndEvent (event) { + public getDistanceFromCenterOfElementAndEvent (event) { const coords = this.utils.getCoordinatesInsideElementFromEvent(event, this.container) const knobCenterX = (this.container.clientWidth) / 2 const knobCenterY = (this.container.clientHeight) / 2 @@ -256,7 +256,7 @@ export class KnobComponent implements OnInit { return Math.sqrt(w * w + h * h) } - private clampValue (value) { + public clampValue (value) { if (value > this.max) { value = this.max } diff --git a/ui/src/app/modules/eqmac-components/components/select-box/select-box.component.ts b/ui/src/app/modules/eqmac-components/components/select-box/select-box.component.ts index 5ee8379..d426058 100644 --- a/ui/src/app/modules/eqmac-components/components/select-box/select-box.component.ts +++ b/ui/src/app/modules/eqmac-components/components/select-box/select-box.component.ts @@ -21,7 +21,7 @@ export class SelectBoxComponent implements OnInit { @Input() selectedItem = null @Output() itemSelected = new EventEmitter() @ViewChild('container', { read: ElementRef, static: true }) container - private _nVisibleItems: number = 6 + public _nVisibleItems: number = 6 @Input() set numberOfVisibleItems (value: number) { if (!isNaN(parseInt(value.toString(), 10))) { @@ -39,24 +39,24 @@ export class SelectBoxComponent implements OnInit { hidden = true itemHeight = 25 - constructor (private host: ElementRef) { } + constructor (public host: ElementRef) { } ngOnInit () { this.setDimensions() } - private setDimensions () { + public setDimensions () { this.setHeight() this.setWidth() } - private setHeight () { + public setHeight () { const lowest = Math.min(this._nVisibleItems, this.items.length) this.height = lowest * this.itemHeight + (this.numberOfVisibleItems < this.items.length ? this.itemHeight / 2 : 0) this.host.nativeElement.style.height = `${this.height}px` } - private setWidth () { + public setWidth () { if (this.width) { this.host.nativeElement.style.height = `${this.height}px` } diff --git a/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.scss b/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.scss index 50d9096..0c22e4e 100644 --- a/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.scss +++ b/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.scss @@ -11,6 +11,14 @@ transition-duration: .5s; } +.notches { + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; +} + .groove { width: 7px; height: 89%; @@ -29,6 +37,7 @@ justify-content: center; align-items: center; top: 0; + left: calc(50% - 21px / 2); width: 21px; height: 25px; background-color: rgb(56, 57, 61); @@ -57,12 +66,6 @@ } } -.notches { - position: absolute; - height: 100%; - width: 100%; -} - :host.disabled { filter: grayscale(80%); } \ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.ts b/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.ts index 8a75190..de6e9f4 100644 --- a/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.ts +++ b/ui/src/app/modules/eqmac-components/components/skeuomorph-slider/skeuomorph-slider.component.ts @@ -25,7 +25,7 @@ export interface SkeuomorphSliderValueChangedEvent { }) export class SkeuomorphSliderComponent implements OnInit { - constructor (private utils: UtilitiesService, private elRef: ElementRef) {} + constructor (public utils: UtilitiesService, public elRef: ElementRef) {} @Input() min: number = 0 @Input() max: number = 1 @@ -40,8 +40,8 @@ export class SkeuomorphSliderComponent implements OnInit { return typeof this.middle === 'number' ? this.middle : (this.min + this.max) / 2 } - private dragging = false - private doubleclickTimeout = null + public dragging = false + public doubleclickTimeout = null @ViewChild('notches', { static: true }) notches @Output() userChangedValue = new EventEmitter() @@ -50,7 +50,7 @@ export class SkeuomorphSliderComponent implements OnInit { @HostBinding('class.disabled') @Input() disabled = false - private _value = .5 + public _value = .5 @Input() set value (newValue) { let value = this.clampValue(newValue) @@ -86,7 +86,7 @@ export class SkeuomorphSliderComponent implements OnInit { } } - private getValueFromMouseEvent (event) { + public getValueFromMouseEvent (event) { const coords = this.utils.getCoordinatesInsideElementFromEvent(event, this.elRef.nativeElement) const y = coords.y const height = this.elRef.nativeElement.offsetHeight @@ -95,7 +95,7 @@ export class SkeuomorphSliderComponent implements OnInit { return value } - private clampValue (value) { + public clampValue (value) { if (value < this.min) { return this.min } else if (value > this.max) { diff --git a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.html b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.html index 723860c..9bfc410 100644 --- a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.html +++ b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.html @@ -1,13 +1,15 @@ -
-
-
- - - - {{text}} - - +
+
+
+
+ + + + {{text}} + + +
\ No newline at end of file diff --git a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.scss b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.scss index 48cbab3..749e071 100644 --- a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.scss +++ b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.scss @@ -1,34 +1,37 @@ -:host { + +.container { + display: block; position: absolute; // padding: 2px 3px; left: -100px; top: -100px; pointer-events: none; z-index: 9999; -} -.tooltip { - text-align: center; - padding: 0px 4px; - white-space: pre; -} -.arrow-container { - position: absolute; - z-index: 9998; - width: 12px; - height: 12px; - display: flex; - justify-content: center; - align-items: center; - clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%); - - .arrow { - $ratio: 50%; - width: $ratio; - height: $ratio; - transform: rotate(45deg); - background-color: #222324; - box-shadow: 0 0 0 1px #000, 0 0 0 2px rgb(70, 74, 77); - border-radius: 10%; + .tooltip { + text-align: center; + padding: 0px 4px; + white-space: pre; } -} \ No newline at end of file + + .arrow-container { + position: absolute; + z-index: 9998; + width: 12px; + height: 12px; + display: flex; + justify-content: center; + align-items: center; + clip-path: polygon(0 0, 100% 0, 100% 50%, 0 50%); + + .arrow { + $ratio: 50%; + width: $ratio; + height: $ratio; + transform: rotate(45deg); + background-color: #222324; + box-shadow: 0 0 0 1px #000, 0 0 0 2px rgb(70, 74, 77); + border-radius: 10%; + } + } +} diff --git a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.ts b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.ts index 9301420..a63d082 100644 --- a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.ts +++ b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.component.ts @@ -3,8 +3,7 @@ import { OnInit, Input, ElementRef, - ViewChild, - HostBinding + ViewChild } from '@angular/core' import { UtilitiesService } from '../../services/utilities.service' import { SafeStyle, DomSanitizer } from '@angular/platform-browser' @@ -20,7 +19,7 @@ export class TooltipComponent implements OnInit { @Input() parent?: any @Input() positionSide: TooltipPositionSide = 'top' @Input() showArrow: Boolean = true - private padding = 10 + public padding = 10 @ViewChild('arrow', { read: ElementRef, @@ -33,24 +32,23 @@ export class TooltipComponent implements OnInit { }) tooltip constructor ( - private elem: ElementRef, - private utils: UtilitiesService, - private sanitizer: DomSanitizer + public elem: ElementRef, + public utils: UtilitiesService, + public sanitizer: DomSanitizer ) {} async ngOnInit () { await this.utils.delay(0) } - @HostBinding('style') - get style (): SafeStyle { + get style () { let x = -999 let y = -999 const body = document.body const html = document.documentElement 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.elem.nativeElement + const tooltipEl = this.tooltip.nativeElement const tooltipWidth = tooltipEl.offsetWidth + 3 const tooltipHeight = tooltipEl.offsetHeight + 2 const parentEl = this.parent.nativeElement @@ -86,7 +84,10 @@ export class TooltipComponent implements OnInit { const minY = this.padding if (y < minY) y = minY - return this.sanitizer.bypassSecurityTrustStyle(`left: ${x}px; top: ${y}px`) + return { + left: `${x}px`, + top: `${y}px` + } } get arrowStyle () { @@ -96,9 +97,9 @@ export class TooltipComponent implements OnInit { let y = 0 let angle = 0 const style: { [style: string]: string } = {} - const tooltipEl = this.elem.nativeElement - const tooltipWidth = tooltipEl.offsetWidth + 3 - const tooltipHeight = tooltipEl.offsetHeight + 2 + const tooltipEl = this.tooltip.nativeElement + const tooltipWidth = tooltipEl.offsetWidth + const tooltipHeight = tooltipEl.offsetHeight const tooltipPosition = this.utils.getElementPosition(tooltipEl) const parentEl = this.parent.nativeElement @@ -106,9 +107,9 @@ export class TooltipComponent implements OnInit { const parentWidth = parentEl.offsetWidth const parentHeight = parentEl.offsetHeight - x = parentPosition.x + parentWidth / 2 - tooltipPosition.x - arrowSize / 2 + x = parentPosition.x + parentWidth / 2 - tooltipPosition.x - arrowSize / 2 + 3 if (this.positionSide === 'top') { - y = tooltipHeight - arrowSize / 2 - 3 + y = tooltipHeight - arrowSize / 2 + 4 } if (this.positionSide === 'top') { @@ -116,7 +117,7 @@ export class TooltipComponent implements OnInit { } if (this.positionSide === 'bottom') { - y = -arrowSize / 2 + 2 + y = -arrowSize / 2 + 3 } style.top = `${y}px` diff --git a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.directive.ts b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.directive.ts index 298a9ac..9cae0cf 100644 --- a/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.directive.ts +++ b/ui/src/app/modules/eqmac-components/components/tooltip/tooltip.directive.ts @@ -10,9 +10,9 @@ export class TooltipDirective implements OnDestroy { @Input() eqmTooltipDelay = 100 @Input() eqmTooltipPositionSide: TooltipPositionSide = 'top' @Input() eqmTooltipShowArrow: boolean = true - private id: string - private left: boolean - constructor (private tooltipService: TooltipService, private element: ElementRef) { } + public id: string + public left: boolean + constructor (public tooltipService: TooltipService, public element: ElementRef) { } @HostListener('mouseenter') onMouseEnter (): void { diff --git a/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.html b/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.html index 8538273..7a42662 100644 --- a/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.html +++ b/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.html @@ -1,8 +1,8 @@
-
+
Global: -
+
diff --git a/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.ts b/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.ts index 50d54c9..e52bf7d 100644 --- a/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.ts +++ b/ui/src/app/sections/effects/equalizers/advanced-equalizer/advanced-equalizer.component.ts @@ -20,7 +20,7 @@ import { ApplicationService } from '../../../../services/app.service' export class AdvancedEqualizerComponent extends EqualizerComponent implements OnInit { @Input() enabled = true - private ShowDefaultPresetsCheckbox: CheckboxOption = { + public ShowDefaultPresetsCheckbox: CheckboxOption = { key: 'show-default-presets', type: 'checkbox', label: 'Show Default Presets', @@ -42,7 +42,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On ], [ this.ShowDefaultPresetsCheckbox ]] - private _presets: AdvancedEqualizerPreset[] + public _presets: AdvancedEqualizerPreset[] @Output() presetsChange = new EventEmitter() set presets (newPresets: AdvancedEqualizerPreset[]) { this._presets = @@ -55,7 +55,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On } get presets () { return this._presets } - private _selectedPreset: AdvancedEqualizerPreset + public _selectedPreset: AdvancedEqualizerPreset @Output() selectedPresetChange = new EventEmitter() set selectedPreset (newSelectedPreset: AdvancedEqualizerPreset) { this._selectedPreset = newSelectedPreset @@ -100,10 +100,10 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On } constructor ( - private service: AdvancedEqualizerService, - private transition: TransitionService, - private change: ChangeDetectorRef, - private app: ApplicationService + public service: AdvancedEqualizerService, + public transition: TransitionService, + public change: ChangeDetectorRef, + public app: ApplicationService ) { super() this.getImportLegacyAvailable() @@ -121,7 +121,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On ]) } - private async getImportLegacyAvailable () { + public async getImportLegacyAvailable () { if (await this.service.getImportLegacyAvailable()) { this.settings[1].push( { @@ -138,7 +138,7 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On ) } } - private async syncPresets () { + public async syncPresets () { const [ presets, selectedPreset ] = await Promise.all([ this.service.getPresets(), this.service.getSelectedPreset() @@ -148,13 +148,13 @@ export class AdvancedEqualizerComponent extends EqualizerComponent implements On this.setSelectedPresetsGains() } - private async syncSettings () { + public async syncSettings () { return Promise.all([ this.syncShowDefaultPresets() ]) } - private async syncShowDefaultPresets () { + public async syncShowDefaultPresets () { this.ShowDefaultPresetsCheckbox.value = await this.service.getShowDefaultPresets() } diff --git a/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.html b/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.html index c4328be..872768a 100644 --- a/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.html +++ b/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.html @@ -2,7 +2,7 @@
-
+
Peak Limiter -
BASS diff --git a/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.ts b/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.ts index 42840d0..a20c624 100644 --- a/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.ts +++ b/ui/src/app/sections/effects/equalizers/basic-equalizer/basic-equalizer.component.ts @@ -24,7 +24,7 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni replaceKnobsWithSliders = false - private _presets: BasicEqualizerPreset[] + public _presets: BasicEqualizerPreset[] @Output() presetsChange = new EventEmitter() set presets (newPresets: BasicEqualizerPreset[]) { this._presets = @@ -37,7 +37,7 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni } get presets () { return this._presets } - private _selectedPreset: BasicEqualizerPreset + public _selectedPreset: BasicEqualizerPreset @Output() selectedPresetChange = new EventEmitter() set selectedPreset (newSelectedPreset: BasicEqualizerPreset) { this._selectedPreset = newSelectedPreset @@ -48,11 +48,11 @@ export class BasicEqualizerComponent extends EqualizerComponent implements OnIni settings = [] constructor ( - private service: BasicEqualizerService, - private app: ApplicationService, - private ui: UIService, - private change: ChangeDetectorRef, - private transition: TransitionService + public service: BasicEqualizerService, + public app: ApplicationService, + public ui: UIService, + public change: ChangeDetectorRef, + public transition: TransitionService ) { super() } diff --git a/ui/src/app/sections/effects/equalizers/equalizers.component.html b/ui/src/app/sections/effects/equalizers/equalizers.component.html index ba31b05..e699cde 100644 --- a/ui/src/app/sections/effects/equalizers/equalizers.component.html +++ b/ui/src/app/sections/effects/equalizers/equalizers.component.html @@ -1,4 +1,4 @@ -
+
@@ -29,7 +29,7 @@
-
+
+ public settingsDialog: MatDialogRef constructor ( - private equalizersService: EqualizersService, - private dialog: MatDialog, + public equalizersService: EqualizersService, + public dialog: MatDialog, protected ui: UIService ) { } @@ -108,7 +108,7 @@ export class EqualizersComponent implements OnInit { this.ui.dimensionsChanged.next({ heightDiff }) } - private getEqualizerFromType (type: EqualizerType): EqualizerComponent { + public getEqualizerFromType (type: EqualizerType): EqualizerComponent { switch (type) { case 'Basic': return this.basicEqualizer case 'Advanced': return this.advancedEqualizer diff --git a/ui/src/app/sections/effects/equalizers/presets/equalizer-presets.component.ts b/ui/src/app/sections/effects/equalizers/presets/equalizer-presets.component.ts index adccbb9..a20cec7 100644 --- a/ui/src/app/sections/effects/equalizers/presets/equalizer-presets.component.ts +++ b/ui/src/app/sections/effects/equalizers/presets/equalizer-presets.component.ts @@ -23,7 +23,7 @@ export class EqualizerPresetsComponent implements OnInit { @Output() presetDeleted = new EventEmitter() constructor ( - private dialog: MatDialog + public dialog: MatDialog ) { } ngOnInit () { diff --git a/ui/src/app/sections/effects/reverb/reverb.component.ts b/ui/src/app/sections/effects/reverb/reverb.component.ts index 41fd797..317e134 100644 --- a/ui/src/app/sections/effects/reverb/reverb.component.ts +++ b/ui/src/app/sections/effects/reverb/reverb.component.ts @@ -22,7 +22,7 @@ export class ReverbComponent implements OnInit { @Output() visibilityToggled = new EventEmitter() - constructor (private reverbService: ReverbService) {} + constructor (public reverbService: ReverbService) {} ngOnInit () { this.getPresets() diff --git a/ui/src/app/sections/header/header.component.ts b/ui/src/app/sections/header/header.component.ts index 3b8c1e0..a959c1f 100644 --- a/ui/src/app/sections/header/header.component.ts +++ b/ui/src/app/sections/header/header.component.ts @@ -21,10 +21,10 @@ export class HeaderComponent implements OnInit { @Output() helpToggled = new EventEmitter() // mode: UIMode = 'popover' constructor ( - private app: ApplicationService, - private ui: UIService, - private dialog: MatDialog, - private settings: SettingsService + public app: ApplicationService, + public ui: UIService, + public dialog: MatDialog, + public settings: SettingsService ) { } async ngOnInit () { diff --git a/ui/src/app/sections/help/help.component.ts b/ui/src/app/sections/help/help.component.ts index 6af0b69..89a74ea 100644 --- a/ui/src/app/sections/help/help.component.ts +++ b/ui/src/app/sections/help/help.component.ts @@ -30,7 +30,7 @@ export class HelpComponent implements OnInit { constructor ( public app: ApplicationService, public CONST: ConstantsService, - private ui: UIService + public ui: UIService ) {} uiVersion = `${version} (${this.ui.isLocal ? 'Local' : 'Remote'})` diff --git a/ui/src/app/sections/outputs/outputs.component.ts b/ui/src/app/sections/outputs/outputs.component.ts index 8211a57..99372e0 100644 --- a/ui/src/app/sections/outputs/outputs.component.ts +++ b/ui/src/app/sections/outputs/outputs.component.ts @@ -9,7 +9,7 @@ import { OutputsService, Output } from './outputs.service' export class OutputsComponent implements OnInit { outputs: Output[] selected: Output - constructor (private service: OutputsService) { } + constructor (public service: OutputsService) { } async ngOnInit () { await this.sync() diff --git a/ui/src/app/sections/settings/settings.component.ts b/ui/src/app/sections/settings/settings.component.ts index 2f56991..3715b7b 100644 --- a/ui/src/app/sections/settings/settings.component.ts +++ b/ui/src/app/sections/settings/settings.component.ts @@ -93,7 +93,7 @@ export class SettingsComponent implements OnInit { public settingsService: SettingsService, public app: ApplicationService, public dialog: MatDialog, - private ui: UIService + public ui: UIService ) { this.getDriverReinstallAvailable() } diff --git a/ui/src/app/sections/source/file/file.component.ts b/ui/src/app/sections/source/file/file.component.ts index 14ec981..feb41bc 100644 --- a/ui/src/app/sections/source/file/file.component.ts +++ b/ui/src/app/sections/source/file/file.component.ts @@ -27,15 +27,15 @@ export class FileComponent implements OnInit, OnDestroy { name: null, duration: 0 } - private syncedOnce = false - private progressProjectionInterval = null - private progressSetDebouncer = null + public syncedOnce = false + public progressProjectionInterval = null + public progressSetDebouncer = null selected = false meta: FileMeta = null playing = false progress = 0 - constructor (private fileService: FileService, public utils: UtilitiesService, private app: ApplicationService) { + constructor (public fileService: FileService, public utils: UtilitiesService, public app: ApplicationService) { this.setDefaultMeta() } @@ -50,11 +50,11 @@ export class FileComponent implements OnInit, OnDestroy { } } - private setDefaultMeta () { + public setDefaultMeta () { this.meta = this.utils.deepCloneJSON(this.defaultMeta) } - private setProgressProjection () { + public setProgressProjection () { const refreshFPS = 30 if (this.progressProjectionInterval) { diff --git a/ui/src/app/sections/source/input/input.component.ts b/ui/src/app/sections/source/input/input.component.ts index f67a88c..17013a9 100644 --- a/ui/src/app/sections/source/input/input.component.ts +++ b/ui/src/app/sections/source/input/input.component.ts @@ -14,7 +14,7 @@ export interface InputDevice { }) export class InputComponent implements OnInit { - constructor (private inputService: InputService) { } + constructor (public inputService: InputService) { } devices: InputDevice[] = [] selectedDevice: InputDevice = null diff --git a/ui/src/app/sections/source/source.component.ts b/ui/src/app/sections/source/source.component.ts index a3e2a01..5bc2828 100644 --- a/ui/src/app/sections/source/source.component.ts +++ b/ui/src/app/sections/source/source.component.ts @@ -9,7 +9,7 @@ import { SourceService, SourceType } from './source.service' export class SourceComponent implements OnInit { source: SourceType = 'File' - constructor (private sourceService: SourceService) { } + constructor (public sourceService: SourceService) { } ngOnInit () { this.setupEvents() diff --git a/ui/src/app/sections/volume/booster-balance/balance/balance.component.ts b/ui/src/app/sections/volume/booster-balance/balance/balance.component.ts index 7fb8db7..89d3430 100644 --- a/ui/src/app/sections/volume/booster-balance/balance/balance.component.ts +++ b/ui/src/app/sections/volume/booster-balance/balance/balance.component.ts @@ -19,8 +19,8 @@ export class BalanceComponent implements OnInit { constructor ( public balanceService: BalanceService, - private app: ApplicationService, - private ui: UIService + public app: ApplicationService, + public ui: UIService ) { } ngOnInit () { diff --git a/ui/src/app/sections/volume/booster-balance/booster/booster.component.ts b/ui/src/app/sections/volume/booster-balance/booster/booster.component.ts index d89fa1f..cdf02a8 100644 --- a/ui/src/app/sections/volume/booster-balance/booster/booster.component.ts +++ b/ui/src/app/sections/volume/booster-balance/booster/booster.component.ts @@ -21,9 +21,9 @@ export class BoosterComponent implements OnInit { constructor ( public boosterService: BoosterService, - private app: ApplicationService, - private changeRef: ChangeDetectorRef, - private ui: UIService + public app: ApplicationService, + public changeRef: ChangeDetectorRef, + public ui: UIService ) {} ngOnInit () { @@ -38,8 +38,8 @@ export class BoosterComponent implements OnInit { ]) } - private ignoreUpdates = false - private ignoreUpdatesDebouncer: NodeJS.Timer + public ignoreUpdates = false + public ignoreUpdatesDebouncer: NodeJS.Timer protected setupEvents () { this.boosterService.onGainChanged(gain => { if (!this.ignoreUpdates) { diff --git a/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.html b/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.html index 7f175d5..3bed50d 100644 --- a/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.html +++ b/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.html @@ -1,6 +1,6 @@
- +
diff --git a/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.ts b/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.ts index d33b965..3a04dcf 100644 --- a/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.ts +++ b/ui/src/app/sections/volume/booster-balance/volume-booster-balance.component.ts @@ -11,7 +11,7 @@ export class VolumeBoosterBalanceComponent implements OnInit { replaceKnobsWithSliders = false @Output() visibilityToggled = new EventEmitter() constructor ( - private ui: UIService + public ui: UIService ) { } async ngOnInit () { diff --git a/ui/src/app/services/analytics.service.ts b/ui/src/app/services/analytics.service.ts index b4ecd62..6fad307 100644 --- a/ui/src/app/services/analytics.service.ts +++ b/ui/src/app/services/analytics.service.ts @@ -8,11 +8,11 @@ import { version } from '../../../package.json' }) export class AnalyticsService { constructor ( - private utils: UtilitiesService, - private app: ApplicationService + public utils: UtilitiesService, + public app: ApplicationService ) {} - private async load () { + public async load () { await this.utils.waitForProperty(window, 'ga') await this.utils.delay(1000) await this.utils.waitForProperty(ga, 'getAll') diff --git a/ui/src/app/services/bridge.service.ts b/ui/src/app/services/bridge.service.ts index 1b205e5..cb57397 100644 --- a/ui/src/app/services/bridge.service.ts +++ b/ui/src/app/services/bridge.service.ts @@ -30,10 +30,10 @@ interface JSBridge { providedIn: 'root' }) export class BridgeService { - private static bridgeLoadTimeout = 10000 - private static bridgeLoadPromise: Promise = null + public static bridgeLoadTimeout = 10000 + public static bridgeLoadPromise: Promise = null - private get bridge () { + public get bridge () { if (BridgeService.bridgeLoadPromise) { return BridgeService.bridgeLoadPromise } diff --git a/ui/src/app/services/cookies.service.ts b/ui/src/app/services/cookies.service.ts index e162b7b..bcd6192 100644 --- a/ui/src/app/services/cookies.service.ts +++ b/ui/src/app/services/cookies.service.ts @@ -8,7 +8,7 @@ import { environment } from '../../environments/environment' }) export class CookiesService { constructor ( - private CONST: ConstantsService + public CONST: ConstantsService ) {} set (key: string, value: any) { if (typeof value !== 'string') { diff --git a/ui/src/app/services/logger.service.ts b/ui/src/app/services/logger.service.ts index b8ca38e..8fdf7a2 100644 --- a/ui/src/app/services/logger.service.ts +++ b/ui/src/app/services/logger.service.ts @@ -5,7 +5,7 @@ export class Logger { this.console('log', ...something) } - private static console (func: 'log' , ...something: any[]) { + public static console (func: 'log' , ...something: any[]) { if (!environment.production) { console[func](...something) } diff --git a/ui/src/index.html b/ui/src/index.html index 27a97b8..3ef6750 100644 --- a/ui/src/index.html +++ b/ui/src/index.html @@ -2,6 +2,7 @@ +