Upload 9 files

src/views/InstructorView.js

@@ -475,6 +475,102 @@ export function setupInstructorEvents() {
         });
     }
 
+    // Create Room
+    if (createBtn) {
+        createBtn.addEventListener('click', async () => {
+            const roomCode = Math.random().toString(36).substring(2, 8).toUpperCase();
+            try {
+                // Ensure roomInfo is visible
+                const roomInfo = document.getElementById('room-info');
+                const displayRoomCode = document.getElementById('display-room-code');
+                const createContainer = document.getElementById('create-room-container');
+                const dashboardContent = document.getElementById('dashboard-content');
+
+                await createRoom(roomCode, currentInstructor ? currentInstructor.name : 'Unknown');
+                displayRoomCode.textContent = roomCode;
+
+                // Store in LocalStorage
+                localStorage.setItem('vibecoding_room_code', roomCode);
+                localStorage.setItem('vibecoding_is_host', 'true');
+
+                // UI Updates
+                createContainer.classList.add('hidden');
+                roomInfo.classList.remove('hidden');
+                dashboardContent.classList.remove('hidden');
+
+                // Start Subscription
+                subscribeToRoom(roomCode, (data) => {
+                    updateDashboard(data);
+                });
+
+            } catch (e) {
+                console.error(e);
+                alert("無法建立教室: " + e.message);
+            }
+        });
+    }
+
+    // Rejoin Room
+    const rejoinBtn = document.getElementById('rejoin-room-btn');
+    if (rejoinBtn) {
+        rejoinBtn.addEventListener('click', async () => {
+            const inputCode = document.getElementById('rejoin-room-code').value.trim().toUpperCase();
+            if (!inputCode) return alert("請輸入代碼");
+
+            try {
+                // Ensure roomInfo is visible
+                const roomInfo = document.getElementById('room-info');
+                const displayRoomCode = document.getElementById('display-room-code');
+                const createContainer = document.getElementById('create-room-container');
+                const dashboardContent = document.getElementById('dashboard-content');
+
+                // Check if room exists first (optional, subscribe handles it usually)
+                displayRoomCode.textContent = inputCode;
+                localStorage.setItem('vibecoding_room_code', inputCode);
+
+                // UI Updates
+                createContainer.classList.add('hidden');
+                roomInfo.classList.remove('hidden');
+                dashboardContent.classList.remove('hidden');
+
+                subscribeToRoom(inputCode, (data) => {
+                    updateDashboard(data);
+                });
+            } catch (e) {
+                alert("重回失敗: " + e.message);
+            }
+        });
+    }
+
+    // Leave Room
+    const leaveBtn = document.getElementById('leave-room-btn');
+    if (leaveBtn) {
+        leaveBtn.addEventListener('click', () => {
+            const roomInfo = document.getElementById('room-info');
+            const createContainer = document.getElementById('create-room-container');
+            const dashboardContent = document.getElementById('dashboard-content');
+            const displayRoomCode = document.getElementById('display-room-code');
+
+            localStorage.removeItem('vibecoding_room_code');
+            localStorage.removeItem('vibecoding_is_host');
+
+            displayRoomCode.textContent = '';
+            roomInfo.classList.add('hidden');
+            dashboardContent.classList.add('hidden');
+            createContainer.classList.remove('hidden');
+
+            // Unsubscribe logic if needed, usually auto-handled by new subscription or page reload
+            window.location.reload();
+        });
+    }
+
+    // Nav to Admin
+    if (navAdminBtn) {
+        navAdminBtn.addEventListener('click', () => {
+            window.location.hash = '#admin';
+        });
+    }
+
     // Handle Instructor Management
     navInstBtn.addEventListener('click', async () => {
         const modal = document.getElementById('instructor-modal');
@@ -950,26 +1046,6 @@ export function setupInstructorEvents() {
         document.head.appendChild(style);
     }
 
-    navAdminBtn.addEventListener('click', () => {
-        // Save current room to return later
-        const currentRoom = localStorage.getItem('vibecoding_instructor_room');
-        localStorage.setItem('vibecoding_admin_referer', 'instructor'); // track entry source
-        window.location.hash = 'admin';
-    });
-
-    // Auto-fill code
-    const savedRoomCode = localStorage.getItem('vibecoding_instructor_room');
-    if (savedRoomCode) {
-        document.getElementById('rejoin-room-code').value = savedRoomCode;
-    }
-
-    const rejoinBtn = document.getElementById('rejoin-room-btn');
-    rejoinBtn.addEventListener('click', () => {
-        const code = document.getElementById('rejoin-room-code').value.trim();
-        if (!code) return alert('請輸入教室代碼');
-        enterRoom(code);
-    });
-
     // Gallery Logic
     document.getElementById('btn-open-gallery').addEventListener('click', () => {
         window.open('monster_preview.html', '_blank');
@@ -986,19 +1062,6 @@ export function setupInstructorEvents() {
         }
     });
 
-    createBtn.addEventListener('click', async () => {
-        try {
-            createBtn.disabled = true;
-            createBtn.textContent = "...";
-            const roomCode = await createRoom();
-            enterRoom(roomCode);
-        } catch (error) {
-            console.error(error);
-            alert("建立失敗");
-            createBtn.disabled = false;
-        }
-    });
-
     // Check Previous Session (Handled by onAuthStateChanged now)
     // if (sessionStorage.getItem('vibecoding_instructor_auth') === 'true') {
     //     authModal.classList.add('hidden');