Adding model trials.

index.html

@@ -20,9 +20,9 @@
         #chat-container {
             background-color: #fff;
             border-radius: 10px;
-            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);#
-            width: 90%;
-            max-width: 600px;
+            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
+            width: 100vw;
+            max-width: none;
             display: flex;
             flex-direction: column;
             overflow: hidden;
@@ -79,11 +79,12 @@
             align-items: center;
             font-size: 0.85em;
             color: #666;
-            text-align: center;
+            text-align: left;
             padding: 5px 10px;
             border-radius: 10px;
             background-color: #f0f0f0;
             margin: 5px 0;
+            white-space: pre-wrap; /* preserve markdown line breaks */
         }
 
         .message-bubble {
@@ -301,6 +302,7 @@ If you can answer the question directly with your existing knowledge or after us
         const toggleDiagBtn = document.getElementById('toggle-diagnostics');
         const backendSelect = document.getElementById('preferred-backend');
         const activeBackendLabel = document.getElementById('active-backend');
+        const trialModelsBtn = document.getElementById('trial-models');
     const skipRagCheckbox = document.getElementById('skip-rag');
 
 
@@ -887,6 +889,65 @@ If you can answer the question directly with your existing knowledge or after us
         forceReloadBtn.addEventListener('click', () => window.location.reload());
         toggleDiagBtn.addEventListener('click', () => diagnosticsEl.classList.toggle('show'));
 
+            // Trial Models: без токенів, мінімальний стабільний набір, Markdown список як системне повідомлення
+            trialModelsBtn.addEventListener('click', async () => {
+                const trialResultsDiv = document.getElementById('trial-results');
+                trialResultsDiv.style.display = 'block';
+                trialResultsDiv.innerHTML = '<b>Running trials (no tokens)...</b>';
+                const TRIAL_PROMPT = 'Do planes fly higher than bees?';
+                const MODELS_TO_TRY = [ 'Xenova/distilgpt2', 'Xenova/gpt2' ];
+                trialModelsBtn.disabled = true;
+                appendDiagnostic('Trial: Starting over ' + MODELS_TO_TRY.length + ' models (tokenless).');
+                const collected = [];
+                const progressList = document.createElement('ul');
+                progressList.style.fontSize = '0.7rem';
+                trialResultsDiv.appendChild(progressList);
+                const addProgress = (text) => {
+                    const li = document.createElement('li');
+                    li.textContent = text;
+                    progressList.appendChild(li);
+                    trialResultsDiv.scrollTop = trialResultsDiv.scrollHeight;
+                };
+                try {
+                    for (let i=0;i<MODELS_TO_TRY.length;i++) {
+                        const modelId = MODELS_TO_TRY[i];
+                        let loadTime='-', genTime='-', snippet='', error=null;
+                        let t0 = performance.now();
+                        addProgress(`Loading ${modelId} ...`);
+                        try {
+                            const pipe = await pipeline('text-generation', modelId, { quantized: true });
+                            const t1 = performance.now();
+                            const out = await pipe(TRIAL_PROMPT, { max_new_tokens: 40, temperature: 0.7 });
+                            const t2 = performance.now();
+                            loadTime = ((t1-t0)/1000).toFixed(2)+'s';
+                            genTime = ((t2-t1)/1000).toFixed(2)+'s';
+                            const full = Array.isArray(out) ? (out[0]?.generated_text||'') : (out.generated_text||'');
+                            snippet = full.trim().slice(0,400) || '(empty)';
+                            addProgress(`${modelId} ✓ load ${loadTime} gen ${genTime}`);
+                        } catch(e) {
+                            error = e?.message || String(e);
+                            addProgress(`${modelId} ✗ ${error}`);
+                            appendDiagnostic('Trial error '+modelId+': '+error);
+                        }
+                        collected.push({ model:modelId, loadTime, genTime, snippet, error });
+                        await new Promise(r=>setTimeout(r,0));
+                    }
+                } finally {
+                    trialModelsBtn.disabled = false;
+                }
+                // Формуємо Markdown
+                let md = '### Trial Results (No Token)\n';
+                for (const r of collected) {
+                    if (r.error) {
+                        md += `- **${r.model}**: ERROR: ${r.error}\n`;
+                    } else {
+                        md += `- **${r.model}** (Load ${r.loadTime} / Gen ${r.genTime})\n  Response: ${r.snippet.replace(/\n+/g,' ')}\n`;
+                    }
+                }
+                appendMessage({ role:'system', content: md });
+                appendDiagnostic('Trial: Markdown summary appended to chat.');
+            });
+
         // Event Listeners
         sendButton.addEventListener("click", onMessageSend);
         userInput.addEventListener("keypress", (event) => {