diff --git a/main.js b/main.js index 1de6580e6..042d1592a 100644 --- a/main.js +++ b/main.js @@ -55,7 +55,7 @@ function createWindow() { window.setFullScreen(true) } - setTimeout(sendVersionInfo, 42 * 1000); + setTimeout(sendVersionInfo, 30 * 1000); activateScreenSleepListener(); window.on('closed', () => { diff --git a/sample.config.json b/sample.config.json index c6184d100..44a91c98d 100644 --- a/sample.config.json +++ b/sample.config.json @@ -1,51 +1,95 @@ { - "octoprint": { - "url": "http://localhost:5000/api/", - "accessToken": "INSERT API KEY HERE", - "apiInterval": 15000 - }, - "printer": { - "name": "NAME HERE", - "xySpeed": 100, - "zSpeed": 5 - }, - "filament": { - "thickness": 0, - "density": 0 - }, - "octodash": { - "touchscreen": true, - "temperatureSensor": null, - "customActions": [{ - "icon": "home", - "command": "G28", - "color": "#dcdde1" + "config": { + "octoprint": { + "accessToken": "INSERT API KEY HERE", + "url": "http://localhost:5000/api/" + }, + "printer": { + "name": "NAME HERE", + "xySpeed": 100, + "zSpeed": 5 + }, + "filament": { + "density": 0, + "thickness": 0, + "feedLength": 470, + "feedSpeed": 100 + }, + "plugins": { + "displayLayerProgress": { + "enabled": true }, - { - "icon": "ruler-vertical", - "command": "G29", - "color": "#44bd32" + "enclosure": { + "enabled": true, + "ambientSensorID": null, + "filament1SensorID": null, + "filament2SensorID": null }, - { - "icon": "fire-alt", - "command": "M140 S50; M104 S185", - "color": "#e1b12c" + "filamentManager": { + "enabled": true }, - { - "icon": "snowflake", - "command": "M140 S0; M104 S0", - "color": "#0097e6" + "preheatButton": { + "enabled": true }, - { - "icon": "redo-alt", - "command": "[!RELOAD]", - "color": "#7f8fa6" + "printTimeGenius": { + "enabled": true }, - { - "icon": "skull", - "command": "[!KILL]", - "color": "#e84118" + "psuControl": { + "enabled": true, + "turnOnPSUWhenExitingSleep": false } - ] + }, + "octodash": { + "customActions": [{ + "icon": "home", + "command": "G28", + "color": "#dcdde1", + "confirm": false, + "exit": false + }, + { + "icon": "ruler-vertical", + "command": "G29", + "color": "#44bd32", + "confirm": false, + "exit": false + }, + { + "icon": "fire-alt", + "command": "M140 S50; M104 S185", + "color": "#e1b12c", + "confirm": false, + "exit": true + }, + { + "icon": "snowflake", + "command": "M140 S0; M104 S0", + "color": "#0097e6", + "confirm": false, + "exit": true + }, + { + "icon": "redo-alt", + "command": "[!RELOAD]", + "color": "#7f8fa6", + "confirm": true, + "exit": false + }, + { + "icon": "skull", + "command": "[!KILL]", + "color": "#e84118", + "confirm": true, + "exit": false + } + ], + "fileSorting": { + "attribute": "name", + "order": "asc" + }, + "pollingInterval": 2000, + "touchscreen": true, + "turnScreenOffWhileSleeping": false + } } } diff --git a/src/app/app.service.ts b/src/app/app.service.ts index 69d913723..903efd014 100644 --- a/src/app/app.service.ts +++ b/src/app/app.service.ts @@ -34,7 +34,6 @@ export class AppService { // If the errors can be automatically fixed return true here public autoFixError(): boolean { const config = this.configService.getCurrentConfig(); - config.octodash.temperatureSensor.ambient = 1; this.configService.saveConfig(config); this.configService.updateConfig(); return false; @@ -53,6 +52,10 @@ export class AppService { setTimeout(this.checkUpdate.bind(this), 21.6 * 1000000); } + public getVersion(): string { + return this.version; + } + public turnDisplayOff(): void { if (this.ipc) { this.ipc.send('screenSleep', ''); diff --git a/src/app/config/config.service.ts b/src/app/config/config.service.ts index b66406ba6..e81059ca1 100644 --- a/src/app/config/config.service.ts +++ b/src/app/config/config.service.ts @@ -2,6 +2,8 @@ import { Injectable } from '@angular/core'; import { HttpClient, HttpHeaders } from '@angular/common/http'; import { environment } from '../../environments/environment'; import Ajv from 'ajv'; +import _ from 'lodash'; +import { DisplayLayerProgressAPI } from '../plugin-service/layer-progress.service'; declare global { interface Window { @@ -60,7 +62,11 @@ export class ConfigService { } public getCurrentConfig(): Config { - return this.config; + return (_.cloneDeep(this.config)); + } + + public isEqualToCurrentConfig(changedConfig: Config): boolean { + return _.isEqual(this.config, changedConfig); } public validate(): boolean { @@ -116,9 +122,10 @@ export class ConfigService { } public createConfigFromInput(config: Config) { - config.octoprint.url = `http://${config.octoprint.urlSplit.url}:${config.octoprint.urlSplit.port}/api/`; - delete config.octoprint.urlSplit; - return config; + const configOut = _.cloneDeep(config); + configOut.octoprint.url = `http://${configOut.octoprint.urlSplit.url}:${configOut.octoprint.urlSplit.port}/api/`; + delete configOut.octoprint.urlSplit; + return configOut; } public isLoaded(): boolean { @@ -137,8 +144,8 @@ export class ConfigService { return this.config.octoprint.url + path; } - public getAPIInterval(): number { - return this.config.octoprint.apiInterval; + public getAPIPollingInterval(): number { + return this.config.octodash.pollingInterval; } public getPrinterName(): string { @@ -174,16 +181,15 @@ export class ConfigService { } public getAmbientTemperatureSensorName(): number { - return this.config.octodash.temperatureSensor.ambient; + return this.config.plugins.enclosure.ambientSensorID; } public getAutomaticScreenSleep(): boolean { - return this.config.octodash.turnScreenOffSleep; + return this.config.octodash.turnScreenOffWhileSleeping; } - public isPSUControlEnabled(): boolean { - // TODO: implement in next config change - return false; + public turnOnPSUWhenExitingSleep(): boolean { + return this.config.plugins.psuControl.turnOnPSUWhenExitingSleep; } public getFilamentThickness(): number { @@ -199,32 +205,13 @@ export interface Config { octoprint: Octoprint; printer: Printer; filament: Filament; + plugins: Plugins; octodash: OctoDash; } -interface OctoDash { - touchscreen: boolean; - temperatureSensor: TemperatureSensor | null; - customActions: CustomAction[]; - turnScreenOffSleep: boolean; -} - -interface CustomAction { - icon: string; - command: string; - color: string; -} - -interface TemperatureSensor { - ambient: number | null; - filament1: number | null; - filament2: number | null; -} - interface Octoprint { url: string; accessToken: string; - apiInterval: number; urlSplit?: { url: string; port: number; @@ -240,6 +227,52 @@ interface Printer { interface Filament { thickness: number; density: number; + feedLength: number; + feedSpeed: number; +} + +interface Plugins { + displayLayerProgress: Plugin; + enclosure: EnclosurePlugin; + filamentManager: Plugin; + preheatButton: Plugin; + printTimeGenius: Plugin; + psuControl: PSUControlPlugin; +} + +interface Plugin { + enabled: boolean; +} + +interface EnclosurePlugin extends Plugin { + ambientSensorID: number | null; + filament1SensorID: number | null; + filament2SensorID: number | null; +} + +interface PSUControlPlugin extends Plugin { + turnOnPSUWhenExitingSleep: boolean; +} + +interface OctoDash { + customActions: CustomAction[]; + fileSorting: FileSorting; + pollingInterval: number; + touchscreen: boolean; + turnScreenOffWhileSleeping: boolean; +} + +interface CustomAction { + icon: string; + command: string; + color: string; + confirm: boolean; + exit: boolean; +} + +interface FileSorting { + attribute: string; + order: string; } const schema = { @@ -251,6 +284,7 @@ const schema = { 'octoprint', 'printer', 'filament', + 'plugins', 'octodash' ], properties: { @@ -258,24 +292,19 @@ const schema = { $id: '#/properties/octoprint', type: 'object', required: [ - 'url', 'accessToken', - 'apiInterval' + 'url' ], properties: { - url: { - $id: '#/properties/octoprint/properties/url', - type: 'string', - pattern: '^(.*)$' - }, accessToken: { $id: '#/properties/octoprint/properties/accessToken', type: 'string', pattern: '^(.*)$' }, - apiInterval: { - $id: '#/properties/octoprint/properties/apiInterval', - type: 'integer' + url: { + $id: '#/properties/octoprint/properties/url', + type: 'string', + pattern: '^(.*)$' } } }, @@ -307,60 +336,156 @@ const schema = { $id: '#/properties/filament', type: 'object', required: [ + 'density', 'thickness', - 'density' + 'feedLength', + 'feedSpeed' ], properties: { + density: { + $id: '#/properties/filament/properties/density', + type: 'number' + }, thickness: { $id: '#/properties/filament/properties/thickness', type: 'number' }, - density: { - $id: '#/properties/filament/properties/density', - type: 'number' + feedLength: { + $id: '#/properties/filament/properties/feedLength', + type: 'integer' + }, + feedSpeed: { + $id: '#/properties/filament/properties/feedSpeed', + type: 'integer' } } }, - octodash: { - $id: '#/properties/octodash', + plugins: { + $id: '#/properties/plugins', type: 'object', required: [ - 'touchscreen', - 'temperatureSensor', - 'customActions', - 'turnScreenOffSleep' + 'displayLayerProgress', + 'enclosure', + 'filamentManager', + 'preheatButton', + 'printTimeGenius', + 'psuControl' ], properties: { - touchscreen: { - $id: '#/properties/octodash/properties/touchscreen', - type: 'boolean' + displayLayerProgress: { + $id: '#/properties/plugins/properties/displayLayerProgress', + type: 'object', + required: [ + 'enabled' + ], + properties: { + enabled: { + $id: '#/properties/plugins/properties/displayLayerProgress/properties/enabled', + type: 'boolean' + } + } }, - temperatureSensor: { - $id: '#/properties/octodash/properties/temperatureSensor', + enclosure: { + $id: '#/properties/plugins/properties/enclosure', type: 'object', required: [ - 'ambient', - 'filament1', - 'filament2' + 'enabled', + 'ambientSensorID', + 'filament1SensorID', + 'filament2SensorID' ], properties: { - ambient: { - $id: '#/properties/octodash/properties/temperatureSensor/properties/ambient', + enabled: { + $id: '#/properties/plugins/properties/enclosure/properties/enabled', + type: 'boolean' + }, + ambientSensorID: { + $id: '#/properties/plugins/properties/enclosure/properties/ambientSensorID', type: ['number', 'null'], pattern: '^(.*)$' }, - filament1: { - $id: '#/properties/octodash/properties/temperatureSensor/properties/filament1', + filament1SensorID: { + $id: '#/properties/plugins/properties/enclosure/properties/filament1SensorID', type: ['number', 'null'], pattern: '^(.*)$' }, - filament2: { - $id: '#/properties/octodash/properties/temperatureSensor/properties/filament2', + filament2SensorID: { + $id: '#/properties/plugins/properties/enclosure/properties/filament2SensorID', type: ['number', 'null'], pattern: '^(.*)$' - }, + } + } + }, + filamentManager: { + $id: '#/properties/plugins/properties/filamentManager', + type: 'object', + required: [ + 'enabled' + ], + properties: { + enabled: { + $id: '#/properties/plugins/properties/filamentManager/properties/enabled', + type: 'boolean' + } } }, + preheatButton: { + $id: '#/properties/plugins/properties/preheatButton', + type: 'object', + required: [ + 'enabled' + ], + properties: { + enabled: { + $id: '#/properties/plugins/properties/preheatButton/properties/enabled', + type: 'boolean' + } + } + }, + printTimeGenius: { + $id: '#/properties/plugins/properties/printTimeGenius', + type: 'object', + required: [ + 'enabled' + ], + properties: { + enabled: { + $id: '#/properties/plugins/properties/printTimeGenius/properties/enabled', + type: 'boolean' + } + } + }, + psuControl: { + $id: '#/properties/plugins/properties/psuControl', + type: 'object', + required: [ + 'enabled', + 'turnOnPSUWhenExitingSleep' + ], + properties: { + enabled: { + $id: '#/properties/plugins/properties/printTimeGenius/properties/enabled', + type: 'boolean' + }, + turnOnPSUWhenExitingSleep: { + $id: '#/properties/octodash/properties/turnOnPSUWhenExitingSleep', + type: 'boolean' + } + } + } + } + }, + octodash: { + $id: '#/properties/octodash', + type: 'object', + required: [ + 'customActions', + 'fileSorting', + 'pollingInterval', + 'touchscreen', + 'turnScreenOffWhileSleeping' + ], + properties: { customActions: { $id: '#/properties/octodash/properties/customActions', type: 'array', @@ -370,7 +495,9 @@ const schema = { required: [ 'icon', 'command', - 'color' + 'color', + 'confirm', + 'exit' ], properties: { icon: { @@ -387,14 +514,50 @@ const schema = { $id: '#/properties/octodash/properties/customActions/items/properties/color', type: 'string', pattern: '^(.*)$' + }, + confirm: { + $id: '#/properties/octodash/properties/customActions/items/properties/confirm', + type: 'boolean' + }, + exit: { + $id: '#/properties/octodash/properties/customActions/items/properties/exit', + type: 'boolean' } } } }, - turnScreenOffSleep: { - $id: '#/properties/octodash/properties/turnScreenOffSleep', + fileSorting: { + $id: '#/properties/octodash/properties/fileSorting', + type: 'object', + required: [ + 'attribute', + 'order' + ], + properties: { + attribute: { + $id: '#/properties/octodash/properties/fileSorting/properties/attribute', + type: 'string', + pattern: '^(name|date|size)$' + }, + order: { + $id: '#/properties/octodash/properties/fileSorting/properties/order', + type: 'string', + pattern: '^(asc|dsc)$' + } + } + }, + pollingInterval: { + $id: '#/properties/octodash/properties/pollingInterval', + type: 'integer' + }, + touchscreen: { + $id: '#/properties/octodash/properties/touchscreen', type: 'boolean' }, + turnScreenOffWhileSleeping: { + $id: '#/properties/octodash/properties/turnScreenOffWhileSleeping', + type: 'boolean' + } } } } diff --git a/src/app/config/no-config/no-config.component.html b/src/app/config/no-config/no-config.component.html index dc498e02e..912bf4368 100644 --- a/src/app/config/no-config/no-config.component.html +++ b/src/app/config/no-config/no-config.component.html @@ -72,54 +72,100 @@
- And finally some information on how OctoDash should be setup. + And now personalize me to your liking.
- + - Touchscreen -
-
- - -
- Please enter the ID of your temperature sensor as configured in the Enclosure Plugin. Leave empty - if you aren't using a temperature sensor. -
+ Use Touchscreen +

+ + + ms +
+ If you're unsure about what values to use, just use the default. You can change all values (and even + more stuff, like defining custom actions) later in the settings menu.
+
+ + What plugins are you running? + +
+
+ + + Display Layer Progress   +
+
+ + + Enclosure +
+
+ + + Filament Manager   +
+
+ + + Preheat Button +
+
+ + + Print Time Genius   +
+
+ + + PSU Control +
+
+ Enclosure and PSU Control Plugin can be configured further in the settings! +
+
+
+
Great! I'll check everything. -
- - - +
+ + + Config Validation - {{ error }} + {{ error }}
- - - + + + Octoprint Connection - {{ octoprintConnectionError }} + {{ octoprintConnectionError }}
- - - + + + Saving Config - {{ configSaved }} + {{ configSaved }}
- done
diff --git a/src/app/config/no-config/no-config.component.scss b/src/app/config/no-config/no-config.component.scss index 6b70bb3dc..73b5e52f3 100644 --- a/src/app/config/no-config/no-config.component.scss +++ b/src/app/config/no-config/no-config.component.scss @@ -61,7 +61,7 @@ } } - &__checkmark { + &__checkbox { position: absolute; top: 0; left: 0; @@ -70,9 +70,7 @@ background-color: transparent; border: 2px solid #dcdde1; border-radius: 1vw; - } - &__checkbox { &-container { display: inline-block; position: relative; @@ -81,6 +79,7 @@ height: 4.5vw; margin-top: 8vh; cursor: pointer; + overflow: visible; } &-checked { @@ -88,9 +87,13 @@ width: 2.4vw; height: 2.4vw; display: block; - margin-left: .8vw; - margin-top: .8vw; + margin-left: .75vw; + margin-top: .75vw; border-radius: .7vw; + + &-disabled { + background-color: rgba(255, 255, 255, .5) + } } } @@ -123,15 +126,16 @@ } &__3 { - &-temperature-explanation { + &-explanation { font-size: 3vw; font-style: italic; opacity: .7; margin-top: 4vh; + padding: 2vh 4vw; } } - &__4 { + &__5 { &-check-wrapper { width: 100%; text-align: center; diff --git a/src/app/config/no-config/no-config.component.ts b/src/app/config/no-config/no-config.component.ts index ffd7dfcb8..519b22b2b 100644 --- a/src/app/config/no-config/no-config.component.ts +++ b/src/app/config/no-config/no-config.component.ts @@ -10,7 +10,7 @@ import { Router } from '@angular/router'; }) export class NoConfigComponent implements OnInit { public page = 0; - public totalPages = 4; + public totalPages = 5; private configUpdate: boolean; public config: Config; @@ -30,7 +30,6 @@ export class NoConfigComponent implements OnInit { octoprint: { url: 'http://localhost:5000/api/', accessToken: '', - apiInterval: 1500 }, printer: { name: '', @@ -39,48 +38,86 @@ export class NoConfigComponent implements OnInit { }, filament: { thickness: 1.75, - density: 1.25 + density: 1.25, + feedLength: 470, + feedSpeed: 100, }, - octodash: { - touchscreen: true, - temperatureSensor: { - ambient: null, - filament1: null, - filament2: null + plugins: { + displayLayerProgress: { + enabled: true + }, + enclosure: { + enabled: false, + ambientSensorID: null, + filament1SensorID: null, + filament2SensorID: null + }, + filamentManager: { + enabled: true + }, + preheatButton: { + enabled: true + }, + printTimeGenius: { + enabled: true }, + psuControl: { + enabled: false, + turnOnPSUWhenExitingSleep: false + } + }, + octodash: { customActions: [ { icon: 'home', command: 'G28', - color: '#dcdde1' + color: '#dcdde1', + confirm: false, + exit: true }, { icon: 'ruler-vertical', command: 'G29', - color: '#44bd32' + color: '#44bd32', + confirm: false, + exit: true }, { icon: 'fire-alt', command: 'M140 S50; M104 S185', - color: '#e1b12c' + color: '#e1b12c', + confirm: false, + exit: true }, { icon: 'snowflake', command: 'M140 S0; M104 S0', - color: '#0097e6' + color: '#0097e6', + confirm: false, + exit: true }, { icon: 'redo-alt', command: '[!RELOAD]', - color: '#7f8fa6' + color: '#7f8fa6', + confirm: true, + exit: false }, { icon: 'skull', command: '[!KILL]', - color: '#e84118' + color: '#e84118', + confirm: true, + exit: false } ], - turnScreenOffSleep: false + fileSorting: { + attribute: 'name', + order: 'asc' + }, + pollingInterval: 2000, + touchscreen: true, + turnScreenOffWhileSleeping: false } }; } @@ -138,7 +175,7 @@ export class NoConfigComponent implements OnInit { public increasePage(): void { this.page += 1; - if (this.page === 4) { + if (this.page === this.totalPages) { this.createConfig(); } this.changeProgress(); diff --git a/src/app/job.service.ts b/src/app/job.service.ts index 6950e4478..108f077d7 100644 --- a/src/app/job.service.ts +++ b/src/app/job.service.ts @@ -25,7 +25,7 @@ export class JobService { private service: AppService) { this.observable = new Observable((observer: Observer) => { this.observer = observer; - timer(750, this.configService.getAPIInterval()).subscribe(_ => { + timer(750, this.configService.getAPIPollingInterval()).subscribe(_ => { if (this.httpGETRequest) { this.httpGETRequest.unsubscribe(); } diff --git a/src/app/main-menu/main-menu.component.ts b/src/app/main-menu/main-menu.component.ts index 42548b900..b3dd0e55a 100644 --- a/src/app/main-menu/main-menu.component.ts +++ b/src/app/main-menu/main-menu.component.ts @@ -7,7 +7,7 @@ import { Component, OnInit } from '@angular/core'; }) export class MainMenuComponent implements OnInit { - public settings = true; + public settings = false; public showSettings() { this.settings = true; diff --git a/src/app/notification/notification.component.scss b/src/app/notification/notification.component.scss index 164de7277..7750d87e5 100755 --- a/src/app/notification/notification.component.scss +++ b/src/app/notification/notification.component.scss @@ -12,8 +12,7 @@ border-right: 1vw solid #5a6675; &__show { - // FIXME - // top: 5vh; + top: 5vh; } &__heading { @@ -44,6 +43,10 @@ border-left: 1vw solid #c23616; } + &-warn { + border-left: 1vw solid #fbc531; + } + &-update { border-left: 1vw solid #44bd32; } diff --git a/src/app/notification/notification.service.ts b/src/app/notification/notification.service.ts index 78b121d77..7ae77e4b3 100644 --- a/src/app/notification/notification.service.ts +++ b/src/app/notification/notification.service.ts @@ -33,6 +33,12 @@ export class NotificationService { } } + setWarning(heading: string, text: string) { + if (!this.hideNotifications) { + this.observer.next({ heading, text, type: 'warn' }); + } + } + setUpdate(heading: string, text: string) { this.observer.next({ heading, text, type: 'update' }); } diff --git a/src/app/plugin-service/layer-progress.service.ts b/src/app/plugin-service/layer-progress.service.ts index 024c6d1e5..73e4ed79a 100644 --- a/src/app/plugin-service/layer-progress.service.ts +++ b/src/app/plugin-service/layer-progress.service.ts @@ -16,7 +16,7 @@ export class LayerProgressService { constructor(private configService: ConfigService, private notificationService: NotificationService, private http: HttpClient) { this.observable = new Observable((observer: Observer) => { - timer(1000, this.configService.getAPIInterval()).subscribe(_ => { + timer(1000, this.configService.getAPIPollingInterval()).subscribe(_ => { if (this.httpGETRequest) { this.httpGETRequest.unsubscribe(); } diff --git a/src/app/printer.service.ts b/src/app/printer.service.ts index e330a252d..d68d554a7 100644 --- a/src/app/printer.service.ts +++ b/src/app/printer.service.ts @@ -23,7 +23,7 @@ export class PrinterService { private notificationService: NotificationService, private router: Router) { this.observable = new Observable((observer: Observer) => { - timer(500, this.configService.getAPIInterval()).subscribe(_ => { + timer(500, this.configService.getAPIPollingInterval()).subscribe(_ => { if (this.httpGETRequest) { this.httpGETRequest.unsubscribe(); } diff --git a/src/app/settings/settings.component.html b/src/app/settings/settings.component.html index e6473ef25..ba3a6f846 100644 --- a/src/app/settings/settings.component.html +++ b/src/app/settings/settings.component.html @@ -22,6 +22,7 @@ Made with by /u/UnchartedBull + OctoDash v{{ version }}
@@ -83,6 +84,22 @@ [(ngModel)]="config.filament.density" required> + + + + + + + + + +
@@ -92,11 +109,185 @@ octodash +
+ General + + +
+ + + Use Touchscreen +

+
+ + + Turn screen off while sleeping +

+ Files + + + + + +
+ sort by
+
+ + + Name +

+
+ + + Date +

+
+ + + Size +

+
+ order
+
+ + + Ascending +

+
+ + + Descending +

+
+ Custom Actions +
+ {{ customActionsPosition[number] }} + + + + + + + + + + + +
+ + + + + + + +
+
+ + + Confirm +
+
+
+ + + Return to Home +
+
+

+
plugins +
+ Display Layer Progress +
+ + + enabled +
+ Enclosure +
+ + + enabled +
+ + + + Filament Manager +
+ + + enabled +
+ Preheat Button +
+ + + enabled +
+ Print Time Genius +
+ + + enabled +
+ PSU Control +
+ + + enabled +
+
+ + + Turn on PSU when exiting sleep +
+
diff --git a/src/app/settings/settings.component.scss b/src/app/settings/settings.component.scss index 542aeaa41..75cf04fd2 100644 --- a/src/app/settings/settings.component.scss +++ b/src/app/settings/settings.component.scss @@ -24,6 +24,14 @@ } } + &__version { + font-size: 1.5vw; + display: block; + text-align: center; + margin-top: 1.5vh; + opacity: .3; + } + &__heading { padding: 3vh 0; display: block; @@ -38,6 +46,14 @@ margin-top: 3vh; } + &-3 { + display: block; + font-size: 2.5vw; + font-weight: 500; + margin-bottom: 1.2vh; + margin-top: 2vh; + } + &-back { font-size: 3vw; margin-right: 1vw; @@ -101,6 +117,47 @@ } } + &__checkbox { + position: absolute; + top: 0; + left: 0; + height: 3vw; + width: 3vw; + background-color: transparent; + border: 2px solid #dcdde1; + border-radius: 1vw; + + &-container { + display: inline-block; + position: relative; + user-select: none; + padding-left: 5vw; + height: 4.5vw; + margin-top: 1.4vh; + cursor: pointer; + overflow: visible; + } + + &-checked { + background-color: #2196F3; + width: 1.8vw; + height: 1.8vw; + display: block; + margin-left: .6vw; + margin-top: .6vw; + border-radius: .4vw; + + &-disabled { + background-color: rgba(255, 255, 255, .5) + } + } + + &-descriptor { + font-size: 2.5vw; + vertical-align: 2vh; + } + } + &__close { position: absolute; right: 1.5vw; @@ -141,7 +198,7 @@ &__save { display: block; text-align: center; - margin: 3vh 0 4vh; + margin: 2.5vh 0 4vh; } &__scroll { @@ -160,19 +217,19 @@ padding: 2vh 2vw 2vh 4vw; &-slideout-forward { - animation: slideout-forward .8s ease-out; + animation: slideout-forward .5s ease-out; } &-slidein-forward { - animation: slidein-forward .8s ease-out + animation: slidein-forward .5s ease-out } &-slideout-backward { - animation: slideout-backward .8s ease-out + animation: slideout-backward .5s ease-out } &-slidein-backward { - animation: slidein-backward .8s ease-out + animation: slidein-backward .5s ease-out } &-inactive { @@ -185,6 +242,22 @@ margin: 5vh auto 0; width: 20vw; } + + &__files { + width: 100%; + + & td { + width: 50%; + } + } + + &__custom-action { + &-icon { + font-size: 3.5vw; + vertical-align: -8.5vh; + padding-left: 4vw; + } + } } @keyframes fadein { diff --git a/src/app/settings/settings.component.ts b/src/app/settings/settings.component.ts index 2ae5dd536..6e5b0fe5e 100644 --- a/src/app/settings/settings.component.ts +++ b/src/app/settings/settings.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit, Output, EventEmitter, ViewChild, ElementRef } from '@angular/core'; import { ConfigService, Config } from '../config/config.service'; import { NotificationService } from '../notification/notification.service'; +import { AppService } from '../app.service'; @Component({ selector: 'app-settings', @@ -18,11 +19,22 @@ export class SettingsComponent implements OnInit { public fadeOutAnimation = false; public config: Config; + public customActionsPosition = ['Top Left', 'Top Right', 'Middle Left', 'Middle Right', 'Bottom Left', 'Bottom Right']; + public version: string; + private overwriteNoSave = false; private pages = []; - public constructor(private configService: ConfigService, private notificationService: NotificationService) { - this.config = configService.getCurrentConfig(); + public constructor(private configService: ConfigService, private notificationService: NotificationService, private service: AppService) { + this.config = this.configService.getCurrentConfig(); this.config = this.configService.revertConfigForInput(this.config); + this.getVersion(); + } + + private getVersion() { + this.version = this.service.getVersion(); + if (this.version === undefined) { + setTimeout(this.getVersion.bind(this), 3500); + } } public ngOnInit(): void { @@ -37,11 +49,16 @@ export class SettingsComponent implements OnInit { } public hideSettings(): void { - this.fadeOutAnimation = true; - this.closeFunction.emit(); - setTimeout(() => { - this.fadeOutAnimation = false; - }, 800); + if (this.configService.isEqualToCurrentConfig(this.configService.createConfigFromInput(this.config)) || this.overwriteNoSave) { + this.fadeOutAnimation = true; + this.closeFunction.emit(); + setTimeout(() => { + this.fadeOutAnimation = false; + }, 800); + } else { + this.notificationService.setWarning('Configuration not saved!', 'You haven\'t saved your config yet, so your changes will not be applied. Click close again if you want to discard your changes!'); + this.overwriteNoSave = true; + } } public changePage(page: number, current: number, direction: 'forward' | 'backward'): void { @@ -53,15 +70,16 @@ export class SettingsComponent implements OnInit { this.pages[current].classList.add('settings__content-inactive'); this.pages[current].classList.remove('settings__content-slideout-' + direction); this.pages[page].classList.remove('settings__content-slidein-' + direction); - }, 750); + }, 470); } public updateConfig(): void { - this.config = this.configService.createConfigFromInput(this.config); - if (!this.configService.validateGiven(this.config)) { + const config = this.configService.createConfigFromInput(this.config); + if (!this.configService.validateGiven(config)) { this.notificationService.setError('Config is invalid!', this.configService.getErrors().toString()); } - this.configService.saveConfig(this.config); + this.configService.saveConfig(config); + this.overwriteNoSave = true; this.hideSettings(); this.configService.updateConfig(); window.location.reload(); diff --git a/src/app/standby/standby.component.ts b/src/app/standby/standby.component.ts index 4c73fc0d2..4360fb518 100644 --- a/src/app/standby/standby.component.ts +++ b/src/app/standby/standby.component.ts @@ -33,7 +33,7 @@ export class StandbyComponent implements OnInit { reconnect() { this.connecting = true; - if (this.configService.isPSUControlEnabled()) { + if (this.configService.turnOnPSUWhenExitingSleep()) { this.psuControlService.changePSUState(true); } this.http.get(this.configService.getURL('connection'), this.configService.getHTTPHeaders()) diff --git a/src/styles.scss b/src/styles.scss index 594dea164..fd8c1dc1c 100755 --- a/src/styles.scss +++ b/src/styles.scss @@ -132,7 +132,6 @@ app-root { } .splash-screen { - &__icon { height: 50vh; margin-top: 20vh; @@ -153,7 +152,6 @@ app-root { text-align: justify; font-size: 3vw; } - } ::-webkit-scrollbar {