| <!DOCTYPE html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8" /> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
| <title>AI_HUB</title> |
| <link rel="stylesheet" href="style.css" /> |
| </head> |
| <body> |
| <header> |
| <h1>π€ AI_HUB</h1> |
| <div id="controls"> |
| <select id="model-select"> |
| <option value="qwen">Qwen 2.5 Coder</option> |
| <option value="deepseek">DeepSeek Distill</option> |
| </select> |
| <button id="settings-btn">βοΈ</button> |
| </div> |
| </header> |
|
|
| |
| <div id="login-form"> |
| <input id="login-email" type="email" placeholder="Email" /> |
| <input id="login-password" type="password" placeholder="Password" /> |
| <button id="login-btn">Login</button> |
| <p>Don't have an account? <span id="show-signup" style="cursor:pointer;color:blue;">Sign up</span></p> |
| </div> |
|
|
| |
| <div id="signup-form" style="display:none;"> |
| <input id="signup-email" type="email" placeholder="Email" /> |
| <input id="signup-username" type="text" placeholder="Username" /> |
| <input id="signup-password" type="password" placeholder="Password" /> |
| <button id="signup-btn">Sign Up</button> |
| <p>Already have an account? <span id="show-login" style="cursor:pointer;color:blue;">Login</span></p> |
| </div> |
|
|
| |
| <div id="ai-apps-section" style="display:none;"> |
| <h2>π AI Apps / Bots</h2> |
|
|
| |
| <div id="create-app-section"> |
| <input id="app-name" type="text" placeholder="App Name" /> |
| <input id="app-language" type="text" placeholder="Language" /> |
| <textarea id="app-code" placeholder="Your code here..."></textarea> |
| <button id="create-app-btn">Create AI App</button> |
| </div> |
|
|
| <div id="ai-apps-container"></div> |
| </div> |
|
|
| |
| <div id="chat-section" style="display:none;"> |
| <h2>π¬ Chat with AI</h2> |
| <div id="chat-container"></div> |
| <div id="typing" style="display:none;">π€ AI is typing...</div> |
| <footer> |
| <input id="user-input" type="text" placeholder="Type your message..." /> |
| <button id="send-btn">Send</button> |
| </footer> |
| </div> |
|
|
| |
| <div id="settings-modal" class="modal" style="display:none;"> |
| <div class="modal-content"> |
| <span id="close-settings">×</span> |
| <h2>Settings</h2> |
| <label>User Emoji: <input id="user-emoji" type="text" value="π§"/></label> |
| <label>AI Emoji: <input id="ai-emoji" type="text" value="π€"/></label> |
| <label>Max Tokens: <input id="max-tokens" type="number" value="200"/></label> |
| <label>Custom Hugging Face Model URL: <input id="custom-model" type="text"/></label> |
| <button id="load-custom-model">Load Model</button> |
| </div> |
| </div> |
|
|
| <script> |
| |
| document.addEventListener("DOMContentLoaded", () => { |
| const loginForm = document.getElementById("login-form"); |
| const signupForm = document.getElementById("signup-form"); |
| document.getElementById("show-signup").onclick = () => { |
| loginForm.style.display = "none"; |
| signupForm.style.display = "block"; |
| }; |
| document.getElementById("show-login").onclick = () => { |
| signupForm.style.display = "none"; |
| loginForm.style.display = "block"; |
| }; |
| }); |
| </script> |
|
|
| <script src="script.js"></script> |
| </body> |
| </html> |
|
|