Update static/js/script.js

static/js/script.js

@@ -1,6 +1,6 @@
 /**
  * ORBIT – Educational Research Assistant
- * FULL V-MASTER SCRIPT - ZERO CUTS, ZERO BUGS
+ * FULL V-MASTER SCRIPT - WITH TOAST NOTIFICATION & AUTO CLOSE
  */
 
 document.addEventListener('DOMContentLoaded', () => {
@@ -14,6 +14,38 @@ document.addEventListener('DOMContentLoaded', () => {
     let isBusy = false;
     let pdfText = ""; let pdfFilename = "";
 
+    // --- FITUR BARU: TOAST NOTIFICATION ---
+    function showToast(message, isError = false) {
+        let toast = $('orbit-toast');
+        if (!toast) {
+            toast = document.createElement('div');
+            toast.id = 'orbit-toast';
+            document.body.appendChild(toast);
+        }
+        // Styling Toast dengan Tailwind
+        const bgClass = isError ? 'bg-red-500' : 'bg-emerald-500';
+        const icon = isError 
+            ? `<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path></svg>`
+            : `<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>`;
+        
+        toast.className = `fixed top-6 left-1/2 transform -translate-x-1/2 px-5 py-2.5 rounded-full shadow-2xl text-sm font-semibold z-[9999] transition-all duration-300 flex items-center gap-2 text-white ${bgClass}`;
+        toast.style.opacity = '0';
+        toast.style.transform = 'translate(-50%, -20px)';
+        toast.innerHTML = `${icon} <span>${message}</span>`;
+
+        // Animasi Masuk
+        requestAnimationFrame(() => {
+            toast.style.opacity = '1';
+            toast.style.transform = 'translate(-50%, 0)';
+        });
+
+        // Animasi Keluar setelah 3 detik
+        setTimeout(() => {
+            toast.style.opacity = '0';
+            toast.style.transform = 'translate(-50%, -20px)';
+        }, 3000);
+    }
+
     // 1. DATA RECOVERY
     try {
         const stored = localStorage.getItem('orbit_sessions_v12');
@@ -21,7 +53,7 @@ document.addEventListener('DOMContentLoaded', () => {
         if (typeof sessions !== 'object' || Array.isArray(sessions)) sessions = {};
     } catch(e) { sessions = {}; }
 
-    // 2. PWA INSTALL LOGIC (Always show button if not installed)
+    // 2. PWA INSTALL LOGIC
     const isIOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
     let deferredPrompt;
     
@@ -61,7 +93,13 @@ document.addEventListener('DOMContentLoaded', () => {
             const setRes = await fetch('/api/settings');
             if(setRes.ok) {
                 appSettings = await setRes.json();
+                
+                // Inject Default Free Models untuk OpenRouter jika kosong
+                const DEFAULT_OR_MODELS = ["nvidia/nemotron-3-nano-omni-30b-a3b-reasoning:free", "baidu/cobuddy:free", "inclusionai/ring-2.6-1t:free", "poolside/laguna-xs.2:free", "google/gemma-4-26b-a4b-it:free", "google/gemma-4-31b-it:free", "nvidia/llama-nemotron-embed-vl-1b-v2:free", "minimax/minimax-m2.5:free", "openai/gpt-oss-120b:free", "liquid/lfm-2.5-1.2b-thinking:free", "liquid/lfm-2.5-1.2b-instruct:free", "qwen/qwen3-next-80b-a3b-instruct:free", "z-ai/glm-4.5-air:free", "meta-llama/llama-3.3-70b-instruct:free"];
+                
                 appSettings.models_openrouter = safeArr(appSettings.models_openrouter);
+                if(appSettings.models_openrouter.length === 0) appSettings.models_openrouter = [...DEFAULT_OR_MODELS];
+
                 appSettings.models_nvidia = safeArr(appSettings.models_nvidia);
                 appSettings.models_gemini = safeArr(appSettings.models_gemini);
                 appSettings.models_agentrouter = safeArr(appSettings.models_agentrouter);
@@ -88,7 +126,7 @@ document.addEventListener('DOMContentLoaded', () => {
         const cm = $('chat-messages'); 
         const ws = $('welcome-msg');
         
-        if(cm) cm.innerHTML = ''; // HANYA menghapus isi chat, TIDAK menghapus welcome-msg karena beda div!
+        if(cm) cm.innerHTML = '';
         
         if(sessions[id].messages && sessions[id].messages.length > 0) {
             if(ws) ws.classList.add('hidden');
@@ -174,7 +212,7 @@ document.addEventListener('DOMContentLoaded', () => {
     addEvt('chat-textarea', 'keydown', e => { if(e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); sendChat(); } });
     if($('chat-textarea')) $('chat-textarea').addEventListener('input', function() { this.style.height = 'auto'; this.style.height = Math.min(this.scrollHeight, 160) + 'px'; });
 
-    // 6. SETTINGS MODAL
+    // 6. SETTINGS MODAL & DYNAMIC UI
     const provMap = { "OpenRouter": "or", "Nvidia NIM": "nv", "Google Gemini": "gem", "AgentRouter": "ar", "Custom OpenAI": "oai" };
 
     function syncProviderUI() {
@@ -251,7 +289,13 @@ document.addEventListener('DOMContentLoaded', () => {
     bindAdd('btn-add-ar', 'inp-ar', 'models_agentrouter');
     bindAdd('btn-add-oai', 'inp-oai', 'models_openai');
 
+    // --- SAVE SETTINGS DENGAN TOAST & AUTO CLOSE ---
     addEvt('btn-save-settings', async () => {
+        const btn = $('btn-save-settings');
+        const originalText = btn.textContent;
+        btn.textContent = "Saving...";
+        btn.disabled = true;
+
         const payload = {
             provider: $('settings-provider').value,
             base_url: $('settings-url').value,
@@ -265,11 +309,25 @@ document.addEventListener('DOMContentLoaded', () => {
         };
         try {
             const res = await fetch('/api/settings', { method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(payload) });
-            if(res.ok) { appSettings = await res.json(); populateModelSelect(); $('settings-modal').classList.add('hidden'); }
-        } catch(e) { console.error(e); }
+            if(res.ok) { 
+                appSettings = await res.json(); 
+                populateModelSelect(); 
+                $('settings-modal').classList.add('hidden'); // Auto close
+                showToast("Settings saved successfully!"); // Notifikasi Toast hijau
+            } else {
+                const errData = await res.json();
+                throw new Error(errData.error || "Gagal menyimpan");
+            }
+        } catch(e) { 
+            console.error(e);
+            showToast(`Error: ${e.message}`, true); // Notifikasi Toast merah
+        } finally {
+            btn.textContent = originalText;
+            btn.disabled = false;
+        }
     });
 
-    // 7. DOI MODAL (FIXED EVENTS)
+    // 7. DOI MODAL
     addEvt('btn-doi', 'click', () => {
         $('doi-modal').classList.remove('hidden');
         if($('doi-input')) { $('doi-input').value = ""; $('doi-input').focus(); }
@@ -278,7 +336,6 @@ document.addEventListener('DOMContentLoaded', () => {
     });
     addEvt('btn-close-doi', 'click', () => $('doi-modal').classList.add('hidden'));
     
-    // Bind enter key on input to the submit button
     if($('doi-input')) {
         $('doi-input').addEventListener('keydown', e => {
             if(e.key === 'Enter') {