Upload 9 files

src/services/auth.js

@@ -2,7 +2,8 @@ import { auth, db } from "./firebase.js";
 import {
     signInWithEmailAndPassword,
     createUserWithEmailAndPassword,
-    signOut
+    signOut,
+    sendPasswordResetEmail
 } from "https://www.gstatic.com/firebasejs/10.7.1/firebase-auth.js";
 import {
     doc,

src/views/InstructorView.js

@@ -218,9 +218,7 @@ export async function renderInstructorView() {
 
                         <!-- Eraser -->
                         <button class="annotation-tool p-2 rounded-full hover:bg-gray-700 transition-colors ring-2 ring-transparent focus:outline-none flex items-center justify-center" data-tool="eraser" onclick="setPenTool('eraser', null, this)" title="橡皮擦">
-                            <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
-                                <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
-                            </svg>
+                            <img src="assets/eraser.svg" class="w-6 h-6 object-contain" alt="Eraser">
                         </button>
 
                         <div class="w-px h-6 bg-gray-600 mx-2"></div>
@@ -433,6 +431,41 @@ export function setupInstructorEvents() {
             }
         });
 
+        // Forgot Password Handler
+        const forgotBtn = document.createElement('button');
+        forgotBtn.textContent = "忘記密碼？";
+        forgotBtn.className = "text-sm text-gray-400 hover:text-white mt-2 underline block mx-auto"; // Centered link
+
+        // Insert after auth-error message or append to modal content?
+        // Appending to the parent of Login Button seems best, or just below it.
+        // The modal structure in index.html is needed to know exact placement.
+        // Assuming loginBtn is inside a flex column form.
+        loginBtn.parentNode.insertBefore(forgotBtn, loginBtn.nextSibling);
+
+        forgotBtn.addEventListener('click', async () => {
+            const email = loginEmailInput.value;
+            if (!email) {
+                authErrorMsg.textContent = "請先在上欄輸入 Email 以發送重設信";
+                authErrorMsg.classList.remove('hidden');
+                return;
+            }
+            if (!confirm(`確定要發送重設密碼信件至 ${email} 嗎？`)) return;
+
+            try {
+                // Dynamically import to avoid top-level dependency if not needed
+                const { resetPassword } = await import("../services/auth.js");
+                await resetPassword(email);
+                alert(`已發送重設密碼信件至 ${email}，請查收信箱並依照指示重設密碼。`);
+                authErrorMsg.classList.add('hidden');
+            } catch (e) {
+                console.error(e);
+                let msg = e.message;
+                if (e.code === 'auth/user-not-found') msg = "找不到此帳號，請確認 Email 是否正確。";
+                authErrorMsg.textContent = "發送失敗: " + msg;
+                authErrorMsg.classList.remove('hidden');
+            }
+        });
+
         // Register Handler
         registerBtn.addEventListener('click', async () => {
             const email = loginEmailInput.value;
@@ -1198,7 +1231,7 @@ export function setupInstructorEvents() {
             document.getElementById('broadcast-content').classList.add('hidden');
             const stage = document.getElementById('stage-view');
             stage.classList.remove('hidden');
-            document.getElementById('stage-prompt').textContent = prompt;
+            document.getElementById('stage-prompt').textContent = (prompt || '').trim();
             document.getElementById('stage-author').textContent = author;
         };
 
@@ -1312,7 +1345,7 @@ export function setupInstructorEvents() {
                     onchange="handlePromptSelection(this)">
             </div>
             <!-- Prompt Content -->
-            <div class="bg-black/30 rounded p-2 flex-1 overflow-y-auto font-mono text-green-300 whitespace-pre-wrap custom-scrollbar text-base leading-snug group-hover:text-green-200 transaction-colors mb-2">${p.prompt}</div>
+            <div class="bg-black/30 rounded p-2 flex-1 overflow-y-auto font-mono text-green-300 whitespace-pre-wrap custom-scrollbar text-base leading-snug group-hover:text-green-200 transaction-colors mb-2">${(p.prompt || '').trim()}</div>
 
             <!-- Footer: Time + Actions -->
             <div class="flex justify-between items-center text-[10px] text-gray-500 mt-auto">
@@ -1491,7 +1524,7 @@ export function setupInstructorEvents() {
             </div>
             <!-- Prompt Content: Larger Text (text-4xl) -->
             <div class="flex-1 overflow-y-auto font-mono text-green-300 text-4xl leading-relaxed whitespace-pre-wrap p-2 hover:bg-white/5 transition-colors rounded custom-scrollbar">
-                ${item.prompt}
+                ${(item.prompt || '').trim()}
             </div>
             `;
                 grid.appendChild(col);