From db33bc65ace73fcfb4c04f2fa8ee16b539a7e831 Mon Sep 17 00:00:00 2001 From: SDCore Date: Sat, 19 Sep 2026 16:21:38 -0500 Subject: [PATCH] Time Changes --- src/app/todo/daily.json | 42 ++++++----------- src/app/todo/page.js | 88 +++++++++++++++++++++++++++++------- src/app/todo/todo.module.css | 45 ++++++++++++------ 3 files changed, 117 insertions(+), 58 deletions(-) diff --git a/src/app/todo/daily.json b/src/app/todo/daily.json index 581ea3c..d5e358b 100644 --- a/src/app/todo/daily.json +++ b/src/app/todo/daily.json @@ -4,64 +4,50 @@ "title": "Opening Checklist", "desc": "Complete the opening checklist to ensure all equipment is operational and ready for the day.", "type": "3", - "timeStart": "07", - "timeEnd": "09", - "textStart": "7 AM", - "textEnd": "9 AM" + "timeStart": "07:30", + "timeEnd": "09:00" }, { "title": "Daily Maintenance Checklist", "desc": "Perform daily maintenance tasks to keep equipment running smoothly.", "type": "3", - "timeStart": "07", - "timeEnd": "19", - "textStart": "7 AM", - "textEnd": "7 PM" + "timeStart": "07:30", + "timeEnd": "19:30" }, { "title": "Site Inspection Checklist", "desc": "Conduct a thorough inspection of the site to identify any potential issues.", "type": "4", - "timeStart": "10", - "timeEnd": "12", - "textStart": "10 AM", - "textEnd": "12 PM" + "timeStart": "10:00", + "timeEnd": "12:00" }, { "title": "Site Inspection Checklist", "desc": "Conduct a thorough inspection of the site to identify any potential issues.", "type": "4", - "timeStart": "12", - "timeEnd": "14", - "textStart": "12 PM", - "textEnd": "2 PM" + "timeStart": "12:00", + "timeEnd": "14:00" }, { "title": "Site Inspection Checklist", "desc": "Conduct a thorough inspection of the site to identify any potential issues.", "type": "4", - "timeStart": "14", - "timeEnd": "16", - "textStart": "2 PM", - "textEnd": "4 PM" + "timeStart": "14:00", + "timeEnd": "16:00" }, { "title": "Site Inspection Checklist", "desc": "Conduct a thorough inspection of the site to identify any potential issues.", "type": "4", - "timeStart": "16", - "timeEnd": "18", - "textStart": "4 PM", - "textEnd": "6 PM" + "timeStart": "16:00", + "timeEnd": "18:00" }, { "title": "Closing Checklist", "desc": "Complete the closing checklist to ensure all equipment is properly shut down for the day and ready for tomorrow.", "type": "3", - "timeStart": "18", - "timeEnd": "20", - "textStart": "6 PM", - "textEnd": "8 PM" + "timeStart": "18:00", + "timeEnd": "20:00" } ] } diff --git a/src/app/todo/page.js b/src/app/todo/page.js index f6b4dbe..bdf5707 100644 --- a/src/app/todo/page.js +++ b/src/app/todo/page.js @@ -93,16 +93,25 @@ export default function WeatherPage() { const [dailyItems, setDailyItems] = useState([]); useEffect(() => { + const timeToMinutes = (time) => { + const [hours, minutes] = time.split(":").map(Number); + return hours * 60 + minutes; + }; + const updateDailyItems = () => { const now = new Date(); - const currentHour = now.getHours(); + + const currentMinutes = now.getHours() * 60 + now.getMinutes(); const filteredItems = List?.List?.filter((item) => { - const timeStart = parseInt(item.timeStart); - const timeEnd = parseInt(item.timeEnd); + const startMinutes = timeToMinutes(item.timeStart); + const endMinutes = timeToMinutes(item.timeEnd); - return currentHour >= timeStart && currentHour < timeEnd; + return ( + currentMinutes >= startMinutes && + currentMinutes < endMinutes + ); }) || []; setDailyItems( @@ -128,6 +137,48 @@ export default function WeatherPage() { return () => clearInterval(interval); }, [List]); + // show the percentage of time between timeStart and timeEnd for each of the daily tasks and update it automatically ocne a second. show the decimal places up to 5 decimals + const getTaskProgress = (item) => { + if (!item.timeStart || !item.timeEnd) return 0; + + const [startHour, startMinute] = item.timeStart.split(":").map(Number); + + const [endHour, endMinute] = item.timeEnd.split(":").map(Number); + + const now = new Date(); + + const start = new Date(now); + start.setHours(startHour, startMinute, 0, 0); + + const end = new Date(now); + end.setHours(endHour, endMinute, 0, 0); + + const current = now.getTime(); + const startTime = start.getTime(); + const endTime = end.getTime(); + + const total = endTime - startTime; + const elapsed = current - startTime; + + if (total <= 0) return 0; + + return Math.min(Math.max(elapsed / total, 0), 1) * 100; + }; + + const formatTime = (time) => { + if (!time || time === "--") return "--"; + + const [hours, minutes] = time.split(":").map(Number); + + const date = new Date(); + date.setHours(hours, minutes, 0, 0); + + return date.toLocaleTimeString([], { + hour: "numeric", + minute: "2-digit", + }); + }; + const weatherAlerts = weather?.alerts || []; const futureForecasts = weather?.daily?.data.slice(1, 4) || []; @@ -156,25 +207,28 @@ export default function WeatherPage() { {dailyItems?.map((item, index) => ( - {item.title} + {item.title} + + + {formatTime(item.timeStart)} -{" "} + {formatTime(item.timeEnd)} + + {item.desc} - - {item.textStart && item.textEnd ? ( - <> - {item.textStart} - {item.textEnd} - - ) : ( - <> - {item.timeStart}:00 - {item.timeEnd} - :00 - - )} + + + - )) || "Test"} + ))} diff --git a/src/app/todo/todo.module.css b/src/app/todo/todo.module.css index 2a7de6a..1c0ace5 100644 --- a/src/app/todo/todo.module.css +++ b/src/app/todo/todo.module.css @@ -79,8 +79,8 @@ .lists { flex: 1 1 100%; border-radius: 10px; - background: #17171b; - border: 1px solid rgba(200, 200, 200, 0.2); + /* background: #17171b; */ + /* border: 1px solid rgba(200, 200, 200, 0.2); */ .listHeader { margin: 5px; @@ -104,12 +104,23 @@ .listItemTitle { width: 100%; - display: block; + display: flex; + align-items: center; + justify-content: space-between; font-size: 16pt; font-weight: bold; margin: 0 0 5px 0; color: rgba(255, 255, 255, 0.95); border-bottom: 1px solid rgba(200, 200, 200, 0.2); + padding-bottom: 5px; + + .listItemTime { + font-size: 8pt; + font-weight: normal; + white-space: nowrap; + color: rgba(255, 255, 255, 0.65); + margin-left: 10px; + } } .listItemDesc { @@ -121,16 +132,6 @@ color: rgba(255, 255, 255, 0.75); } - .listItemTime { - width: 100%; - font-size: 8pt; - display: block; - text-align: right; - padding: 5px 0 0 0; - color: rgba(255, 255, 255, 0.8); - border-top: 1px solid rgba(200, 200, 200, 0.075); - } - &:last-child { border-radius: 2px 2px 5px 5px; } @@ -138,6 +139,24 @@ } } +.listItemProgress { + display: block; + width: 100%; + height: 6px; + margin-top: 8px; + background: #333; + border-radius: 999px; + overflow: hidden; +} + +.listItemProgressBar { + display: block; + height: 100%; + background: #4caf50; + border-radius: 999px; + transition: width 0.5s linear; +} + .weatherContainer { flex: 1 1 30%; margin: 0 0 0 5px;