Update index.js

index.js

@@ -9,44 +9,56 @@ const userInput = document.getElementById('user-input');
 const outputContainer = document.getElementById('output');
 const submitButton = document.getElementById('submit-button');
 
-// Load the text-generation pipeline
-status.textContent = 'Loading model...';
+// Function to initialize and load the text-generation pipeline
+async function loadModel() {
+    try {
+        status.textContent = 'Loading model...';
+        const generator = await pipeline('text-generation', 'EleutherAI/gpt-neo-125M');
+        status.textContent = 'Model loaded. Ready to chat!';
+        return generator;
+    } catch (error) {
+        console.error('Error loading model:', error);
+        status.textContent = 'Failed to load model. Please try again later.';
+        throw error; // Stop further execution if model loading fails
+    }
+}
 
+// Initialize the model
 let generator;
-try {
-    generator = await pipeline('text-generation', 'EleutherAI/gpt-neo-125M');
-    status.textContent = 'Model loaded. Ready to chat!';
-} catch (error) {
-    console.error('Error loading model:', error);
-    status.textContent = 'Failed to load model. Check the console for details.';
-}
+loadModel().then((loadedGenerator) => {
+    generator = loadedGenerator;
 
-// Add event listener to the submit button
-submitButton.addEventListener('click', async () => {
-    const inputText = userInput.value.trim();
+    // Add event listener to the submit button after the model is ready
+    submitButton.addEventListener('click', async () => {
+        const inputText = userInput.value.trim();
 
-    if (!inputText) {
-        outputContainer.innerText = 'Please enter a prompt.';
-        return;
-    }
+        if (!inputText) {
+            outputContainer.innerText = 'Please enter a prompt.';
+            return;
+        }
 
-    // Update status to show we're processing
-    status.textContent = 'Generating response...';
+        // Update status to show we're processing
+        status.textContent = 'Generating response...';
 
-    try {
-        const response = await generator(inputText, {
-            max_new_tokens: 100,
-            temperature: 0.7,
-            top_p: 0.95,
-        });
-
-        // Display the generated response
-        outputContainer.innerText = response[0].generated_text;
-    } catch (error) {
-        console.error(error);
-        outputContainer.innerText = 'Error generating response. Please try again.';
-    }
+        try {
+            const response = await generator(inputText, {
+                max_new_tokens: 100,
+                temperature: 0.7, // Controls randomness; lower = more deterministic
+                top_p: 0.95,     // Nucleus sampling
+            });
 
-    // Reset the status
-    status.textContent = 'Model loaded. Ready to chat!';
+            // Display the generated response
+            outputContainer.innerText = response[0].generated_text;
+        } catch (error) {
+            console.error('Error generating response:', error);
+            outputContainer.innerText = 'Error generating response. Please try again.';
+        }
+
+        // Reset the status
+        status.textContent = 'Model loaded. Ready to chat!';
+    });
+}).catch((error) => {
+    console.error('Model initialization failed:', error);
+    outputContainer.innerText = 'The application cannot proceed because the model failed to load.';
 });
+