now i want to modify the project i want to use only the free of cost llm only i am giving you the list of the free llm can be use from openrouter without token charge use that models only

Tongyi DeepResearch 30B A3B (free), Meituan: LongCat Flash Chat (free), NVIDIA: Nemotron Nano 9B V2 (free), DeepSeek: DeepSeek V3.1 (free), OpenAI: gpt-oss-20b (free), Z.AI: GLM 4.5 Air (free), Qwen: Qwen3 Coder 480B A35B (free), MoonshotAI: Kimi K2 0711 (free), Venice: Uncensored (free), Google: Gemma 3n 2B (free), Tencent: Hunyuan A13B Instruct (free), TNG: DeepSeek R1T2 Chimera (free), Mistral: Mistral Small 3.2 24B (free), MoonshotAI: Kimi Dev 72B (free), DeepSeek: Deepseek R1 0528 Qwen3 8B (free), DeepSeek: R1 0528 (free), Mistral: Devstral Small 2505 (free), Google: Gemma 3n 4B (free), Meta: Llama 3.3 8B Instruct (free), Qwen: Qwen3 4B (free), Qwen: Qwen3 30B A3B (free), Qwen: Qwen3 8B (free), Qwen: Qwen3 14B (free), Qwen: Qwen3 235B A22B (free), TNG: DeepSeek R1T Chimera (free), Microsoft: MAI DS R1 (free), Shisa AI: Shisa V2 Llama 3.3 70B (free), ArliAI: QwQ 32B RpR v1 (free), Agentica: Deepcoder 14B Preview (free), Meta: Llama 4 Maverick (free), Meta: Llama 4 Scout (free), Qwen: Qwen2.5 VL 32B Instruct (free), DeepSeek: DeepSeek V3 0324 (free), Mistral: Mistral Small 3.1 24B (free), Google: Gemma 3 4B (free), Google: Gemma 3 12B (free), Google: Gemma 3 27B (free), Nous: DeepHermes 3 Llama 3 8B Preview (free), Dolphin3.0 Mistral 24B (free), Qwen: Qwen2.5 VL 72B Instruct (free), Mistral: Mistral Small 3 (free), DeepSeek: R1 Distill Llama 70B (free), DeepSeek: R1 (free), Google: Gemini 2.0 Flash Experimental (free), Meta: Llama 3.3 70B Instruct (free), Qwen2.5 Coder 32B Instruct (free), Meta: Llama 3.2 3B Instruct (free), Qwen2.5 72B Instruct (free), Mistral: Mistral Nemo (free), Google: Gemma 2 9B (free), Mistral: Mistral 7B Instruct (free)

index.html

@@ -105,13 +105,19 @@
                         <input type="password" id="apiKeyInput" placeholder="Enter your API key" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500">
                         <p class="text-xs text-gray-400 mt-1">Your key is stored locally and never sent to our servers</p>
                     </div>
-                    <div>
-                        <label class="block text-sm font-medium mb-1">Select Model</label>
-                        <select id="modelSelect" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500">
-                            <option value="" disabled selected>Enter API key to load models</option>
-                        </select>
-                        <p class="text-xs text-gray-400 mt-1">Models will be loaded after entering API key</p>
-                    </div>
+        <div>
+            <label class="block text-sm font-medium mb-1">Select Model</label>
+            <select id="modelSelect" class="w-full bg-gray-700 border border-gray-600 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-indigo-500">
+                <option value="" disabled selected>Select a free model</option>
+                <option value="tongyi/deepresearch-30b-a3b">Tongyi DeepResearch 30B A3B (FREE)</option>
+                <option value="meituan/longcat-flash-chat">Meituan: LongCat Flash Chat (FREE)</option>
+                <option value="nvidia/nemotron-nano-9b-v2">NVIDIA: Nemotron Nano 9B V2 (FREE)</option>
+                <option value="deepseek/deepseek-v3.1">DeepSeek: DeepSeek V3.1 (FREE)</option>
+                <option value="meta/llama-3.3-70b-instruct">Meta: Llama 3.3 70B Instruct (FREE)</option>
+                <option value="mistral/mistral-7b-instruct">Mistral: Mistral 7B Instruct (FREE)</option>
+            </select>
+            <p class="text-xs text-gray-400 mt-1">Free models available without token charges</p>
+        </div>
 <div>
                         <label class="block text-sm font-medium mb-1">Chat Theme</label>
                         <div class="flex space-x-2">
@@ -134,10 +140,10 @@
                 <div class="flex justify-center">
                     <div class="bg-gray-700 bg-opacity-50 px-4 py-2 rounded-lg text-sm text-gray-300">
                         <i data-feather="info" class="inline mr-2 w-4 h-4"></i>
-                        Enter your API key in settings to start chatting
+                        Select a free model from settings to start chatting
                     </div>
                 </div>
-            </div>
+</div>
 
             <!-- Input Area -->
             <div class="border-t border-gray-700 p-4 bg-gray-800">
@@ -288,24 +294,30 @@ async function loadSettings() {
             // Apply theme
             document.body.className = `bg-gradient-to-br from-${savedTheme}-900 to-purple-900 text-white`;
         }
+        // Free models from OpenRouter
+        const freeModels = [
+            {id: 'tongyi/deepresearch-30b-a3b', name: 'Tongyi DeepResearch 30B A3B'},
+            {id: 'meituan/longcat-flash-chat', name: 'Meituan: LongCat Flash Chat'},
+            {id: 'nvidia/nemotron-nano-9b-v2', name: 'NVIDIA: Nemotron Nano 9B V2'},
+            {id: 'deepseek/deepseek-v3.1', name: 'DeepSeek: DeepSeek V3.1'},
+            {id: 'openai/gpt-oss-20b', name: 'OpenAI: gpt-oss-20b'},
+            {id: 'z.ai/glm-4.5-air', name: 'Z.AI: GLM 4.5 Air'},
+            {id: 'qwen/qwen3-coder-480b-a35b', name: 'Qwen: Qwen3 Coder 480B A35B'},
+            {id: 'moonshot-ai/kimi-k2-0711', name: 'MoonshotAI: Kimi K2 0711'},
+            {id: 'venice/uncensored', name: 'Venice: Uncensored'},
+            {id: 'google/gemma-3n-2b', name: 'Google: Gemma 3n 2B'},
+            {id: 'tencent/hunyuan-a13b-instruct', name: 'Tencent: Hunyuan A13B Instruct'},
+            {id: 'tng/deepseek-r1t2-chimera', name: 'TNG: DeepSeek R1T2 Chimera'},
+            {id: 'mistral/mistral-small-3.2-24b', name: 'Mistral: Mistral Small 3.2 24B'},
+            {id: 'meta/llama-3.3-70b-instruct', name: 'Meta: Llama 3.3 70B Instruct'},
+            {id: 'google/gemma-3n-4b', name: 'Google: Gemma 3n 4B'},
+            {id: 'google/gemma-3-4b', name: 'Google: Gemma 3 4B'},
+            {id: 'mistral/mistral-7b-instruct', name: 'Mistral: Mistral 7B Instruct'}
+        ];
 
-        // Fetch available models from OpenRouter
+        // Fetch available free models
         async function fetchModels(apiKey) {
             try {
-                const response = await fetch('https://openrouter.ai/api/v1/models', {
-                    headers: {
-                        'Authorization': `Bearer ${apiKey}`,
-                        'HTTP-Referer': window.location.href,
-                        'X-Title': 'ChatRouter'
-                    }
-                });
-                
-                const data = await response.json();
-                if (data.error) {
-                    addMessage('system', `Error loading models: ${data.error.message}`);
-                    return;
-                }
-
                 // Clear existing options
                 modelSelect.innerHTML = '';
                 
@@ -317,18 +329,19 @@ async function loadSettings() {
                 defaultOption.selected = true;
                 modelSelect.appendChild(defaultOption);
 
-                // Add chat models with pricing info
-                data.data
-                    .filter(model => model.description.includes('chat'))
-                    .sort((a, b) => b.top_provider.max_completion_tokens - a.top_provider.max_completion_tokens)
-                    .forEach(model => {
-                        const option = document.createElement('option');
-                        option.value = model.id;
-                        option.textContent = `${model.name} (${(model.pricing.completion / 1000).toFixed(4)}/token)`;
-                        modelSelect.appendChild(option);
-                    });
+                // Add free models
+                freeModels.forEach(model => {
+                    const option = document.createElement('option');
+                    option.value = model.id;
+                    option.textContent = `${model.name} (FREE)`;
+                    modelSelect.appendChild(option);
+                });
 
-            } catch (error) {
+                // Verify API key is still needed for these free models
+                if (!apiKey) {
+                    addMessage('system', 'Free models selected. Some features may require an API key.');
+                }
+} catch (error) {
                 addMessage('system', `Error loading models: ${error.message}`);
             }
         }
@@ -542,9 +555,9 @@ messageInput.addEventListener('keydown', (e) => {
         setTimeout(() => {
             if (!localStorage.getItem('chatRouterUser')) {
                 addMessage('system', 'Welcome to ChatRouter! Please log in to start chatting.');
-            } else if (!localStorage.getItem('chatRouterApiKey')) {
-                addMessage('system', 'Please enter your OpenRouter API key in settings to begin.');
-            }
+            } else if (!localStorage.getItem('chatRouterModel')) {
+                addMessage('system', 'Please select a free model from settings to begin.');
+}
         }, 1000);
 </script>
 </body>