Notice: Function _load_textdomain_just_in_time was called incorrectly. Translation loading for the astra-sites domain was triggered too early. This is usually an indicator for some code in the plugin or theme running too early. Translations should be loaded at the init action or later. Please see Debugging in WordPress for more information. (This message was added in version 6.7.0.) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php on line 6131
Warning: include_once(/home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/includes/functions.php): Failed to open stream: No such file or directory in /home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/theai.php on line 118
Warning: include_once(): Failed opening '/home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/includes/functions.php' for inclusion (include_path='.:/opt/cpanel/ea-php81/root/usr/share/pear') in /home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/theai.php on line 118
Warning: include_once(/home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/includes/api-settings.php): Failed to open stream: No such file or directory in /home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/theai.php on line 119
Warning: include_once(): Failed opening '/home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/includes/api-settings.php' for inclusion (include_path='.:/opt/cpanel/ea-php81/root/usr/share/pear') in /home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/theai/theai.php on line 119
Warning: session_start(): Session cannot be started after headers have already been sent in /home/dpjrmkpe/taonga.nxfanz.com/wp-content/plugins/chatbot-ai-free-models/includes/class-chatbot-main.php on line 88
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
Warning: Cannot modify header information - headers already sent by (output started at /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/functions.php:6131) in /home/dpjrmkpe/taonga.nxfanz.com/wp-includes/rest-api/class-wp-rest-server.php on line 1902
{"id":699,"date":"2025-08-18T00:02:02","date_gmt":"2025-08-18T00:02:02","guid":{"rendered":"https:\/\/taonga.nxfanz.com\/?page_id=699"},"modified":"2025-08-18T01:57:47","modified_gmt":"2025-08-18T01:57:47","slug":"699-2","status":"publish","type":"page","link":"https:\/\/taonga.nxfanz.com\/?page_id=699","title":{"rendered":""},"content":{"rendered":"\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Maori-English AI Chat Interface<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n :root {\n --primary: #4f46e5;\n --primary-dark: #4338ca;\n --secondary: #10b981;\n --dark: #1e293b;\n --darker: #0f172a;\n --light: #f1f5f9;\n --gray: #94a3b8;\n --border: #cbd5e1;\n --user-msg: #dbeafe;\n --ai-msg: #f8fafc;\n --error: #ef4444;\n --success: #22c55e;\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;\n }\n\n body {\n background: linear-gradient(135deg, #0f172a, #1e293b);\n color: var(--light);\n height: 100vh;\n display: flex;\n flex-direction: column;\n }\n\n .chat-container {\n display: flex;\n flex-direction: column;\n height: 100vh;\n max-width: 1400px;\n margin: 0 auto;\n width: 100%;\n }\n\n header {\n background: var(--darker);\n padding: 1rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 1px solid var(--border);\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n }\n\n .logo {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n font-size: 1.5rem;\n font-weight: 700;\n }\n\n .logo i {\n color: var(--primary);\n }\n\n .user-controls {\n display: flex;\n gap: 1rem;\n align-items: center;\n }\n\n .api-key-container {\n position: relative;\n }\n\n .api-key-input {\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n border: 1px solid var(--border);\n background: var(--dark);\n color: white;\n width: 250px;\n }\n\n .api-key-btn {\n background: var(--primary);\n color: white;\n border: none;\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n cursor: pointer;\n transition: background 0.3s;\n }\n\n .sidebar-toggle {\n background: var(--dark);\n border: none;\n color: white;\n padding: 0.5rem;\n border-radius: 0.5rem;\n cursor: pointer;\n display: none;\n margin-bottom: 1rem;\n }\n\n .sidebar {\n width: 250px;\n background: var(--darker);\n border-right: 1px solid var(--border);\n padding: 1rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n transition: transform 0.3s ease;\n }\n\n .sidebar.collapsed {\n transform: translateX(-100%);\n position: absolute;\n }\n\n @media (max-width: 768px) {\n .sidebar-toggle {\n display: block;\n }\n \n .sidebar {\n position: absolute;\n z-index: 10;\n height: calc(100% - 120px);\n transform: translateX(-100%);\n }\n \n .sidebar.expanded {\n transform: translateX(0);\n }\n }\n\n .api-key-btn:hover {\n background: var(--primary-dark);\n }\n\n .tools-dropdown {\n position: relative;\n }\n\n .tools-btn {\n background: var(--secondary);\n color: white;\n border: none;\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n transition: background 0.3s;\n }\n\n .tools-btn:hover {\n background: #0da271;\n }\n\n .tools-menu {\n position: absolute;\n top: 100%;\n right: 0;\n background: var(--darker);\n border: 1px solid var(--border);\n border-radius: 0.5rem;\n width: 300px;\n margin-top: 0.5rem;\n z-index: 100;\n display: none;\n box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);\n }\n\n .tools-menu.active {\n display: block;\n }\n\n .tool-section {\n padding: 1rem;\n border-bottom: 1px solid var(--border);\n }\n\n .tool-section:last-child {\n border-bottom: none;\n }\n\n .tool-section h3 {\n margin-bottom: 0.75rem;\n color: var(--secondary);\n display: flex;\n align-items: center;\n gap: 0.5rem;\n }\n\n .tool-section select, .tool-section input, .tool-section textarea {\n width: 100%;\n padding: 0.75rem;\n border-radius: 0.5rem;\n border: 1px solid var(--border);\n background: var(--dark);\n color: white;\n margin-bottom: 0.5rem;\n }\n\n .tool-section button {\n width: 100%;\n padding: 0.75rem;\n border-radius: 0.5rem;\n border: none;\n background: var(--primary);\n color: white;\n cursor: pointer;\n transition: background 0.3s;\n margin-top: 0.5rem;\n }\n\n .tool-section button:hover {\n background: var(--primary-dark);\n }\n\n .chat-area {\n display: flex;\n flex: 1;\n overflow: hidden;\n }\n\n .sidebar {\n width: 250px;\n background: var(--darker);\n border-right: 1px solid var(--border);\n padding: 1rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n }\n\n .sidebar-section {\n background: var(--dark);\n border-radius: 0.75rem;\n padding: 1rem;\n }\n\n .sidebar-section h3 {\n margin-bottom: 1rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n }\n\n .file-list {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n max-height: 200px;\n overflow-y: auto;\n }\n\n .file-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0.5rem;\n background: rgba(255, 255, 255, 0.05);\n border-radius: 0.5rem;\n }\n\n .file-item button {\n background: none;\n border: none;\n color: var(--gray);\n cursor: pointer;\n }\n\n .file-item button:hover {\n color: var(--secondary);\n }\n\n .upload-container {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n }\n\n .upload-btn {\n background: var(--secondary);\n color: white;\n border: none;\n padding: 0.75rem;\n border-radius: 0.5rem;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n transition: background 0.3s;\n }\n\n .upload-btn:hover {\n background: #0da271;\n }\n\n .upload-btn i {\n font-size: 1.2rem;\n }\n\n .chat-content {\n flex: 1;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n\n .messages-container {\n flex: 1;\n overflow-y: auto;\n padding: 1.5rem;\n display: flex;\n flex-direction: column;\n gap: 1.5rem;\n }\n\n .message {\n max-width: 80%;\n padding: 1rem 1.5rem;\n border-radius: 1rem;\n line-height: 1.5;\n position: relative;\n animation: fadeIn 0.3s ease-out;\n }\n\n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n }\n\n .user-message {\n background: var(--user-msg);\n color: var(--dark);\n align-self: flex-end;\n border-bottom-right-radius: 0;\n }\n\n .ai-message {\n background: var(--ai-msg);\n color: var(--dark);\n align-self: flex-start;\n border-bottom-left-radius: 0;\n }\n\n .message-header {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n margin-bottom: 0.5rem;\n font-weight: 600;\n }\n\n .user-message .message-header {\n color: var(--primary-dark);\n }\n\n .ai-message .message-header {\n color: var(--secondary);\n }\n\n .input-container {\n padding: 1.5rem;\n background: var(--darker);\n border-top: 1px solid var(--border);\n display: flex;\n gap: 1rem;\n }\n\n .message-input {\n flex: 1;\n padding: 1rem 1.5rem;\n border-radius: 2rem;\n border: 1px solid var(--border);\n background: var(--dark);\n color: white;\n font-size: 1rem;\n resize: none;\n min-height: 60px;\n max-height: 150px;\n }\n\n .send-btn {\n background: var(--primary);\n color: white;\n border: none;\n border-radius: 50%;\n width: 60px;\n height: 60px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: background 0.3s;\n align-self: flex-end;\n margin-bottom: 5px;\n }\n\n .send-btn:hover {\n background: var(--primary-dark);\n }\n\n .send-btn i {\n font-size: 1.5rem;\n }\n\n .status-bar {\n padding: 0.5rem 1.5rem;\n background: var(--dark);\n border-top: 1px solid var(--border);\n display: flex;\n justify-content: space-between;\n font-size: 0.875rem;\n color: var(--gray);\n }\n\n \/* Responsive design *\/\n @media (max-width: 768px) {\n .chat-area {\n flex-direction: column;\n }\n\n .sidebar {\n width: 100%;\n border-right: none;\n border-bottom: 1px solid var(--border);\n max-height: 200px;\n }\n\n .message {\n max-width: 90%;\n }\n\n .api-key-input {\n width: 150px;\n }\n\n .tools-menu {\n width: 250px;\n }\n }\n\n @media (max-width: 480px) {\n header {\n flex-direction: column;\n gap: 1rem;\n }\n\n .user-controls {\n width: 100%;\n justify-content: space-between;\n }\n\n .api-key-input {\n width: 100%;\n }\n\n .input-container {\n padding: 1rem;\n }\n\n .message-input {\n padding: 0.75rem 1rem;\n }\n\n .send-btn {\n width: 50px;\n height: 50px;\n }\n }\n\n \/* Scrollbar styling *\/\n .messages-container::-webkit-scrollbar, .file-list::-webkit-scrollbar {\n width: 8px;\n }\n\n .messages-container::-webkit-scrollbar-track, .file-list::-webkit-scrollbar-track {\n background: var(--darker);\n }\n\n .messages-container::-webkit-scrollbar-thumb, .file-list::-webkit-scrollbar-thumb {\n background: var(--primary);\n border-radius: 4px;\n }\n\n .messages-container::-webkit-scrollbar-thumb:hover, .file-list::-webkit-scrollbar-thumb:hover {\n background: var(--primary-dark);\n }\n\n \/* Loading indicator *\/\n .loading {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 3px solid rgba(255,255,255,.3);\n border-radius: 50%;\n border-top-color: var(--primary);\n animation: spin 1s ease-in-out infinite;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n\n .typing-indicator {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.5rem 1rem;\n background: var(--ai-msg);\n border-radius: 1rem;\n align-self: flex-start;\n margin-bottom: 1.5rem;\n color: var(--dark);\n }\n\n .typing-indicator span {\n height: 8px;\n width: 8px;\n background: var(--gray);\n border-radius: 50%;\n display: inline-block;\n animation: bounce 1.3s linear infinite;\n }\n\n .typing-indicator span:nth-child(2) {\n animation-delay: 0.15s;\n }\n\n .typing-indicator span:nth-child(3) {\n animation-delay: 0.3s;\n }\n\n @keyframes bounce {\n 0%, 60%, 100% { transform: translateY(0); }\n 30% { transform: translateY(-5px); }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"chat-container\">\n <header>\n <div class=\"logo\">\n <i class=\"fas fa-robot\"><\/i>\n <span>Maori-English AI Assistant<\/span>\n <\/div>\n <div class=\"user-controls\">\n <button class=\"sidebar-toggle\" id=\"sidebarToggle\">\n <i class=\"fas fa-bars\"><\/i> Toggle Sidebar\n <\/button>\n <div class=\"api-key-container\">\n <input type=\"text\" class=\"api-key-input\" id=\"apiKeyInput\" placeholder=\"Enter your API key\">\n <button class=\"api-key-btn\" id=\"saveApiKeyBtn\">Save Key<\/button>\n <\/div>\n <div class=\"tools-dropdown\">\n <button class=\"tools-btn\" id=\"toolsDropdownBtn\">\n <i class=\"fas fa-tools\"><\/i>\n AI Tools\n <\/button>\n <div class=\"tools-menu\" id=\"toolsMenu\">\n <div class=\"tool-section\">\n <h3><i class=\"fas fa-language\"><\/i> Maori-English Translation<\/h3>\n <select id=\"translateDirection\">\n <option value=\"englishToMaori\">English to Maori<\/option>\n <option value=\"maoriToEnglish\">Maori to English<\/option>\n <\/select>\n <textarea id=\"translateText\" placeholder=\"Enter text to translate\"><\/textarea>\n <button id=\"translateBtn\">Translate<\/button>\n <\/div>\n <div class=\"tool-section\">\n <h3><i class=\"fas fa-book\"><\/i> Story Generation<\/h3>\n <select id=\"storyType\">\n <option value=\"traditional\">Traditional Maori Stories<\/option>\n <option value=\"modern\">Modern Maori Stories<\/option>\n <option value=\"educational\">Educational Stories<\/option>\n <\/select>\n <input type=\"text\" id=\"storyLength\" placeholder=\"Word count (e.g., 200)\">\n <textarea id=\"storyPrompt\" placeholder=\"Enter a story prompt or theme\"><\/textarea>\n <button id=\"generateStoryBtn\">Generate Story<\/button>\n <\/div>\n <div class=\"tool-section\">\n <h3><i class=\"fas fa-tree\"><\/i> Pepeha Creation<\/h3>\n <input type=\"text\" id=\"mountainName\" placeholder=\"Your mountain (Maunga)\">\n <input type=\"text\" id=\"riverName\" placeholder=\"Your river (Awa)\">\n <input type=\"text\" id=\"tribeName\" placeholder=\"Your tribe (Iwi)\">\n <button id=\"createPepehaBtn\">Create Pepeha<\/button>\n <\/div>\n <div class=\"tool-section\">\n <h3><i class=\"fas fa-people-arrows\"><\/i> Whakapapa Learning<\/h3>\n <select id=\"whakapapaTopic\">\n <option value=\"genealogy\">Genealogy Structure<\/option>\n <option value=\"ancestry\">Ancestry Research<\/option>\n <option value=\"familyTree\">Family Tree Building<\/option>\n <\/select>\n <textarea id=\"whakapapaQuery\" placeholder=\"Enter your query or name to research\"><\/textarea>\n <button id=\"whakapapaBtn\">Learn & Explore<\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/header>\n\n <div class=\"chat-area\">\n <div class=\"sidebar\" id=\"sidebar\">\n <div class=\"sidebar-section\">\n <h3><i class=\"fas fa-file-upload\"><\/i> Uploads<\/h3>\n <div class=\"upload-container\">\n <button class=\"upload-btn\" id=\"uploadBtn\">\n <i class=\"fas fa-cloud-upload-alt\"><\/i>\n Upload File\n <\/button>\n <input type=\"file\" id=\"fileInput\" style=\"display: none;\">\n <\/div>\n <\/div>\n <div class=\"sidebar-section\">\n <h3><i class=\"fas fa-file-download\"><\/i> Downloads<\/h3>\n <div class=\"file-list\" id=\"fileList\">\n <div class=\"file-item\">\n <span>maori_greetings.pdf<\/span>\n <button><i class=\"fas fa-download\"><\/i><\/button>\n <\/div>\n <div class=\"file-item\">\n <span>pepeha_examples.docx<\/span>\n <button><i class=\"fas fa-download\"><\/i><\/button>\n <\/div>\n <div class=\"file-item\">\n <span>whakapapa_guide.xlsx<\/span>\n <button><i class=\"fas fa-download\"><\/i><\/button>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"sidebar-section\">\n <h3><i class=\"fas fa-user-cog\"><\/i> User Tools<\/h3>\n <div class=\"upload-container\">\n <button class=\"upload-btn\" id=\"historyBtn\">\n <i class=\"fas fa-history\"><\/i>\n Chat History\n <\/button>\n <button class=\"upload-btn\" id=\"settingsBtn\">\n <i class=\"fas fa-cog\"><\/i>\n Settings\n <\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"chat-content\">\n <div class=\"messages-container\" id=\"messagesContainer\">\n <div class=\"message ai-message\">\n <div class=\"message-header\">\n <i class=\"fas fa-robot\"><\/i>\n <span>AI Assistant<\/span>\n <\/div>\n <div class=\"message-content\">\n Kia ora! I'm your Maori-English AI assistant. I can help you translate between Maori and English, generate Maori stories, create pepeha, and explore whakapapa. How can I assist you today?\n <\/div>\n <\/div>\n <div class=\"message user-message\">\n <div class=\"message-header\">\n <i class=\"fas fa-user\"><\/i>\n <span>You<\/span>\n <\/div>\n <div class=\"message-content\">\n Can you translate \"Hello, how are you?\" to Maori?\n <\/div>\n <\/div>\n <div class=\"message ai-message\">\n <div class=\"message-header\">\n <i class=\"fas fa-robot\"><\/i>\n <span>AI Assistant<\/span>\n <\/div>\n <div class=\"message-content\">\n Kia ora! Kei te p\u0113hea koe?\n <\/div>\n <\/div>\n <div class=\"typing-indicator\" id=\"typingIndicator\" style=\"display: none;\">\n <span><\/span>\n <span><\/span>\n <span><\/span>\n <span>AI is thinking...<\/span>\n <\/div>\n <\/div>\n\n <div class=\"input-container\">\n <textarea class=\"message-input\" id=\"messageInput\" placeholder=\"Type your message here...\"><\/textarea>\n <button class=\"send-btn\" id=\"sendBtn\">\n <i class=\"fas fa-paper-plane\"><\/i>\n <\/button>\n <\/div>\n\n <div class=\"status-bar\">\n <div>Connected to AI service<\/div>\n <div>Messages: 3<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n document.addEventListener('DOMContentLoaded', function() {\n \/\/ DOM Elements\n const apiKeyInput = document.getElementById('apiKeyInput');\n const saveApiKeyBtn = document.getElementById('saveApiKeyBtn');\n const toolsDropdownBtn = document.getElementById('toolsDropdownBtn');\n const toolsMenu = document.getElementById('toolsMenu');\n const messageInput = document.getElementById('messageInput');\n const sendBtn = document.getElementById('sendBtn');\n const messagesContainer = document.getElementById('messagesContainer');\n const fileInput = document.getElementById('fileInput');\n const uploadBtn = document.getElementById('uploadBtn');\n const typingIndicator = document.getElementById('typingIndicator');\n const sidebar = document.getElementById('sidebar');\n const sidebarToggle = document.getElementById('sidebarToggle');\n \n \/\/ Set default API key\n const defaultApiKey = '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';\n apiKeyInput.value = defaultApiKey;\n localStorage.setItem('aiChatApiKey', defaultApiKey);\n \n \/\/ Toggle sidebar on mobile\n sidebarToggle.addEventListener('click', function() {\n sidebar.classList.toggle('expanded');\n });\n \n \/\/ Toggle tools dropdown\n toolsDropdownBtn.addEventListener('click', function() {\n toolsMenu.classList.toggle('active');\n });\n \n \/\/ Close dropdown when clicking outside\n document.addEventListener('click', function(e) {\n if (!toolsDropdownBtn.contains(e.target) && !toolsMenu.contains(e.target)) {\n toolsMenu.classList.remove('active');\n }\n });\n \n \/\/ Send message functionality\n sendBtn.addEventListener('click', sendMessage);\n messageInput.addEventListener('keydown', function(e) {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n sendMessage();\n }\n });\n \n \/\/ File upload functionality\n uploadBtn.addEventListener('click', function() {\n fileInput.click();\n });\n \n fileInput.addEventListener('change', function(e) {\n if (e.target.files.length > 0) {\n const file = e.target.files[0];\n addFileToList(file.name);\n showNotification(`File uploaded: ${file.name}`, 'success');\n }\n });\n \n \/\/ AI Tool Buttons\n document.getElementById('translateBtn').addEventListener('click', function() {\n const direction = document.getElementById('translateDirection').value;\n const text = document.getElementById('translateText').value.trim();\n if (text) {\n processTool('translate', { direction, text });\n } else {\n showNotification('Please enter text to translate', 'error');\n }\n });\n \n document.getElementById('generateStoryBtn').addEventListener('click', function() {\n const type = document.getElementById('storyType').value;\n const length = document.getElementById('storyLength').value;\n const prompt = document.getElementById('storyPrompt').value.trim();\n processTool('story', { type, length, prompt });\n });\n \n document.getElementById('createPepehaBtn').addEventListener('click', function() {\n const mountain = document.getElementById('mountainName').value.trim();\n const river = document.getElementById('riverName').value.trim();\n const tribe = document.getElementById('tribeName').value.trim();\n processTool('pepeha', { mountain, river, tribe });\n });\n \n document.getElementById('whakapapaBtn').addEventListener('click', function() {\n const topic = document.getElementById('whakapapaTopic').value;\n const query = document.getElementById('whakapapaQuery').value.trim();\n if (query) {\n processTool('whakapapa', { topic, query });\n } else {\n showNotification('Please enter a query for whakapapa research', 'error');\n }\n });\n \n function sendMessage() {\n const message = messageInput.value.trim();\n if (!message) return;\n \n addMessage(message, 'user');\n messageInput.value = '';\n \n \/\/ Show typing indicator\n typingIndicator.style.display = 'flex';\n messagesContainer.scrollTop = messagesContainer.scrollHeight;\n \n \/\/ Simulate AI response delay\n setTimeout(() => {\n typingIndicator.style.display = 'none';\n addMessage(\"I've received your message. This is a simulated response for general chat.\", 'ai');\n }, 2000);\n }\n \n function addMessage(content, sender) {\n const messageDiv = document.createElement('div');\n messageDiv.classList.add('message');\n messageDiv.classList.add(sender === 'user' ? 'user-message' : 'ai-message');\n \n const headerDiv = document.createElement('div');\n headerDiv.classList.add('message-header');\n headerDiv.innerHTML = sender === 'user' \n ? `<i class=\"fas fa-user\"><\/i> <span>You<\/span>` \n : `<i class=\"fas fa-robot\"><\/i> <span>AI Assistant<\/span>`;\n \n const contentDiv = document.createElement('div');\n contentDiv.classList.add('message-content');\n contentDiv.textContent = content;\n \n messageDiv.appendChild(headerDiv);\n messageDiv.appendChild(contentDiv);\n messagesContainer.appendChild(messageDiv);\n \n \/\/ Scroll to bottom\n messagesContainer.scrollTop = messagesContainer.scrollHeight;\n }\n \n function addFileToList(filename) {\n const fileList = document.getElementById('fileList');\n const fileItem = document.createElement('div');\n fileItem.classList.add('file-item');\n fileItem.innerHTML = `\n <span>${filename}<\/span>\n <button><i class=\"fas fa-download\"><\/i><\/button>\n `;\n fileList.appendChild(fileItem);\n \n \/\/ Add download functionality\n fileItem.querySelector('button').addEventListener('click', function() {\n showNotification(`Downloading ${filename}...`, 'success');\n });\n }\n \n function processTool(toolName, params) {\n \/\/ Show typing indicator\n typingIndicator.style.display = 'flex';\n messagesContainer.scrollTop = messagesContainer.scrollHeight;\n \n \/\/ Close dropdown menu\n toolsMenu.classList.remove('active');\n \n \/\/ Get API key\n const apiKey = localStorage.getItem('aiChatApiKey');\n if (!apiKey) {\n setTimeout(() => {\n typingIndicator.style.display = 'none';\n showNotification('Please set your API key first', 'error');\n }, 1000);\n return;\n }\n \n \/\/ Simulate AI tool processing with specific responses\n setTimeout(() => {\n typingIndicator.style.display = 'none';\n let response = '';\n \n switch(toolName) {\n case 'translate':\n if (params.direction === 'englishToMaori') {\n response = `Translation to Maori: [Simulated Maori translation of \"${params.text}\"]`;\n } else {\n response = `Translation to English: [Simulated English translation of \"${params.text}\"]`;\n }\n break;\n case 'story':\n response = `Generated ${params.type} story (${params.length || 'variable'} words): [Simulated Maori story based on \"${params.prompt}\"]`;\n break;\n case 'pepeha':\n response = `Your Pepeha:\\nKo ${params.mountain || '[mountain]'} taku maunga\\nKo ${params.river || '[river]'} taku awa\\nKo ${params.tribe || '[tribe]'} taku iwi\\nT\u0113n\u0101 koe!`;\n break;\n case 'whakapapa':\n response = `Whakapapa Information for \"${params.query}\": [Simulated genealogy information based on ${params.topic}]`;\n break;\n default:\n response = \"Tool processed successfully\";\n }\n \n addMessage(response, 'ai');\n }, 3000);\n }\n \n function showNotification(message, type) {\n const notification = document.createElement('div');\n notification.textContent = message;\n notification.style.position = 'fixed';\n notification.style.bottom = '20px';\n notification.style.right = '20px';\n notification.style.padding = '10px 20px';\n notification.style.borderRadius = '5px';\n notification.style.color = 'white';\n notification.style.zIndex = '1000';\n notification.style.boxShadow = '0 4px 6px rgba(0, 0, 0, 0.1)';\n notification.style.animation = 'fadeIn 0.3s, fadeOut 0.3s 2.7s';\n notification.style.background = type === 'error' ? 'var(--error)' : 'var(--success)';\n \n document.body.appendChild(notification);\n \n setTimeout(() => {\n notification.remove();\n }, 3000);\n }\n \n \/\/ Add CSS for notification animations\n const styleSheet = document.createElement('style');\n styleSheet.textContent = `\n @keyframes fadeIn {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n }\n \n @keyframes fadeOut {\n from { opacity: 1; transform: translateY(0); }\n to { opacity: 0; transform: translateY(20px); }\n }\n `;\n document.head.appendChild(styleSheet);\n });\n <\/script>\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<\/h2>\n\n\n\n\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_eb_attr":"","pagelayer_contact_templates":[],"_pagelayer_content":"","_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"_kadence_starter_templates_imported_post":false,"footnotes":""},"class_list":["post-699","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Taonga Admin","author_link":"https:\/\/taonga.nxfanz.com\/?author=1"},"uagb_comment_info":0,"uagb_excerpt":null,"_links":{"self":[{"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/pages\/699","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=699"}],"version-history":[{"count":4,"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/pages\/699\/revisions"}],"predecessor-version":[{"id":704,"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=\/wp\/v2\/pages\/699\/revisions\/704"}],"wp:attachment":[{"href":"https:\/\/taonga.nxfanz.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=699"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}