add setting to change temperature between C and F.

fixes #175

webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html

@@ -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

@@ -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

@@ -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;
     }
 }