From 88f04f1ad2cef09c588644d8279a7569a82a168d Mon Sep 17 00:00:00 2001 From: albaintor <118518828+albaintor@users.noreply.github.com> Date: Sun, 24 Nov 2024 10:19:04 +0100 Subject: [PATCH] Improved responsive mode and added version info --- package.json | 2 +- server/package.json | 2 +- .../remote-browser.component.html | 5 +- .../remote-browser.component.ts | 3 + .../remote-widget.component.html | 88 ++++++++++++++++--- .../remote-widget/remote-widget.component.ts | 16 +++- src/environment.ts | 5 ++ 7 files changed, 103 insertions(+), 18 deletions(-) create mode 100644 src/environment.ts diff --git a/package.json b/package.json index 487356b..fd6a8bd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ucr-tool", - "version": "2.4.2", + "version": "2.4.3", "scripts": { "ng": "ng", "start": "ng serve --host 0.0.0.0", diff --git a/server/package.json b/server/package.json index 90bde9a..6e02bda 100644 --- a/server/package.json +++ b/server/package.json @@ -1,7 +1,7 @@ { "name": "server", "type": "module", - "version": "2.4.2", + "version": "2.4.3", "main": "app.js", "scripts": { "start": "node app.js" diff --git a/src/app/remote-browser/remote-browser.component.html b/src/app/remote-browser/remote-browser.component.html index 00d85e5..82a2129 100644 --- a/src/app/remote-browser/remote-browser.component.html +++ b/src/app/remote-browser/remote-browser.component.html @@ -1,6 +1,9 @@ -

  Unfolded Circle remote configuration toolkit

+
+

  Unfolded Circle remote configuration toolkit

+
Version {{environment.appVersion}}
+
+ + +
- - + +
+ + +
+ + + + + +
+
+ +
+
+ +
+
+
{{remoteState!.batteryInfo!.capacity!}}%
+
+
+
+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + +
+ + +
+ + + {{websocketService.getEntityName(mediaEntity)}} + + + {{websocketService.getEntityName(item)}} + + -
+ - + diff --git a/src/app/remote-widget/remote-widget.component.ts b/src/app/remote-widget/remote-widget.component.ts index 88dd821..b0ccf0b 100644 --- a/src/app/remote-widget/remote-widget.component.ts +++ b/src/app/remote-widget/remote-widget.component.ts @@ -23,6 +23,7 @@ import {WebsocketService} from "../websocket/websocket.service"; import {ToastModule} from "primeng/toast"; import {MessageService} from "primeng/api"; import {MediaEntityState, RemoteState, SoftwareUpdate} from "../websocket/remote-websocket-instance"; +import {BreakpointObserver, Breakpoints} from "@angular/cdk/layout"; interface WidgetConfiguration { minimized: boolean; @@ -64,9 +65,11 @@ export class RemoteWidgetComponent implements OnInit { activities: Activity[] = []; protected readonly Math = Math; softwareUpdate: SoftwareUpdate | undefined; + smallSizeMode = false; constructor(private server:ServerService, protected websocketService: WebsocketService, private cdr:ChangeDetectorRef, - private messageService: MessageService,) { } + private messageService: MessageService, + private responsive: BreakpointObserver) { } ngOnInit(): void { const data = localStorage.getItem("remote-widget"); @@ -102,7 +105,16 @@ export class RemoteWidgetComponent implements OnInit { }) this.loadActivities(); this.cdr.detectChanges(); - }) + }); + this.responsive.observe([ + Breakpoints.HandsetLandscape, + Breakpoints.HandsetPortrait, + Breakpoints.TabletPortrait + ]) + .subscribe(result => { + this.smallSizeMode = result.matches; + this.cdr.detectChanges(); + }); } loadActivities() diff --git a/src/environment.ts b/src/environment.ts new file mode 100644 index 0000000..98ef423 --- /dev/null +++ b/src/environment.ts @@ -0,0 +1,5 @@ +declare const require: any; + +export const environment = { + appVersion: require('../package.json').version, +};