Fix loading messages and remove mobile input focus

Author: one-data-cookie

assets/js/chatmkAI.js

@@ -60,9 +60,9 @@ class ChatMKAI {
         n_ctx: 2048, // Set context size during model loading
         n_ctx_per_seq: 2048, // Set per-sequence context during model loading
         progressCallback: ({ loaded, total }) => {
-          // Check if cancelled
+          // Check if cancelled - stop immediately
           if (this.downloadController?.signal.aborted) {
-            throw new Error('Download cancelled by user');
+            return; // Stop progress updates
           }
 
           const percent = Math.round((loaded / total) * 100);
@@ -107,6 +107,8 @@ class ChatMKAI {
     if (this.downloadController) {
       this.downloadController.abort();
       console.log("ChatMK AI: Download cancelled");
+      // Show cancellation message immediately
+      this.showProgressInModal(0, 0, 150, 'Language model skipped → using search only');
     }
   }
 
@@ -222,7 +224,7 @@ ${userMessage}
         ? customMessage
         : percent === 100 
         ? `Language model loaded: SmolLM2-360M-Q8`
-        : `Language model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKAI.cancelDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline;">skip magic</span>`;
+        : `Language model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKAI.cancelDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline; white-space: nowrap;">skip magic</span>`;
 
       // Check if there's already a progress message and update it
       const messages = document.getElementById("chatmk-messages");

assets/js/chatmkModal.js

@@ -3,6 +3,14 @@
  * Handles the chat modal open/close functionality
  */
 
+/**
+ * Check if user is on a mobile device
+ */
+function isMobileDevice() {
+  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || 
+         (window.innerWidth <= 768);
+}
+
 /**
  * Open the ChatMK modal
  */
@@ -51,9 +59,9 @@ function openChatMKModal() {
   modal.style.display = 'block';
   modal.classList.add('is-active');
 
-  // Focus on the input field
+  // Focus on the input field only on desktop
   const input = modal.querySelector('#chatmk-input');
-  if (input) {
+  if (input && !isMobileDevice()) {
     setTimeout(() => input.focus(), 100);
   }
 
@@ -176,11 +184,13 @@ function newChatMKConversation() {
     messagesContainer.insertBefore(welcomeMessage, messagesContainer.firstChild);
   }
 
-  // Clear input and focus
+  // Clear input and focus only on desktop
   const input = document.getElementById('chatmk-input');
   if (input) {
     input.value = '';
-    input.focus();
+    if (!isMobileDevice()) {
+      input.focus();
+    }
   }
 }
 

assets/js/chatmkSearch.js

@@ -88,7 +88,7 @@ class ChatMKSearch {
           } else if (percent === 100) {
             content.innerHTML = `<p>Embedding model loaded: MiniLM-L6-v2</p>`;
           } else {
-            content.innerHTML = `<p>Embedding model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKSearch.cancelEmbeddingDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline;">skip magic</span></p>`;
+            content.innerHTML = `<p>Embedding model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKSearch.cancelEmbeddingDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline; white-space: nowrap;">skip magic</span></p>`;
           }
         }
       } else {
@@ -99,7 +99,7 @@ class ChatMKSearch {
           ? `<p>${customMessage}</p>`
           : percent === 100 
           ? `<p>Embedding model loaded: MiniLM-L6-v2</p>`
-          : `<p>Embedding model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKSearch.cancelEmbeddingDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline;">skip magic</span></p>`;
+          : `<p>Embedding model loading: ${percent}% (${mbLoaded}/${mbTotal} MB) <span onclick="window.chatMKSearch.cancelEmbeddingDownload()" style="margin-left: 10px; font-size: 11px; color: var(--text-sub); cursor: pointer; text-decoration: underline; white-space: nowrap;">skip magic</span></p>`;
 
         messageDiv.innerHTML = `
           <div class="message-content">
@@ -120,6 +120,8 @@ class ChatMKSearch {
     if (this.embeddingController) {
       this.embeddingController.abort();
       console.log("Embedding download cancelled");
+      // Show cancellation message immediately
+      this.showEmbeddingProgress(0, 0, 25, 'Embedding model skipped → this won\'t work');
     }
   }
 
@@ -131,9 +133,9 @@ class ChatMKSearch {
 
     // Simulate progress from 0% to 100%
     for (let percent = 0; percent <= 100; percent += 20) {
-      // Check if cancelled
+      // Check if cancelled - stop immediately
       if (this.embeddingController?.signal.aborted) {
-        throw new Error('Embedding download cancelled by user');
+        return; // Stop progress updates
       }
 
       const mbLoaded = Math.round((percent / 100) * totalMB);