gilles/scrutiny
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add setting to change temperature between C and F.

Browse Source 
fixes #175
This commit is contained in:
Jason Kulatunga
2022-05-26 13:04:15 -07:00
parent d1376a2200
commit 21212c0a1d
10 changed files with 88 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webapp/frontend/src/app/core/config/app.config.ts
+3
View File
@@ -16,6 +16,7 @@ export interface AppConfig
dashboardDisplay: string;
dashboardSort: string;
temperatureUnit: string;
}
/**
@@ -32,5 +33,7 @@ export const appConfig: AppConfig = {
dashboardDisplay: "name",
dashboardSort: "status",
temperatureUnit: "celsius",
};
webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html
+1 -1
View File
@@ -51,7 +51,7 @@
</div>
<div class="flex flex-col mx-6 my-3 xs:w-full">
<div class="font-semibold text-xs text-hint uppercase tracking-wider leading-none">Temperature</div>
<div class="mt-2 font-medium text-3xl leading-none" *ngIf="deviceSummary.smart?.collector_date; else unknownTemp">{{ deviceSummary.smart?.temp }}°C</div>
<div class="mt-2 font-medium text-3xl leading-none" *ngIf="deviceSummary.smart?.collector_date; else unknownTemp">{{ deviceSummary.smart?.temp | temperature:config.temperatureUnit:true }}</div>
<ng-template #unknownTemp><div class="mt-2 font-medium text-3xl leading-none">--</div></ng-template>
</div>
<div class="flex flex-col mx-6 my-3 xs:w-full">
webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.html
+11
View File
@@ -23,6 +23,17 @@
</mat-form-field>
</div>
<div class="flex flex-col mt-5 gt-md:flex-row">
<mat-form-field class="flex-auto gt-xs:pr-3 gt-md:pr-3">
<mat-label>Temperature Display Unit</mat-label>
<mat-select [(ngModel)]="temperatureUnit">
<mat-option value="celsius">Celsius</mat-option>
<mat-option value="fahrenheit">Fahrenheit</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="flex">
<mat-tab-group mat-align-tabs="start">
<mat-tab label="Ata">
webapp/frontend/src/app/layout/common/dashboard-settings/dashboard-settings.component.ts
+6 -4
View File
@@ -13,6 +13,7 @@ export class DashboardSettingsComponent implements OnInit {
dashboardDisplay: string;
dashboardSort: string;
temperatureUnit: string
// Private
private _unsubscribeAll: Subject<any>;
@@ -33,20 +34,21 @@ export class DashboardSettingsComponent implements OnInit {
// Store the config
this.dashboardDisplay = config.dashboardDisplay;
this.dashboardSort = config.dashboardSort;
this.temperatureUnit = config.temperatureUnit;
});
}
saveSettings(): void {
var newSettings = {
const newSettings = {
dashboardDisplay: this.dashboardDisplay,
dashboardSort: this.dashboardSort
dashboardSort: this.dashboardSort,
temperatureUnit: this.temperatureUnit,
}
this._configService.config = newSettings
console.log(`Saved Settings: ${JSON.stringify(newSettings)}`)
}
formatLabel(value: number) {
formatLabel(value: number): number {
return value;
}
}
webapp/frontend/src/app/modules/dashboard/dashboard.component.ts
+3 -2
View File
@@ -11,6 +11,7 @@ import {deviceDisplayTitle} from "app/layout/common/dashboard-device/dashboard-d
import {AppConfig} from "app/core/config/app.config";
import {TreoConfigService} from "@treo/services/config";
import {Router} from "@angular/router";
import {TemperaturePipe} from "../../shared/temperature.pipe";
@Component({
selector : 'example',
@@ -150,7 +151,7 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
let newDate = new Date(tempHistory.date);
deviceSeriesMetadata.data.push({
x: newDate,
y: tempHistory.temp
y: TemperaturePipe.formatTemperature(tempHistory.temp, this.config.temperatureUnit, false)
})
}
deviceTemperatureSeries.push(deviceSeriesMetadata)
@@ -200,7 +201,7 @@ export class DashboardComponent implements OnInit, AfterViewInit, OnDestroy
},
y : {
formatter: (value) => {
return value + '°C';
return TemperaturePipe.formatTemperature(value, this.config.temperatureUnit, true);
}
}
},
webapp/frontend/src/app/modules/detail/detail.component.html
+1 -1
View File
@@ -119,7 +119,7 @@
<div class="text-secondary text-md">Powered On</div>
</div>
<div class="my-2 col-span-2 lt-md:col-span-1">
<div>{{smart_results[0]?.temp}}°C</div>
<div>{{smart_results[0]?.temp | temperature:config.temperatureUnit:true}}</div>
<div class="text-secondary text-md">Temperature</div>
</div>
</div>
webapp/frontend/src/app/modules/detail/detail.component.ts
+15 -1
View File
@@ -9,6 +9,8 @@ import {fadeOut} from "../../../@treo/animations/fade";
import {DetailSettingsComponent} from "app/layout/common/detail-settings/detail-settings.component";
import {MatDialog} from "@angular/material/dialog";
import humanizeDuration from 'humanize-duration';
import {TreoConfigService} from "../../../@treo/services/config";
import {AppConfig} from "../../core/config/app.config";
@Component({
selector: 'detail',
@@ -18,6 +20,8 @@ import humanizeDuration from 'humanize-duration';
export class DetailComponent implements OnInit, AfterViewInit, OnDestroy {
config: AppConfig;
onlyCritical: boolean = true;
// data: any;
@@ -43,7 +47,9 @@ export class DetailComponent implements OnInit, AfterViewInit, OnDestroy {
*/
constructor(
private _detailService: DetailService,
public dialog: MatDialog
public dialog: MatDialog,
private _configService: TreoConfigService,
)
{
@@ -65,6 +71,14 @@ export class DetailComponent implements OnInit, AfterViewInit, OnDestroy {
*/
ngOnInit(): void
{
// Subscribe to config changes
this._configService.config$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((config: AppConfig) => {
this.config = config;
});
// Get the data
this._detailService.data$
.pipe(takeUntil(this._unsubscribeAll))
webapp/frontend/src/app/shared/shared.module.ts
+6 -3
View File
@@ -1,13 +1,15 @@
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import {FileSizePipe} from "./file-size.pipe";
import {FileSizePipe} from './file-size.pipe';
import { DeviceSortPipe } from './device-sort.pipe';
import { TemperaturePipe } from './temperature.pipe';
@NgModule({
declarations: [
FileSizePipe,
DeviceSortPipe
DeviceSortPipe,
TemperaturePipe
],
imports: [
CommonModule,
@@ -19,7 +21,8 @@ import { DeviceSortPipe } from './device-sort.pipe';
FormsModule,
ReactiveFormsModule,
FileSizePipe,
DeviceSortPipe
DeviceSortPipe,
TemperaturePipe
]
})
export class SharedModule
webapp/frontend/src/app/shared/temperature.pipe.spec.ts
+8
View File
@@ -0,0 +1,8 @@
import { TemperaturePipe } from './temperature.pipe';
describe('TemperaturePipe', () => {
it('create an instance', () => {
const pipe = new TemperaturePipe();
expect(pipe).toBeTruthy();
});
});
webapp/frontend/src/app/shared/temperature.pipe.ts
+34
View File
@@ -0,0 +1,34 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'temperature'
})
export class TemperaturePipe implements PipeTransform {
static celsiusToFahrenheit(celsiusTemp: number): number {
return celsiusTemp * 9.0 / 5.0 + 32;
}
static formatTemperature(celsiusTemp: number, unit: string, includeUnits: boolean): unknown {
let convertedTemp
let convertedUnitSuffix
switch (unit) {
case 'celsius':
convertedTemp = celsiusTemp
convertedUnitSuffix = '°C'
break
case 'fahrenheit':
convertedTemp = TemperaturePipe.celsiusToFahrenheit(celsiusTemp)
convertedUnitSuffix = '°F'
break
}
if(includeUnits){
return convertedTemp + convertedUnitSuffix
} else {
return convertedTemp
}
}
transform(celsiusTemp: number, unit = 'celsius', includeUnits = false): unknown {
return TemperaturePipe.formatTemperature(celsiusTemp, unit, includeUnits)
}
}