Promote version 6f90744 to main

Promoted commit 6f907443fea144f861fa6a07196de854cb670270 to main branch

index.html

@@ -205,7 +205,7 @@
             <p class="mt-1">Your conversations stay private and secure</p>
         </footer>
     </div>
-    <script src="https://accounts.google.com/gsi/client" async defer></script>
+
     <script>
         feather.replace();
         // DOM Elements - New Sidebar Elements
@@ -215,8 +215,17 @@
         const chatList = document.getElementById('chatList');
         
         // DOM Elements - Original
-        const authBtn = document.getElementById('authBtn');
-const newChatBtn = document.getElementById('newChatBtn');
+const authBtn = document.getElementById('authBtn');
+        const authModal = document.getElementById('authModal');
+        const authModalTitle = document.getElementById('authModalTitle');
+        const closeAuth = document.getElementById('closeAuth');
+        const regUsername = document.getElementById('regUsername');
+        const authPassword = document.getElementById('authPassword');
+        const authActionBtn = document.getElementById('authActionBtn');
+        const authToggleBtn = document.getElementById('authToggleBtn');
+        const authToggleText = document.getElementById('authToggleText');
+        const registerFields = document.getElementById('registerFields');
+        const newChatBtn = document.getElementById('newChatBtn');
 const settingsBtn = document.getElementById('settingsBtn');
         const settingsModal = document.getElementById('settingsModal');
         const closeSettings = document.getElementById('closeSettings');
@@ -229,49 +238,36 @@ const settingsBtn = document.getElementById('settingsBtn');
         const typingIndicator = document.getElementById('typingIndicator');
         const modelIndicator = document.getElementById('modelIndicator');
         const themeBtns = document.querySelectorAll('.theme-btn');
-        // Auth state management
-        let currentUser = null;
+        // User management
+        let isRegistering = false;
 
-        async function checkAuth() {
-            try {
-                const response = await fetch('/auth/status');
-                const data = await response.json();
-                
-                if (data.isAuthenticated) {
-                    currentUser = data.user;
-                    authBtn.innerHTML = `<img src="${data.user.picture}" class="w-6 h-6 rounded-full mr-2"><span>Logout</span>`;
-                    document.querySelector('#newChatBtn').disabled = false;
-                    document.querySelector('#settingsBtn').disabled = false;
-                    sendBtn.disabled = false;
-                    loadChatList();
-                } else {
-                    currentUser = null;
-                    authBtn.innerHTML = `<i data-feather="user" class="w-5 h-5"></i><span>Login with Google</span>`;
-                    document.querySelector('#newChatBtn').disabled = true;
-                    document.querySelector('#settingsBtn').disabled = true;
-                    sendBtn.disabled = true;
-                }
-                feather.replace();
-            } catch (error) {
-                console.error('Auth check failed:', error);
+        function updateAuthUI() {
+            const loggedInUser = localStorage.getItem('chatRouterUser');
+            if (loggedInUser) {
+                authBtn.innerHTML = `<i data-feather="log-out" class="w-5 h-5"></i><span>Logout</span>`;
+                authBtn.dataset.state = 'logout';
+                document.querySelector('#newChatBtn').disabled = false;
+                document.querySelector('#settingsBtn').disabled = false;
+                sendBtn.disabled = false;
+            } else {
+                authBtn.innerHTML = `<i data-feather="user" class="w-5 h-5"></i><span>Login</span>`;
+                authBtn.dataset.state = 'login';
+                document.querySelector('#newChatBtn').disabled = true;
+                document.querySelector('#settingsBtn').disabled = true;
+                sendBtn.disabled = true;
+                showAuthModal();
             }
+            feather.replace();
         }
 
-        function handleGoogleSignIn() {
-            window.location.href = '/auth/google';
-        }
-
-        async function handleLogout() {
-            try {
-                await fetch('/auth/logout');
-                currentUser = null;
-                chatList.innerHTML = '';
-                chatContainer.innerHTML = '';
-                checkAuth();
-                addMessage('system', 'Please sign in to start chatting.');
-            } catch (error) {
-                console.error('Logout failed:', error);
-            }
+        function showAuthModal(register = false) {
+            isRegistering = register;
+            authModalTitle.textContent = register ? 'Register' : 'Login';
+            authActionBtn.textContent = register ? 'Register' : 'Login';
+            authToggleText.textContent = register ? 'Already have an account? ' : 'Don\'t have an account? ';
+            authToggleBtn.textContent = register ? 'Login' : 'Register';
+            registerFields.classList.toggle('hidden', !register);
+            authModal.classList.remove('hidden');
         }
         // Chat management
         let currentChatId = null;
@@ -280,23 +276,30 @@ const settingsBtn = document.getElementById('settingsBtn');
             return 'chat_' + Date.now().toString(36) + Math.random().toString(36).substr(2, 5);
         }
 
-        async function loadChatList() {
-            if (!currentUser) return;
+        function loginUser(username, password) {
+            // Simple auth - store user in localStorage
+            localStorage.setItem('chatRouterUser', username);
+            localStorage.setItem(`chatRouterPass_${username}`, password); // Not secure for production!
+            updateAuthUI();
             
-            try {
-                const response = await fetch('/api/chats');
-                const chats = await response.json();
-                
-                chatList.innerHTML = '';
-                chats.forEach(chat => {
-                    addChatToList(chat.id, chat.title);
-                });
-            } catch (error) {
-                console.error('Failed to load chats:', error);
-            }
+            // Create a new chat session
+            createNewChat();
+            
+            // Load user's chat list
+            loadChatList(username);
         }
-
-function createNewChat() {
+        function logoutUser() {
+            const username = localStorage.getItem('chatRouterUser');
+            localStorage.removeItem('chatRouterUser');
+            updateAuthUI();
+            
+            // Clear current chat and sidebar
+            chatContainer.innerHTML = '';
+            chatList.innerHTML = '';
+            currentChatId = null;
+            addMessage('system', 'Please log in to start chatting.');
+        }
+        function createNewChat() {
             const username = localStorage.getItem('chatRouterUser');
             if (!username) return;
             
@@ -306,44 +309,54 @@ function createNewChat() {
             saveChatHistory(username, currentChatId);
             addChatToList(username, currentChatId, 'New Chat');
         }
-        async function loadChatHistory(chatId) {
-            if (!currentUser) return;
-            
-            try {
-                const response = await fetch(`/api/chats/${chatId}`);
-                const chat = await response.json();
-                
-                chatContainer.innerHTML = chat.history;
+
+        function loadChatHistory(username, chatId) {
+            const history = localStorage.getItem(`chatHistory_${username}_${chatId}`);
+            if (history) {
+                chatContainer.innerHTML = history;
                 chatContainer.scrollTop = chatContainer.scrollHeight;
                 currentChatId = chatId;
-            } catch (error) {
-                console.error('Failed to load chat history:', error);
             }
         }
 
-        async function saveChatHistory(chatId) {
+        function saveChatHistory(username, chatId) {
             if (!chatId) chatId = currentChatId;
-            if (!currentUser || !chatId) return;
+            if (!username || !chatId) return;
             
-            try {
-                await fetch('/api/chats', {
-                    method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json'
-                    },
-                    body: JSON.stringify({
-                        id: chatId,
-                        title: chatContainer.querySelector('.message-bubble')?.textContent.substring(0, 30) || 'New Chat',
-                        history: chatContainer.innerHTML,
-                        updatedAt: new Date().toISOString()
-                    })
-                });
-            } catch (error) {
-                console.error('Failed to save chat:', error);
+            localStorage.setItem(`chatHistory_${username}_${chatId}`, chatContainer.innerHTML);
+            
+            // Update the chat title if it's the first message
+            const messages = chatContainer.querySelectorAll('.message-bubble');
+            if (messages.length === 1) {
+                updateChatTitle(username, chatId, messages[0].textContent.substring(0, 30));
+            }
+        }
+
+        function loadChatList(username) {
+            chatList.innerHTML = '';
+            const chats = [];
+            
+            // Find all chats for this user
+            for (let i = 0; i < localStorage.length; i++) {
+                const key = localStorage.key(i);
+                if (key.startsWith(`chatHistory_${username}_`)) {
+                    const chatId = key.split('_')[2];
+                    const title = localStorage.getItem(`chatTitle_${username}_${chatId}`) || 'New Chat';
+                    chats.push({ id: chatId, title });
+                }
             }
+            
+            // Sort by most recent first
+            chats.sort((a, b) => b.id.localeCompare(a.id));
+            
+            // Add to sidebar
+            chats.forEach(chat => {
+                addChatToList(username, chat.id, chat.title);
+            });
         }
-        function addChatToList(chatId, title) {
-const chatItem = document.createElement('div');
+
+        function addChatToList(username, chatId, title) {
+            const chatItem = document.createElement('div');
             chatItem.className = 'flex justify-between items-center p-2 hover:bg-gray-700 rounded-lg cursor-pointer';
             chatItem.dataset.chatId = chatId;
             
@@ -382,58 +395,37 @@ const chatItem = document.createElement('div');
             chatList.prepend(chatItem);
             feather.replace();
         }
-        async function updateChatTitle(chatId, title) {
-            try {
-                await fetch(`/api/chats/${chatId}`, {
-                    method: 'PUT',
-                    headers: {
-                        'Content-Type': 'application/json'
-                    },
-                    body: JSON.stringify({ title })
-                });
-                
-                const chatItem = chatList.querySelector(`[data-chat-id="${chatId}"]`);
-                if (chatItem) {
-                    chatItem.querySelector('span').textContent = title;
-                }
-            } catch (error) {
-                console.error('Failed to update chat title:', error);
+
+        function updateChatTitle(username, chatId, title) {
+            localStorage.setItem(`chatTitle_${username}_${chatId}`, title);
+            const chatItem = chatList.querySelector(`[data-chat-id="${chatId}"]`);
+            if (chatItem) {
+                chatItem.querySelector('span').textContent = title;
             }
         }
 
-        async function renameChat(chatId, titleElement) {
-const newTitle = prompt('Enter new chat title:', titleElement.textContent);
+        function renameChat(username, chatId, titleElement) {
+            const newTitle = prompt('Enter new chat title:', titleElement.textContent);
             if (newTitle && newTitle.trim()) {
                 localStorage.setItem(`chatTitle_${username}_${chatId}`, newTitle.trim());
                 titleElement.textContent = newTitle.trim();
             }
         }
-        async function deleteChat(chatId, element) {
-            if (!confirm('Are you sure you want to delete this chat?')) return;
-            
-            try {
-                await fetch(`/api/chats/${chatId}`, { method: 'DELETE' });
+
+        function deleteChat(username, chatId, element) {
+            if (confirm('Are you sure you want to delete this chat?')) {
+                localStorage.removeItem(`chatHistory_${username}_${chatId}`);
+                localStorage.removeItem(`chatTitle_${username}_${chatId}`);
                 element.remove();
                 
                 if (currentChatId === chatId) {
                     createNewChat();
                 }
-            } catch (error) {
-                console.error('Failed to delete chat:', error);
             }
         }
-        // Event listeners
-        authBtn.addEventListener('click', () => {
-            if (currentUser) {
-                handleLogout();
-            } else {
-                handleGoogleSignIn();
-            }
-        });
-
-        // Load saved settings
-        async function loadSettings() {
-const savedApiKey = localStorage.getItem('chatRouterApiKey');
+// Load saved settings
+async function loadSettings() {
+            const savedApiKey = localStorage.getItem('chatRouterApiKey');
             const savedModel = localStorage.getItem('chatRouterModel');
             const savedTheme = localStorage.getItem('chatRouterTheme') || 'indigo';
 
@@ -663,7 +655,54 @@ async function sendMessage() {
                 typingIndicator.classList.add('hidden');
             }
         }
-newChatBtn.addEventListener('click', createNewChat);
+        // Event listeners
+        authBtn.addEventListener('click', () => {
+            if (authBtn.dataset.state === 'logout') {
+                logoutUser();
+            } else {
+                showAuthModal();
+            }
+        });
+
+        closeAuth.addEventListener('click', () => {
+            authModal.classList.add('hidden');
+        });
+
+        authToggleBtn.addEventListener('click', () => {
+            showAuthModal(!isRegistering);
+        });
+
+        authActionBtn.addEventListener('click', () => {
+            if (isRegistering) {
+                const username = regUsername.value.trim();
+                const password = authPassword.value.trim();
+                
+                if (!username || !password) {
+                    alert('Please enter both username and password');
+                    return;
+                }
+                
+                if (localStorage.getItem(`chatRouterPass_${username}`)) {
+                    alert('Username already exists');
+                    return;
+                }
+                
+                loginUser(username, password);
+            } else {
+                const username = regUsername.value.trim();
+                const password = authPassword.value.trim();
+                const storedPass = localStorage.getItem(`chatRouterPass_${username}`);
+                
+                if (!storedPass || storedPass !== password) {
+                    alert('Invalid username or password');
+                    return;
+                }
+                
+                loginUser(username, password);
+            }
+            authModal.classList.add('hidden');
+        });
+        newChatBtn.addEventListener('click', createNewChat);
         newSidebarChat.addEventListener('click', createNewChat);
         
         // Sidebar toggle for mobile
@@ -685,19 +724,20 @@ messageInput.addEventListener('keydown', (e) => {
         });
         // Initialize
         loadSettings();
-        checkAuth();
+        updateAuthUI();
         
         // Welcome message
         setTimeout(() => {
-            if (!currentUser) {
-                addMessage('system', 'Welcome to ChatRouter! Please sign in with Google to start chatting.');
+            if (!localStorage.getItem('chatRouterUser')) {
+                addMessage('system', 'Welcome to ChatRouter! Please log in to start chatting.');
             } else if (!localStorage.getItem('chatRouterModel')) {
                 addMessage('system', 'Please select a free model from settings to begin.');
             } else if (!currentChatId) {
                 createNewChat();
             }
         }, 1000);
-// Close sidebar when clicking outside on mobile
+
+        // Close sidebar when clicking outside on mobile
         document.addEventListener('click', (e) => {
             if (window.innerWidth < 768 && !sidebar.contains(e.target) && e.target !== sidebarToggle) {
                 sidebar.classList.add('hidden');