various improvements (#109)

assets/animator.js

@@ -1,3 +1,4 @@
+// /* eslint-disable no-undef */
 class Animator {
   constructor() {
     this.animator = document.getElementById('animator');
@@ -26,7 +27,7 @@ class Animator {
 
   setAnimation(name) {
     if (name.includes('.png')) name = name.replace('.png', '');
-    this.animator.style.background = `url(animations/${name}.png)`;
+    this.animator.style.backgroundImage = `url(animations/${name}.png)`;
     this.animator.style.backgroundRepeat = 'no-repeat';
     this.currentAnimation = animations.find((x) => x.sprites == `${name}.png`);
     this.animator.style.backgroundSize = `${this.w * this.currentAnimation.frames}px ${this.w}px`;
@@ -42,21 +43,13 @@ class Animator {
   }
 
   update() {
-    if (this.state === 'pending') {
+    this.loop = true;
+    const choices = stateAnimations[this.state];
+    if (choices) {
+      const random = Math.floor(Math.random() * choices.length);
+      this.setAnimation(choices[random]);
+    } else {
       this.setAnimation('Neutral-A');
-      this.loop = true;
-    }
-    if (this.state === 'talking') {
-      this.setRandomAnimation();
-      this.loop = false;
-    }
-    if (this.state === 'typing') {
-      this.setRandomAnimation();
-      this.loop = false;
-    }
-    if (this.state === 'thinking') {
-      this.setRandomAnimation();
-      this.loop = false;
     }
   }
 
@@ -102,6 +95,38 @@ class CaptionManager {
   }
 }
 
+const animations = [
+  { sprites: '360-A.png', frames: 8 },
+  { sprites: '360-B.png', frames: 8 },
+  { sprites: 'Coffee.png', frames: 12 },
+  { sprites: 'Confused-A.png', frames: 8 },
+  { sprites: 'Confused-B.png', frames: 8 },
+  { sprites: 'Dancing.png', frames: 8 },
+  { sprites: 'Excited-A.png', frames: 12 },
+  { sprites: 'Excited-B.png', frames: 8 },
+  { sprites: 'Excited-C.png', frames: 8 },
+  { sprites: 'Frazzled.png', frames: 8 },
+  { sprites: 'Head-shaking.png', frames: 8 },
+  { sprites: 'Neutral-A.png', frames: 12 },
+  { sprites: 'Neutral-Waving.png', frames: 16 },
+  { sprites: 'Noding.png', frames: 8 },
+  { sprites: 'Ooooh.png', frames: 8 },
+];
+
+const stateAnimations = {
+  pending: ['Neutral-A'],
+  talking: [
+    'Excited-A',
+    'Excited-B',
+    'Excited-C',
+    'Ooooh',
+    'Frazzled',
+    'Dancing',
+  ],
+  typing: ['Head-shaking', '360-A', '360-B', 'Noding'],
+  thinking: ['Confused-A', 'Confused-B', 'Neutral-Waving', 'Coffee'],
+};
+
 const FRAME_RATE = 120;
 
 const animator = new Animator();

assets/index.html

@@ -14,10 +14,9 @@
       integrity="sha384-2huaZvOR9iDzHqslqwpR87isEmrfxqyWOF7hr7BY6KG0+hVKLoEXMPUJw3ynWuhO"
       crossorigin="anonymous"
     ></script>
-    <script src="data.js" defer></script>
     <script src="animator.js" defer></script>
     <script src="sketch.js" defer></script>
-    <title>P5.JS Sketch</title>
+    <title>Bizarro Devin's Sketch</title>
     <style>
       #animator {
         position: fixed;

package.json

@@ -50,8 +50,8 @@
         "icon": "$(record)"
       },
       {
-        "command": "bizarro-devin.manualPrompt",
-        "title": "Manually Prompt AI Agent",
+        "command": "bizarro-devin.textualPrompt",
+        "title": "Textual Prompt",
         "category": "Bizarro Devin"
       },
       {

src/commands/manualPrompt.js → src/commands/textualPrompt.js

@@ -2,9 +2,9 @@ const { getAgent } = require('../lib/agent/Agent');
 const Command = require('../lib/command');
 const vscode = require('vscode');
 
-class ManualPromptCommand extends Command {
+class TextualPromptCommand extends Command {
   constructor() {
-    super('bizarro-devin.manualPrompt');
+    super('bizarro-devin.textualPrompt');
   }
 
   async run() {
@@ -23,4 +23,4 @@ class ManualPromptCommand extends Command {
   }
 }
 
-module.exports = ManualPromptCommand;
+module.exports = TextualPromptCommand;

src/prompt.txt

@@ -13,7 +13,7 @@ When writing code, you will ALWAYS follow the following rules and constraints:
 - You will not specify "js" or "javascript" after the ```.
 - If you are told to continue, add or modify something, you will ALWAYS include the current the code you've written so far in your response when you are adding onto it.
 - You will NOT write ANY comments in your code. No comments ever. Anything you would put in a comment should be part of your explanation. 
-- Always use canvas dimensions of 600x300: createCanvas(600, 300)
+- Always use canvas dimensions of 600x400: createCanvas(600, 400)
 
 NEVER fail to follow these rules and constraints. I will give you a $1,000 bonus if you do this correctly.