From be49744444fe737595c2609b1571b2d811b26e1b Mon Sep 17 00:00:00 2001 From: LilleBRG Date: Wed, 19 Mar 2025 13:16:57 +0100 Subject: [PATCH] frontend files made, linechart added --- frontend/home/home.html | 11 ------- .../mockdata/temperature-logs.mockdata.js | 28 +++++++++++++++++ frontend/pages/home/home.css | 28 +++++++++++++++++ frontend/pages/home/home.html | 21 +++++++++++++ frontend/pages/home/home.js | 30 +++++++++++++++++++ .../{home/home.css => pages/login/login.css} | 0 .../{home/home.js => pages/login/login.html} | 0 frontend/pages/login/login.js | 0 frontend/pages/profile/profile.css | 0 frontend/pages/profile/profile.html | 0 frontend/pages/profile/profile.js | 0 frontend/pages/register/register.css | 0 frontend/pages/register/register.html | 0 frontend/pages/register/register.js | 0 14 files changed, 107 insertions(+), 11 deletions(-) delete mode 100644 frontend/home/home.html create mode 100644 frontend/mockdata/temperature-logs.mockdata.js create mode 100644 frontend/pages/home/home.css create mode 100644 frontend/pages/home/home.html create mode 100644 frontend/pages/home/home.js rename frontend/{home/home.css => pages/login/login.css} (100%) rename frontend/{home/home.js => pages/login/login.html} (100%) create mode 100644 frontend/pages/login/login.js create mode 100644 frontend/pages/profile/profile.css create mode 100644 frontend/pages/profile/profile.html create mode 100644 frontend/pages/profile/profile.js create mode 100644 frontend/pages/register/register.css create mode 100644 frontend/pages/register/register.html create mode 100644 frontend/pages/register/register.js diff --git a/frontend/home/home.html b/frontend/home/home.html deleted file mode 100644 index 0cec106..0000000 --- a/frontend/home/home.html +++ /dev/null @@ -1,11 +0,0 @@ - - - - - - Temperature-Alarm-Web - - -

hello

- - \ No newline at end of file diff --git a/frontend/mockdata/temperature-logs.mockdata.js b/frontend/mockdata/temperature-logs.mockdata.js new file mode 100644 index 0000000..eaef375 --- /dev/null +++ b/frontend/mockdata/temperature-logs.mockdata.js @@ -0,0 +1,28 @@ +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 }, +]; diff --git a/frontend/pages/home/home.css b/frontend/pages/home/home.css new file mode 100644 index 0000000..1f47ee0 --- /dev/null +++ b/frontend/pages/home/home.css @@ -0,0 +1,28 @@ +body { + margin: 0; + font-family: Arial, Helvetica, sans-serif; + } + + .topnav { + overflow: hidden; + background-color: #333; + } + + .topnav a { + float: left; + color: #f2f2f2; + text-align: center; + padding: 14px 16px; + text-decoration: none; + font-size: 17px; + } + + .topnav a:hover { + background-color: #ddd; + color: black; + } + + .topnav a.active { + background-color: #04AA6D; + color: white; + } \ No newline at end of file diff --git a/frontend/pages/home/home.html b/frontend/pages/home/home.html new file mode 100644 index 0000000..f06efff --- /dev/null +++ b/frontend/pages/home/home.html @@ -0,0 +1,21 @@ + + + + + + Temperature-Alarm-Web + + + +
+ Home + News + Contact + About +
+ + + + + + \ No newline at end of file diff --git a/frontend/pages/home/home.js b/frontend/pages/home/home.js new file mode 100644 index 0000000..6f739c7 --- /dev/null +++ b/frontend/pages/home/home.js @@ -0,0 +1,30 @@ +import { mockTemperatureLogs } from "../../mockdata/temperature-logs.mockdata.js"; // Import data + +const xValues = mockTemperatureLogs.map(log => new Date(log.Date).toLocaleString()); // Full Date labels +const yValues = mockTemperatureLogs.map(log => log.Temperature); // Temperature values + +new Chart("myChart", { + type: "line", + data: { + labels: xValues, + datasets: [{ + fill: false, + lineTension: 0.4, + backgroundColor: "rgba(0,0,255,1.0)", + borderColor: "rgba(0,0,255,0.1)", + data: yValues + }] + }, + options: { + tooltips: { + callbacks: { + title: function(tooltipItem) { + return `Date: ${tooltipItem[0].label}`; + }, + label: function(tooltipItem) { + return `Temperature: ${tooltipItem.value}°C`; + }, + } + } + } +}); diff --git a/frontend/home/home.css b/frontend/pages/login/login.css similarity index 100% rename from frontend/home/home.css rename to frontend/pages/login/login.css diff --git a/frontend/home/home.js b/frontend/pages/login/login.html similarity index 100% rename from frontend/home/home.js rename to frontend/pages/login/login.html diff --git a/frontend/pages/login/login.js b/frontend/pages/login/login.js new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/profile/profile.css b/frontend/pages/profile/profile.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/profile/profile.html b/frontend/pages/profile/profile.html new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/profile/profile.js b/frontend/pages/profile/profile.js new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/register/register.css b/frontend/pages/register/register.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/register/register.html b/frontend/pages/register/register.html new file mode 100644 index 0000000..e69de29 diff --git a/frontend/pages/register/register.js b/frontend/pages/register/register.js new file mode 100644 index 0000000..e69de29