Create sketch.js

sketch.js

@@ -0,0 +1,54 @@
+// Import the pipeline function from the transformers library via CDN link
+//import { pipeline } from 'https://cdn.jsdelivr.net/npm/@xenova/transformers@2.6.0';
+
+import { pipeline, env } from "https://cdn.jsdelivr.net/npm/@xenova/transformers@2.6.0";
+// Declare variables to hold the instances of the summarizer, generator, and classifier
+let summarizer, generator, classifier;
+env.allowLocalModels = false;
+// Add an event listener to the window object that will execute the following function once the window is fully loaded
+window.addEventListener('load', () => {
+  // Add click event listeners to buttons with specific IDs, binding them to their respective functions
+  
+  document.getElementById('generate').addEventListener('click', generate);
+  
+});
+
+// Grab DOM elements for updating status and output messages to the user
+const statusElement = document.getElementById('status');
+const outputElement = document.getElementById('output');
+
+// Define an asynchronous function to generate text
+async function generate() {
+  console.log("hello")
+  // Retrieve the input text from the DOM
+  let text = document.getElementById('inputText').value;
+  // If the generator model has not been loaded yet, load it and update the status
+  if (!generator) {
+    console.log("loading generate")
+    updateStatus('Loading generation model...');
+    generator = await pipeline(
+      'text2text-generation',
+      'Xenova/LaMini-Flan-T5-783M'
+    );
+  }
+  // Update status and run the generator model on the input text
+  updateStatus('Generating...');
+  console.log("generate")
+  let output = await generator(text, {
+    max_new_tokens: 100, // Set the maximum number of new tokens for the generated text
+  });
+  // Log and display the generation results
+  console.log(output);
+  updateOutput(output[0]);
+}
+
+// Function to update the status text in the DOM
+function updateStatus(message) {
+  statusElement.textContent = 'Status: ' + message;
+}
+
+// Function to update the output text in the DOM and set the status back to 'Ready' once done
+function updateOutput(message) {
+  outputElement.innerHTML = message;
+  updateStatus('Ready');
+}