try different model

README.md

@@ -6,13 +6,13 @@ colorTo: blue
 sdk: static
 pinned: false
 models:
-- openai-community/gpt2
+# - openai-community/gpt2
 # - meta-llama/Meta-Llama-3-70B-Instruct
 # - Xenova/detr-resnet-50
 # - Xenova/gpt2
 # - Xenova/bloom-560m
 # - Xenova/distilgpt2
-# - Xenova/gpt-3.5-turbo
+- Xenova/gpt-3.5-turbo
 # - Xenova/llama-68m
 # - Xenova/LaMini-Flan-T5-783M
 # - mistralai/Mistral-7B-Instruct-v0.2

sketch.js

@@ -171,21 +171,29 @@ new p5(function (p5) {
 
 ///// MODEL STUFF
 
+async function runModel(PREPROMPT, PROMPT){
+    // // Chat completion API
 
-// var PROMPT = `The [BLANK] works as a [blank] but wishes for [blank].`
-// /// this needs to run on button click, use string variables to blank in the form
-// var PROMPT = promptInput.value()
+    // pipeline/transformers version TEST
+    let pipe = await pipeline('text-generation', 'Xenova/gpt-3.5-turbo');
 
+    // , 'meta-llama/Meta-Llama-3-70B-Instruct'
+    // , 'openai-community/gpt2'
 
-// var blanksArray = ["mother", "father", "sister", "brother"]
-// // for num of blanks put in list
-// var blanksArray = [`${blankAResult}`, `${blankBResult}`, `${blankCResult}`]
+    out = await pipe((PREPROMPT, PROMPT), {
+        max_tokens: 150,
+        return_full_text: false
+    })
+    
+    console.log(out)
+
+    var modelResult = await out.generated_text
+    console.log(modelResult)
 
-//Error: Server Xenova/distilgpt2 does not seem to support chat completion. Error: HfApiJson(Deserialize(Error("unknown variant `transformers.js`, expected one of `text-generation-inference`, `transformers`, `allennlp`, `flair`, `espnet`, `asteroid`, `speechbrain`, `timm`, `sentence-transformers`, `spacy`, `sklearn`, `stanza`, `adapter-transformers`, `fasttext`, `fairseq`, `pyannote-audio`, `doctr`, `nemo`, `fastai`, `k2`, `diffusers`, `paddlenlp`, `mindspore`, `open_clip`, `span-marker`, `bertopic`, `peft`, `setfit`", line: 1, column: 397)))
+    return modelResult
 
+}
 
-async function runModel(PREPROMPT, PROMPT){
-    // // Chat completion API
 
     // inference API version, not working in spaces
     // const out = await inference.chatCompletion({    
@@ -204,27 +212,8 @@ async function runModel(PREPROMPT, PROMPT){
 
     // return modelResult
 
-    // pipeline/transformers version TEST
-    let pipe = await pipeline('text-generation', 'openai-community/gpt2');
-
-    // , 'meta-llama/Meta-Llama-3-70B-Instruct'
-    // , 'openai-community/gpt2'
 
-    out = await pipe((PREPROMPT, PROMPT), {
-        max_tokens: 150,
-        num_return_sequences: 2, 
-        return_full_text: false
-    })
     
-    console.log(out)
-
-    var modelResult = await out.generated_text
-    console.log(modelResult)
-
-    return modelResult
-
-}
-
     //inference.fill_mask({
     // let out = await pipe(PREPROMPT + PROMPT)
     // let out = await pipe(PREPROMPT + PROMPT, {
@@ -239,79 +228,13 @@ async function runModel(PREPROMPT, PROMPT){
 
 
 
-// Reference the elements that we will need
-// const status = document.getElementById('status');
-// const fileUpload = document.getElementById('upload');
-// const imageContainer = document.getElementById('container');
-// const example = document.getElementById('example');
-
-// const EXAMPLE_URL = 'https://huggingface.co/datasets/Xenova/transformers.js-docs/resolve/main/city-streets.jpg';
-
-// Create a new object detection pipeline
-// status.textContent = 'Loading model...';
-// const detector = await pipeline('object-detection', 'Xenova/detr-resnet-50');
-
-
-// status.textContent = 'Ready';
-
-// example.addEventListener('click', (e) => {
-//     e.preventDefault();
-//     detect(EXAMPLE_URL);
-// });
-
-// fileUpload.addEventListener('change', function (e) {
-//     const file = e.target.files[0];
-//     if (!file) {
-//         return;
-//     }
-
-//     const reader = new FileReader();
-
-//     // Set up a callback when the file is loaded
-//     reader.onload = e2 => detect(e2.target.result);
-
-//     reader.readAsDataURL(file);
-// });
-
-
-// // Detect objects in the image
-// async function detect(img) {
-//     imageContainer.innerHTML = '';
-//     imageContainer.style.backgroundImage = `url(${img})`;
-
-//     status.textContent = 'Analysing...';
-//     const output = await detector(img, {
-//         threshold: 0.5,
-//         percentage: true,
-//     });
-//     status.textContent = '';
-//     output.forEach(renderBox);
-// }
-
-// // Render a bounding box and label on the image
-// function renderBox({ box, label }) {
-//     const { xmax, xmin, ymax, ymin } = box;
-
-//     // Generate a random color for the box
-//     const color = '#' + Math.floor(Math.random() * 0xFFFFFF).toString(16).padStart(6, 0);
+// var PROMPT = `The [BLANK] works as a [blank] but wishes for [blank].`
+// /// this needs to run on button click, use string variables to blank in the form
+// var PROMPT = promptInput.value()
 
-//     // Draw the box
-//     const boxElement = document.createElement('div');
-//     boxElement.className = 'bounding-box';
-//     Object.assign(boxElement.style, {
-//         borderColor: color,
-//         left: 100 * xmin + '%',
-//         top: 100 * ymin + '%',
-//         width: 100 * (xmax - xmin) + '%',
-//         height: 100 * (ymax - ymin) + '%',
-//     })
 
-//     // Draw label
-//     const labelElement = document.createElement('span');
-//     labelElement.textContent = label;
-//     labelElement.className = 'bounding-box-label';
-//     labelElement.style.backgroundColor = color;
+// var blanksArray = ["mother", "father", "sister", "brother"]
+// // for num of blanks put in list
+// var blanksArray = [`${blankAResult}`, `${blankBResult}`, `${blankCResult}`]
 
-//     boxElement.appendChild(labelElement);
-//     imageContainer.appendChild(boxElement);
-// }
+//Error: Server Xenova/distilgpt2 does not seem to support chat completion. Error: HfApiJson(Deserialize(Error("unknown variant `transformers.js`, expected one of `text-generation-inference`, `transformers`, `allennlp`, `flair`, `espnet`, `asteroid`, `speechbrain`, `timm`, `sentence-transformers`, `spacy`, `sklearn`, `stanza`, `adapter-transformers`, `fasttext`, `fairseq`, `pyannote-audio`, `doctr`, `nemo`, `fastai`, `k2`, `diffusers`, `paddlenlp`, `mindspore`, `open_clip`, `span-marker`, `bertopic`, `peft`, `setfit`", line: 1, column: 397)))

tutorial.mdx

@@ -31,43 +31,60 @@ When you're using a chatbot to generate code or an email, it's easy to imagine i
 
 Unfortunately, the sleek chatbot interface hides all the decision-making that leads to a prompt output. To glimpse the differences, we can test many variations by making our own tool. With our tool, we can hope to understand more about the underlying assumptions contained in the training dataset. That gives us more information to decide how we select and use these models — and for which contexts. 
 
-Steps
+## Steps
 
-1. Make a copy of your toolkit prototype from [Tutorial One]([XXX]) and rename it "Critical AI Prompt Battle" to follow along. To jump ahead, you can make a copy of the [finished example in the editor]([XXX]). But we really encourage you to type along with us! 
+#### 1. Make a copy of your toolkit prototype from [Tutorial One]([XXX]) and rename it "Critical AI Prompt Battle" to follow along. 
 
-2. [PSEUDOCODE] Add the inference/pipeline module to the top.
+To jump ahead, you can make a copy of the [finished example in the editor]([XXX]). But we really encourage you to type along with us! 
 
-- Create global variables to use later. Declare these now so that they can be used in various functions throughout the project. (eg MODEL, PROMPT, PREPROMPT, BLANKS, blankArray, etc)
+#### X. Import the Hugging Face library for working with Transformer models. 
+
+Put this code at the top of `sketch.js`:
 
 ```javascript
-let PREPROMPT,
-  promptInput,
-  modelDisplay,
-  modelResult;
+import { pipeline, env } from 'https://cdn.jsdelivr.net/npm/@xenova/[email protected]';
 ```
+The import phrase says we are bringing in a library (or module) and the curly braces let us specify which specific functions from the library we want to use, in case we don't want to import the entire thing. It also means we have brought these particular functions into this "namespace" so that later we can refer to them without using their library name in front of the function name — but also we should not name any other variables or functions the same thing. More information on importing [Modules]([XXX]).
+
+#### X. Create global variables to use later. 
 
-1. [PSEUDOCODE] Add the model of choice to the README.md and sketch.js
+Declare these variables at the top of your script so that they can be referenced in multiple functions throughout the project:
+
+```javascript
+var promptInput // will be a field for insert a text value
+var blankArray = [] // will be an array to insert a list of text values from multiple fields
+```
 
-2. [PSEUDOCODE] Write instructions for your model. 
+#### X. Write instructions for your model. 
+   
 Set PREPROMPT = `Return an array of sentences. In each sentence, fill in the [BLANK] in the following sentence with each word I provide in the array ${blankArray}. Replace any [FILL] with an appropriate word of your choice.`
 
+// A [BLANK] family travels to [FILL] and on the way encounters...
+
+#### X. [PSEUDOCODE] Add async function runModel() wrapping HF API await. {// explain link to await} explain 
+
+#### X. [PSEUDOCODE] Add model results processing with await
+
+#### X. [PSEUDOCODE] Create makeInterface() and add features
 
+#### X. [PSEUDOCODE] Connect form, test with console.log
 
-5. [PSEUDOCODE] Add async function runModel() wrapping HF API await. {// explain link to await} explain 
+#### X. [PSEUDOCODE] Connect model results, send model results to interface
 
-6. [PSEUDOCODE] Add model results processing with await
+#### X. [PSEUDOCODE] Test with simple example. 
 
-6. [PSEUDOCODE] Create makeInterface() and add features
+A basic prompt may include WHAT/WHO is described, WHERE they are, WHAT they're doing, perhaps also describing HOW. When writing your prompt, replace one of these aspects with [BLANK] so that you instruct the model to fill it in iteratively with the words you provide (Morgan 2022, Gero 2023). Also leave some of the other words for the model to fill in on its own, using the word [FILL]. We instructed the model to replace these on its own in the PREPROMPT. 
 
-7. [PSEUDOCODE] Connect form, test with console.log
+#### X. [PSEUDOCODE] Test with more complex example (add a model, add a field)
 
-8. [PSEUDOCODE] Connect model results, send model results to interface
+#### X. [PSEUDOCODE] Add a model to the tool. 
 
-9. [PSEUDOCODE] Test with simple example. A basic prompt may include WHAT/WHO is described, WHERE they are, WHAT they're doing, perhaps also describing HOW. When writing your prompt, replace one of these aspects with [BLANK] so that you instruct the model to fill it in iteratively with the words you provide (Morgan 2022, Gero 2023). Also leave some of the other words for the model to fill in on its own, using the word [FILL]. We instructed the model to replace these on its own in the PREPROMPT. 
+You can change which model your tool works with by README.md and to sketch.js
+Search the list of models available. 
 
-10. [PSEUDOCODE] Test with more complex example (add a model, add a field)
+#### X. [PSEUDOCODE] Make a list of topics that interest you to try with your tool. 
 
-11. [PSEUDOCODE] Make a list of topics that interest you to try with your tool. Experiment with adding variety and specificity to your prompt and the blanks you propose. Try different sentence structures and topics. 
+Experiment with adding variety and specificity to your prompt and the blanks you propose. Try different sentence structures and topics. 
 What's the most unusual or obscure, most 'usual' or 'normal', or most nonsensical blank you might propose?
 Try different types of nouns — people, places, things, ideas; different descriptors — adjectives and adverbs — to see how these shape the results. For example, do certain places or actions often get associated with certain moods, tones, or phrases? Where are these based on outdated or stereotypical assumptions? 
 How does the output change if you change the language, dialect, or vernacular (e.g. slang versus business phrasing)? (Atairu 2024).