Remove image support; inform users model does not support image input

README.md

@@ -12,13 +12,13 @@ license: other
 
 A lightweight chat interface for [Moonshot AI's Kimi K3](https://huggingface.co/moonshotai/Kimi-K3) — a 2.8T-parameter native multimodal agentic model.
 
-Built with vanilla HTML/CSS/JS. No backend required — connects directly to the Kimi API from your browser.
+Built with vanilla HTML/CSS/JS. No backend required — connects directly to the Kimi API from your browser. Text only — this model does not support image input.
 
 ## Usage
 
 1. Get an API key from [platform.kimi.ai](https://platform.kimi.ai)
 2. Enter it in the settings panel
-3. Chat with text, images, or both
+3. Start chatting
 
 ## Links
 

index.html

@@ -66,7 +66,6 @@
     padding: 8px 12px; border-radius: 6px; margin: 8px 0; font-size: 0.88em; color: #9999cc;
   }
   .msg .thinking-label { font-weight: 600; color: var(--primary); margin-bottom: 4px; font-size: 0.85em; }
-  .msg img { max-width: 100%; max-height: 200px; border-radius: 8px; margin: 4px 0; }
   .typing { display: flex; gap: 4px; padding: 4px 0; }
   .typing span { width: 6px; height: 6px; background: var(--text-muted); border-radius: 50%; animation: bounce 1.4s infinite; }
   .typing span:nth-child(2) { animation-delay: 0.2s; }
@@ -88,13 +87,6 @@
   }
   .input-row button:hover { background: var(--primary-hover); }
   .input-row button:disabled { opacity: 0.5; cursor: not-allowed; }
-  .input-row .image-btn {
-    background: var(--surface-2); border: 1px solid var(--border); padding: 8px 10px;
-    border-radius: 8px; cursor: pointer; font-size: 1.1em; line-height: 1; transition: 0.2s;
-  }
-  .input-row .image-btn:hover { border-color: var(--primary); }
-  #imagePreview { display: none; max-width: 60px; max-height: 60px; border-radius: 6px; border: 1px solid var(--border); }
-
   pre { background: #1a1a2e; border: 1px solid var(--border); border-radius: 6px; padding: 8px 12px; overflow-x: auto; margin: 8px 0; font-size: 0.85em; }
   code { background: var(--surface-2); padding: 2px 4px; border-radius: 4px; font-size: 0.9em; }
   pre code { background: none; padding: 0; }
@@ -137,12 +129,9 @@
   <div class="chat">
     <div class="messages" id="messages">
       <div class="msg system">Welcome! Enter your Kimi API key above, then start chatting.</div>
-      <div class="msg system">Kimi K3 supports text and images. Use the 📷 button to attach an image.</div>
+      <div class="msg system">Text only. This model does not support image input.</div>
     </div>
     <div class="input-row">
-      <label class="image-btn" title="Attach image" id="imageLabel">📷</label>
-      <input type="file" id="imageInput" accept="image/*" style="display:none" />
-      <img id="imagePreview" />
       <textarea id="messageInput" placeholder="Type a message..." rows="1"></textarea>
       <button id="sendBtn">Send</button>
     </div>
@@ -163,14 +152,9 @@ const reasoningSelect = document.getElementById("reasoningEffort");
 const messagesEl = document.getElementById("messages");
 const messageInput = document.getElementById("messageInput");
 const sendBtn = document.getElementById("sendBtn");
-const imageInput = document.getElementById("imageInput");
-const imagePreview = document.getElementById("imagePreview");
-const imageLabel = document.getElementById("imageLabel");
 const statusDot = document.getElementById("statusDot");
 const statusText = document.getElementById("statusText");
 
-let selectedImage = null;
-
 apiKeyInput.addEventListener("input", () => {
   if (apiKeyInput.value.startsWith("sk-")) {
     statusDot.className = "status-dot on";
@@ -184,35 +168,6 @@ apiKeyInput.addEventListener("input", () => {
   }
 });
 
-imageLabel.addEventListener("click", () => imageInput.click());
-imageInput.addEventListener("change", (e) => {
-  const file = e.target.files[0];
-  if (file) {
-    selectedImage = file;
-    const reader = new FileReader();
-    reader.onload = (ev) => { imagePreview.src = ev.target.result; imagePreview.style.display = "block"; };
-    reader.readAsDataURL(file);
-    imageLabel.textContent = "✕";
-  } else {
-    clearImage();
-  }
-});
-
-imageLabel.addEventListener("click", (e) => {
-  if (imageLabel.textContent === "✕") {
-    e.preventDefault();
-    clearImage();
-  }
-});
-
-function clearImage() {
-  selectedImage = null;
-  imageInput.value = "";
-  imagePreview.style.display = "none";
-  imagePreview.src = "";
-  imageLabel.textContent = "📷";
-}
-
 function addMessage(role, content, thinking) {
   const div = document.createElement("div");
   div.className = `msg ${role}`;
@@ -294,29 +249,19 @@ function markedParse(text) {
 
 async function sendMessage() {
   const text = messageInput.value.trim();
-  if (!text && !selectedImage) return;
+  if (!text) return;
   const apiKey = apiKeyInput.value.trim();
   if (!apiKey || !apiKey.startsWith("sk-")) {
     addMessage("system", "Please enter a valid Kimi API key (sk-...) in the settings.");
     return;
   }
 
-  addMessage("user", text || (selectedImage ? "[Image attached]" : ""));
+  addMessage("user", text);
   messageInput.value = "";
-  const currentImage = selectedImage;
-  clearImage();
   showTyping();
 
   try {
-    const messages = [];
-
-    const userContent = [];
-    if (text) userContent.push({ type: "text", text });
-    if (currentImage) {
-      const b64 = await toBase64(currentImage);
-      userContent.push({ type: "image_url", image_url: { url: b64 } });
-    }
-    messages.push({ role: "user", content: userContent });
+    const messages = [{ role: "user", content: text }];
 
     const response = await fetch(`${KIMI_API}/chat/completions`, {
       method: "POST",
@@ -388,20 +333,13 @@ async function sendMessage() {
       msg = "Invalid API key. Check your key at platform.kimi.ai.";
     } else if (msg.includes("402")) {
       msg = "Payment required. Add credits at platform.kimi.ai.";
+    } else if (msg.includes("not support image") || msg.includes("image.png")) {
+      msg = "Cannot read image. This model does not support image input.";
     }
     addMessage("system", `Error: ${msg}`);
   }
 }
 
-function toBase64(file) {
-  return new Promise((resolve, reject) => {
-    const reader = new FileReader();
-    reader.onload = () => resolve(reader.result);
-    reader.onerror = reject;
-    reader.readAsDataURL(file);
-  });
-}
-
 sendBtn.addEventListener("click", sendMessage);
 messageInput.addEventListener("keydown", (e) => {
   if (e.key === "Enter" && !e.shiftKey) {