Initialize

2025-10-24 22:07:49 +08:00
commit 233f3fe40e
13 changed files with 1580 additions and 0 deletions
--- a/templates/index.html
+++ b/templates/index.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>登入 | TutorOTP</title>
+    <style>
+        body {
+            font-family: sans-serif; padding: 1.5rem; font-size: 1.2rem;
+        }
+        a, button {
+            font-size: 1.1rem;
+        }
+    </style>
+</head>
+<body>
+    <h1>TutorOTP</h1>
+    <p>已登入為身分 {{USERNAME}}</p>
+    <form method="POST" action="/logout">
+        <button type="submit">登出</button>
+    </form>
+    <br>
+    <code>{{OTP}}</code>
+    <p>
+        <button class="setCounter" data-value="{{COUNTER}} - 1">--</button>
+        <span>{{COUNTER}}</span>
+        <button class="setCounter" data-value="{{COUNTER}} + 1">++</button>
+    </p>
+
+
+    <script>
+        document.querySelectorAll('.setCounter').forEach(btn => {
+            btn.addEventListener('click', async function () {
+                const value = eval(this.getAttribute('data-value'));
+                try {
+                    const res = await fetch('/counter', {
+                        method: 'PUT',
+                        headers: { 'Content-Type': 'application/json' },
+                        body: JSON.stringify({ counter: value })
+                    });
+
+                    if (!res.ok) {
+                        alert('伺服器錯誤');
+                        return;
+                    }
+
+                    const data = await res.json();
+                    if (data && data.success) {
+                        window.location.reload();
+                    }
+                } catch (err) {
+                    alert('請求失敗: ' + err);
+                }
+            });
+        });
+    </script>
+</body>
+</html>
--- a/templates/login-fail.html
+++ b/templates/login-fail.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>登入失敗 | TutorOTP</title>
+    <style>
+        body {
+            font-family: sans-serif; padding: 1.5rem; font-size: 1.2rem;
+        }
+        a, button {
+            font-size: 1.1rem;
+        }
+    </style>
+</head>
+<body>
+    <h1>TutorOTP</h1>
+    <p>⚠️ 登入失敗</p>
+    <p>{{ERROR}}</p>
+    <a href="/">回首頁</a>
+</body>
+</html>
--- a/templates/login.html
+++ b/templates/login.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>登入 | TutorOTP</title>
+    <style>
+        body {
+            font-family: sans-serif;
+            padding: 1.5rem;
+            font-size: 1.2rem;
+        }
+
+        a,
+        button {
+            font-size: 1.1rem;
+        }
+    </style>
+</head>
+
+<body>
+    <h1>TutorOTP</h1>
+    <button id="loginBtn">登入</button>
+
+    <script>
+        document.getElementById('loginBtn').addEventListener('click', async function () {
+            const redirectUri = window.location.origin + '/callback';
+            try {
+                const res = await fetch('/authorize', {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({ redirectUri })
+                });
+
+                if (!res.ok) {
+                    alert('伺服器錯誤');
+                    return;
+                }
+
+                const data = await res.json();
+                if (data && data.redirect) {
+                    window.location.href = data.redirect;
+                }
+            } catch (err) {
+                alert('請求失敗: ' + err);
+            }
+        });
+    </script>
+</body>
+</html>