validate token count

wasm-demo.js

@@ -227,24 +227,29 @@ $('tokenInput').addEventListener('input', () => {
             $('estimatedTime').textContent = timeText;
             
             if (tokenCount > TOKEN_LIMIT) {
-                $('encStatus').textContent = `⚠️ ${tokenCount}/${TOKEN_LIMIT} tokens - text too long`;
+                $('encStatus').textContent = `⚠️ ${tokenCount}/${TOKEN_LIMIT} tokens - exceeds limit, encryption disabled`;
                 $('encStatus').style.color = '#d32f2f';
+                enable('btnEncrypt', false);
             } else if (tokenCount < 10) {
                 $('encStatus').textContent = `⚠️ ${tokenCount}/${TOKEN_LIMIT} tokens - low reliability`;
                 $('encStatus').style.color = '#f57c00';
+                enable('btnEncrypt', true);
             } else {
                 $('encStatus').textContent = `${tokenCount}/${TOKEN_LIMIT} tokens`;
                 $('encStatus').style.color = '';
+                enable('btnEncrypt', true);
             }
         } catch (e) {
             // Tokenizer might not be ready yet
             $('encStatus').textContent = '';
             currentTokenCount = 0;
+            enable('btnEncrypt', true);
         }
     } else {
         $('encStatus').textContent = '';
         $('encStatus').style.color = '';
         currentTokenCount = 0;
+        enable('btnEncrypt', true);
     }
 });
 
@@ -261,6 +266,21 @@ $('btnEncrypt').onclick = async () => {
         return;
     }
 
+    // Validate token limit before proceeding
+    try {
+        const tokenIds = llama3Tokenizer.encode(text);
+        const TOKEN_LIMIT = 16;
+        if (tokenIds.length > TOKEN_LIMIT) {
+            console.error(`[Main] Token limit exceeded: ${tokenIds.length}/${TOKEN_LIMIT} tokens`);
+            alert(`Text is too long. Maximum ${TOKEN_LIMIT} tokens allowed, but your text has ${tokenIds.length} tokens. Please shorten your text.`);
+            return;
+        }
+    } catch (error) {
+        console.error('[Main] Token validation error:', error);
+        alert(`Error validating text: ${error.message}`);
+        return;
+    }
+
     show('encryptSpin', true);
     show('encIcon', false);
     enable('btnEncrypt', false);