From b8a8613c1285d5fb5a625332024a439d2c783976 Mon Sep 17 00:00:00 2001
From: Vincent Douillet <vincent@vdouillet.fr>
Date: Tue, 1 Jul 2025 07:34:16 +0200
Subject: add model choice

---
 index.html | 23 ++++++++++++++++++++---
 1 file changed, 20 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index fcbbcb4..c33a118 100644
--- a/index.html
+++ b/index.html
@@ -42,7 +42,9 @@
     </div>
     <form style="display: flex; justify-content: center; align-items: center; padding: 20px; width: 70%">
       <input id="prompt" type="text" placeholder="Enter your prompt here"
-        style="padding: 10px; width: 100%; margin-right: 10px;">
+        style="padding: 10px; width: 80%; margin-right: 10px;">
+      <select id="model" type="text" style="padding: 10px; width: 20%; margin-right: 10px;" placeholder="Model to use"
+        value="qwen2.5-coder:7b"></select>
       <button id="generate" type="submit" style="padding: 10px;">Generate</button>
     </form>
   </main>
@@ -52,11 +54,26 @@
     const chat = document.getElementById('chat');
     const prompt = document.getElementById('prompt');
     const generate = document.getElementById('generate');
+    const model = document.getElementById('model');
+
+    fetch('http://localhost:11434/api/tags')
+      .then(response => response.json())
+      .then(data => {
+        data.models.forEach(m => {
+          let option = document.createElement('option');
+          option.value = m.model;
+          option.text = m.name;
+          model.appendChild(option);
+        });
+      })
+      .catch(error => console.error(error));
 
     // generate button
     generate.addEventListener('click', e => {
       e.preventDefault();
 
+      const modelValue = model.value;
+
       // clear chat on first call
       if (firstCall) {
         firstCall = false;
@@ -75,14 +92,14 @@
       fetch('http://localhost:11434/api/generate', {
         method: 'POST',
         body: JSON.stringify({
-          model: "gemma3:4b",
+          model: modelValue,
           prompt: promptValue,
           stream: false
         })
       })
         .then(response => response.json())
         .then(data => {
-          appendChat(markdownParser(data.response), "answer");
+          appendChat(`<p style="font-size:0.7em;font-style:italic">${modelValue}</p>` + markdownParser(data.response), "answer");
         })
         .catch(error => console.error(error));
     });
-- 
cgit v1.2.3