diff options
Diffstat (limited to 'frontend/status')
| -rw-r--r-- | frontend/status/index.html | 132 |
1 files changed, 132 insertions, 0 deletions
diff --git a/frontend/status/index.html b/frontend/status/index.html new file mode 100644 index 0000000..46c50ed --- /dev/null +++ b/frontend/status/index.html @@ -0,0 +1,132 @@ +<!doctype html> +<html lang="en"> + <head> + <meta charset="UTF-8" /> + <link rel="stylesheet" href="/style.css"> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <link rel="manifest" href="/manifest.json" /> + <title>LaundryWeb</title> + </head> + <body> + <style> + .machine-container > div > img { + padding: 6px; + } + </style> + <div class="section-container row bg-1" style="height: 164px;"> + <span id="logo"><span id="icon"></span>LaundryWeb</span> + <span id="logo-id">H?</span> + </div> + <div class="section-container row bg-2" style="padding: 8px; gap: 8px;"> + <button class="button button-tab bg-3" onclick="window.location.href = '/timer/'">Timer</button> + <button class="button button-tab bg-3" disabled>Status</button> + </div> + <div class="section-container row bg-red" id="notif-panel"> + <div class="flex-center-container"> + <span class="icon">🔔</span> + </div> + <div> + <span>Please allow this website to send you notifications to remind you about your laundry. That's like, the whole point of this website.</span> + <button id="notbtn" class="button bg-redder">Enable Required Permissions</button> + </div> + </div> + <div class="section-container no-pad"> + <h1 id="status-title">Machine Status for H?</h1> + <div class="machine-container"> + <div class="txtcol-dryer" id="dryer1"> + <span>Dryer 1</span> + <img src="/assets/img/dryer_off.png" alt="" id="dryer1-img"> + <span id="dryer1-span"></span> + </div> + <div class="txtcol-washer" id="washer1"> + <span>Washer 1</span> + <img src="/assets/img/washer_off.png" alt="" id="washer1-img"> + <span id="washer1-span"></span> + </div> + <div class="txtcol-dryer" id="dryer2"> + <span>Dryer 2</span> + <img src="/assets/img/dryer_off.png" alt="" id="dryer2-img"> + <span id="dryer2-span"></span> + </div> + <div class="txtcol-washer" id="washer2"> + <span>Washer 2</span> + <img src="/assets/img/washer_off.png" alt="" id="washer2-img"> + <span id="washer2-span"></span> + </div> + </div> + </div> + <div class="section-container no-pad"> + <h1>Dryer 1</h1> + <div class="flex-container row"> + <div class="flex-center-container"> + <img id="detail-d1-img" src="/assets/img/dryer_off.png" alt="" style="width: 100px;"> + </div> + <div class="flex flex-center-container-jus col"> + <span class="big-text" id="detail-d1-title">Idle</span> + <span id="detail-d1-desc"></span> + </div> + </div> + </div> + <div class="section-container no-pad"> + <h1>Washer 1</h1> + <div class="flex-container row"> + <div class="flex-center-container"> + <img id="detail-w1-img" src="/assets/img/washer_off.png" alt="" style="width: 100px;"> + </div> + <div class="flex flex-center-container-jus col"> + <span class="big-text" id="detail-w1-title">Idle</span> + <span id="detail-w1-desc"></span> + </div> + </div> + </div> + <div class="section-container no-pad"> + <h1>Dryer 2</h1> + <div class="flex-container row"> + <div class="flex-center-container"> + <img id="detail-d2-img" src="/assets/img/dryer_off.png" alt="" style="width: 100px;"> + </div> + <div class="flex flex-center-container-jus col"> + <span class="big-text" id="detail-d2-title">Idle</span> + <span id="detail-d2-desc"></span> + </div> + </div> + </div> + <div class="section-container no-pad"> + <h1>Washer 2</h1> + <div class="flex-container row"> + <div class="flex-center-container"> + <img id="detail-w2-img" src="/assets/img/washer_off.png" alt="" style="width: 100px;"> + </div> + <div class="flex flex-center-container-jus col"> + <span class="big-text" id="detail-w2-title">Idle</span> + <span id="detail-w2-desc"></span> + </div> + </div> + </div> + <div class="master-popup-container" id="popup-master"> + <div class="popup-container"> + <h1 style="text-align: center;">Initial Setup for iOS</h1> + <p>To allow notifications on your iOS device, you’ll need to install this website as a web app.</p> + <hr> + <p><b>Step 1:</b> Press ... (if using iOS 26) → <b>Share</b></p> + <img src="/assets/img/step1.png" alt=""> + <p><b>Step 2:</b> Scroll down → Select <b>Add to Home Screen</b></p> + <img src="/assets/img/step2.png" alt=""> + <p><b>Step 3:</b> Press <b>Add</b>. If you're using iOS 26+, ensure Open as Web App is enabled.</p> + <img src="/assets/img/step3.png" alt=""> + <p><b>Step 4:</b> Go to your home screen → Reopen this page by <b>pressing</b> the <b>LaundryWeb app</b>.</p> + <img src="/assets/img/step4.png" alt="" style="height: 72px; margin-bottom: 32px;"> + </div> + <button id="close-popup"></button> + </div> + <div class="section-container credits-container"> + <span>Developed by <a href="https://altafcreator.com">Athaalaa Altaf Hafidz</a>, a fellow resident • <a href="https://git.altafcreator.com/victoriahall-laundryweb.git/">Source Code</a></span> + </div> + <a href="mailto:dev@altafcreator.com" class="feedback"><span>✉️ Bugs? Feedback?</span></a> + <script src="/main.js"></script> + <script src="/status.js"></script> + <script src="/permissionrequest.js"></script> + <script src="/popup.js"></script> + <script src="/ios_popup.js"></script> + </body> +</html> |