ReiMerc/temperature-alarm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Show real temperature data in frontend

Browse Source
This commit is contained in:
Reimar 2025-03-31 09:29:55 +02:00
parent f6e2c8f450
commit dd2a3cf150
Signed by: Reimar
GPG Key ID: 93549FA07F0AE268
4 changed files with 15 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/mockdata/temperature-logs.mockdata.js
View File

@ -1,28 +0,0 @@
export const mockTemperatureLogs = [
{ id: 1, temperature: 18.9, date: "2025-03-19T17:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.1, date: "2025-03-19T17:10:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.5, date: "2025-03-19T17:20:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.8, date: "2025-03-19T17:30:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.1, date: "2025-03-19T17:40:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.3, date: "2025-03-19T17:50:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.6, date: "2025-03-19T18:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.9, date: "2025-03-19T18:10:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.8, date: "2025-03-19T18:20:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.7, date: "2025-03-19T18:30:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.5, date: "2025-03-19T18:40:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.3, date: "2025-03-19T18:50:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.1, date: "2025-03-19T19:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 18.9, date: "2025-03-19T20:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.1, date: "2025-03-19T20:10:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.5, date: "2025-03-19T20:20:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 19.8, date: "2025-03-19T20:30:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.1, date: "2025-03-19T20:40:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 20.3, date: "2025-03-19T20:50:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 22.6, date: "2025-03-19T21:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 22.9, date: "2025-03-19T21:10:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 22.8, date: "2025-03-19T21:20:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 22.7, date: "2025-03-19T21:30:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 22.5, date: "2025-03-19T21:40:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 23.3, date: "2025-03-19T21:50:00Z", tempHigh: 22.0, tempLow: 18.0 },
{ id: 1, temperature: 24.1, date: "2025-03-19T22:00:00Z", tempHigh: 22.0, tempLow: 18.0 },
]

8
frontend/scripts/home.js
View File

@ -1,14 +1,14 @@
import { mockTemperatureLogs } from "../mockdata/temperature-logs.mockdata.js"; // Import data
import { getLogsOnDeviceId } from "./services/devices.service.js"; import { getLogsOnDeviceId } from "./services/devices.service.js";
async function buildChart() { async function buildChart() {
// TODO change device id
const data = await getLogsOnDeviceId(1); const data = await getLogsOnDeviceId(1);
const xValues = mockTemperatureLogs.map((log) => const xValues = data.map((log) =>
new Date(log.date).toLocaleString() new Date(log.date).toLocaleString()
); // Full Date labels ); // Full Date labels
const yValues = mockTemperatureLogs.map((log) => log.temperature); // Temperature values const yValues = data.map((log) => log.temperature); // Temperature values
buildTable(mockTemperatureLogs); buildTable(data);
new Chart("myChart", { new Chart("myChart", {
type: "line", type: "line",
data: { data: {

11
frontend/scripts/services/devices.service.js
View File

@ -1,4 +1,5 @@
import { address } from "../../shared/constants.js"; import { address } from "../../shared/constants.js";
import { request } from "../../shared/utils.js";
export function getDevicesOnUserId(id) { export function getDevicesOnUserId(id) {
fetch(`${address}/get-on-user-id`, { fetch(`${address}/get-on-user-id`, {
@ -27,13 +28,5 @@ export function update(ids) {
} }
export function getLogsOnDeviceId(id) { export function getLogsOnDeviceId(id) {
fetch(`${address}/device/logs/${id}`, { return request("GET", `/device/logs/${id}`);
method: "GET",
headers: {
"Content-Type": "application/json"
},
})
.then(response => response.json())
.then(data => console.log("Success:", data))
.catch(error => console.error("Error:", error));
} }

16
frontend/shared/utils.js
View File

@ -13,17 +13,19 @@ export async function request(method, path, body = null) {
body: body ? JSON.stringify(body) : undefined, body: body ? JSON.stringify(body) : undefined,
}) })
.then(async response => { .then(async response => {
const json = await response.json(); try {
const json = await response.json();
if (response.ok) return resolve(json); if (response.ok) return resolve(json);
if (json.error) return reject(json.error); if (json.error) return reject(json.error);
if (json.message) return reject(json.message); if (json.message) return reject(json.message);
if (json.errors) return reject(Object.values(response.errors)[0][0]); if (json.errors) return reject(Object.values(json.errors)[0][0]);
} finally {
reject("Request failed with HTTP code " + response.status); reject("Request failed with HTTP code " + response.status);
}
}) })
.catch(err => reject(err.message)); .catch(err => reject(err.message));
}); });