feat: sick tool guides

packages/farm/package.json

@@ -22,6 +22,7 @@
     "@avocado/core": "^2.0.0",
     "@avocado/graphics": "^2.0.0",
     "@avocado/math": "^2.0.0",
+    "@avocado/timing": "^2.0.0",
     "@avocado/traits": "^2.0.0",
     "@latus/core": "^2.0.0",
     "@latus/socket": "^2.0.0",

packages/farm/src/traits/tool.js

@@ -3,16 +3,36 @@ import {TickingPromise} from '@avocado/core';
 import {Trait} from '@avocado/traits';
 import {Color, Primitives} from '@avocado/graphics';
 import {Rectangle, Vector} from '@avocado/math';
+import {LfoResult} from '@avocado/timing';
 
 // Tools.
 export default (latus) => class Tool extends Trait {
 
+  #primitives;
+
+  #targets = [];
+
+  #targetTotal = [0, 0, 0, 0];
+
+  #throbber;
+
   constructor() {
     super();
     if ('client' === process.env.SIDE) {
-      this.guidePrimitives = new Primitives();
+      this.#throbber = {color: 0};
+      this.#throbber.lfo = new LfoResult(
+        this.#throbber,
+        {
+          color: {
+            frequency: 1.25,
+            magnitude: 255,
+            modulators: ['Triangle', 'Sine'],
+          },
+        },
+      );
+      this.#primitives = new Primitives();
     }
-    this.targets = [];
+    this.#targets = [];
   }
 
   static behaviorTypes() {
@@ -71,7 +91,7 @@ export default (latus) => class Tool extends Trait {
 
   destroy() {
     if ('client' === process.env.SIDE) {
-      this.guidePrimitives.destroy();
+      this.#primitives.destroy();
     }
   }
 
@@ -89,7 +109,7 @@ export default (latus) => class Tool extends Trait {
   }
 
   calculateTargets() {
-    this.targets = [];
+    this.#targets = [];
     const {wielder} = this.entity;
     if (!wielder || !wielder.is('Directional')) {
       return;
@@ -99,7 +119,7 @@ export default (latus) => class Tool extends Trait {
     const width = (this.params.target.width - 1) / 2;
     for (let i = -width; i < (width + 1); ++i) {
       for (let j = 0; j < this.params.target.length; ++j) {
-        this.targets.push(Vector.add(
+        this.#targets.push(Vector.add(
           start,
           Vector.directionalProjection(direction, [i, j]),
         ));
@@ -133,12 +153,12 @@ export default (latus) => class Tool extends Trait {
   onWielderActiveSlotIndexChanged() {
     this.calculateTargets();
     if ('client' === process.env.SIDE) {
-      this.guidePrimitives.visible = false;
+      this.#primitives.visible = false;
       const {wielder} = this.entity;
       if (!wielder || !wielder.container || !wielder.is('Receptacle')) {
         return;
       }
-      this.guidePrimitives.visible = this.entity === wielder.itemInActiveSlot();
+      this.#primitives.visible = this.entity === wielder.itemInActiveSlot();
     }
   }
 
@@ -150,7 +170,7 @@ export default (latus) => class Tool extends Trait {
 
   renderPrimitives() {
     if ('client' === process.env.SIDE) {
-      this.guidePrimitives.clear();
+      this.#primitives.clear();
       const {wielder} = this.entity;
       if (!wielder || !wielder.is('Layered')) {
         return;
@@ -165,15 +185,15 @@ export default (latus) => class Tool extends Trait {
       }
       const tile = Vector.floor(wielder.tile);
       const {tileSize} = tileset;
-      for (let i = 0; i < this.targets.length; ++i) {
+      let total = [0, 0, 0, 0];
-        const target = this.targets[i];
+      for (let i = 0; i < this.#targets.length; ++i) {
+        const target = this.#targets[i];
         const relativeTarget = Vector.sub(target, tile);
         const scaledRelativeTarget = Vector.mul(relativeTarget, tileSize);
-        this.guidePrimitives.drawRectangle(
+        const targetRectangle = Rectangle.compose(scaledRelativeTarget, tileSize);
-          Rectangle.compose(scaledRelativeTarget, tileSize),
+        total = Rectangle.united(total, targetRectangle);
-          Primitives.lineStyle(new Color(255, 255, 255), 1),
-        );
       }
+      this.#targetTotal = total;
     }
   }
 
@@ -186,7 +206,7 @@ export default (latus) => class Tool extends Trait {
       if (!wielder.is('Layered')) {
         return;
       }
-      this.guidePrimitives.position = Vector.scale(wielder.tileOffset, -1);
+      this.#primitives.position = Vector.scale(wielder.tileOffset, -1);
     }
   }
 
@@ -196,7 +216,7 @@ export default (latus) => class Tool extends Trait {
       wielderChanged: (oldWielder, newWielder) => {
         if (oldWielder && oldWielder.is('Visible')) {
           if ('client' === process.env.SIDE) {
-            oldWielder.container.removeChild(this.guidePrimitives);
+            oldWielder.container.removeChild(this.#primitives);
           }
           oldWielder.off(
             'activeSlotIndexChanged',
@@ -213,7 +233,7 @@ export default (latus) => class Tool extends Trait {
         }
         if (newWielder && newWielder.is('Visible')) {
           if ('client' === process.env.SIDE) {
-            newWielder.container.addChild(this.guidePrimitives);
+            newWielder.container.addChild(this.#primitives);
           }
           newWielder.on(
             'activeSlotIndexChanged',
@@ -242,7 +262,7 @@ export default (latus) => class Tool extends Trait {
 
       useTool: () => {
         // Each target gets a promise.
-        const promises = this.targets.map((target) => {
+        const promises = this.#targets.map((target) => {
           // Set up.
           const context = this.createTargetContext(target);
           const toolActions = new Actions(compile(this.params.actions, latus));
@@ -276,4 +296,61 @@ export default (latus) => class Tool extends Trait {
     };
   }
 
+  renderGuide(rectangle, color, expansion) {
+    const position = Rectangle.position(rectangle);
+    const size = Rectangle.size(rectangle);
+    const quarter = Vector.add(expansion, Vector.scale(size, 0.25));
+    this.renderQuad(
+      Vector.add(position, [0, 0]),
+      quarter,
+      color,
+      [0, 0],
+    );
+    this.renderQuad(
+      Vector.add(position, [size[0] - 0.5, 0]),
+      [-quarter[0] - 0.5, quarter[1]],
+      color,
+      [0, 0],
+    );
+    this.renderQuad(
+      Vector.add(position, [size[0] - 1, size[1] - 1]),
+      [-quarter[0], -quarter[1]],
+      color,
+      [-0, 0],
+    );
+    this.renderQuad(
+      Vector.add(position, [0, size[1] - 1]),
+      [quarter[0], -quarter[1]],
+      color,
+      [0, 0],
+    );
+  }
+
+  renderGuides() {
+    const {color} = this.#throbber;
+    this.#primitives.clear();
+    this.renderGuide(this.#targetTotal, 255, [0, 0]);
+    this.renderGuide(Rectangle.expand(this.#targetTotal, [2, 2]), color, [1, 1]);
+  }
+
+  renderTick(elapsed) {
+    // eslint-disable-next-line no-unused-vars
+    const {lfo} = this.#throbber;
+    lfo.tick(elapsed);
+    this.renderGuides();
+  }
+
+  renderQuad(position, size, color) {
+    this.#primitives.drawLineTo(
+      position,
+      [size[0], 0],
+      Primitives.lineStyle(new Color(color, color, color), 1),
+    );
+    this.#primitives.drawLineTo(
+      position,
+      [0, size[1]],
+      Primitives.lineStyle(new Color(color, color, color), 1),
+    );
+  }
+
 };

packages/farm/yarn.lock

@@ -21,7 +21,7 @@
   dependencies:
     debug "4.3.1"
 
-"@avocado/graphics@^2.0.0":
+"@avocado/graphics@2.0.0", "@avocado/graphics@^2.0.0":
   version "2.0.0"
   resolved "http://npm.cha0sdev/@avocado%2fgraphics/-/graphics-2.0.0.tgz#9f80e40ca6de9e85db8b14a8225299fd50909f32"
   integrity sha512-B8JXuKkYh3vRDl7xVHZho8KFKKkujNcuwjiuofNeWf3W6+66024EibBwNtJbNQPIKGWn56tbkS8/EbddoJTsIg==
@@ -86,6 +86,22 @@
     debug "4.3.1"
     msgpack-lite "^0.1.26"
 
+"@avocado/timing@^2.0.0":
+  version "2.0.0"
+  resolved "http://npm.cha0sdev/@avocado%2ftiming/-/timing-2.0.0.tgz#fb804113c0449187dfea7329c35b61cb1c34d88a"
+  integrity sha512-w1lsuvFWM+jIOfAADdA1NNjhdZVm1A7O4RJ73w+IXnVh7hactdYHRCqbV8IIdzmmDFFsptFsYqUVyolq6VHK2w==
+  dependencies:
+    "@avocado/core" "2.0.0"
+    "@avocado/graphics" "2.0.0"
+    "@avocado/math" "2.0.0"
+    "@avocado/resource" "2.0.0"
+    "@avocado/traits" "^2.0.0"
+    "@latus/core" "2.0.0"
+    "@latus/socket" "2.0.0"
+    autoprefixer "^9.8.6"
+    debug "4.3.1"
+    lodash.mapvalues "^4.6.0"
+
 "@avocado/traits@^2.0.0":
   version "2.0.0"
   resolved "http://npm.cha0sdev/@avocado%2ftraits/-/traits-2.0.0.tgz#4308132bb42a9765a47c8e5c4f15ae9dccbf8425"
@@ -1913,6 +1929,19 @@ atob@^2.1.2:
   resolved "http://npm.cha0sdev/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
   integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg==
 
+autoprefixer@^9.8.6:
+  version "9.8.6"
+  resolved "http://npm.cha0sdev/autoprefixer/-/autoprefixer-9.8.6.tgz#3b73594ca1bf9266320c5acf1588d74dea74210f"
+  integrity sha512-XrvP4VVHdRBCdX1S3WXVD8+RyG9qeb1D5Sn1DeLiG2xfSpzellk5k54xbUERJ3M5DggQxes39UGOTP8CFrEGbg==
+  dependencies:
+    browserslist "^4.12.0"
+    caniuse-lite "^1.0.30001109"
+    colorette "^1.2.1"
+    normalize-range "^0.1.2"
+    num2fraction "^1.2.2"
+    postcss "^7.0.32"
+    postcss-value-parser "^4.1.0"
+
 aws-sign2@~0.7.0:
   version "0.7.0"
   resolved "http://npm.cha0sdev/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
@@ -2197,7 +2226,7 @@ browserify-zlib@^0.2.0:
   dependencies:
     pako "~1.0.5"
 
-browserslist@^4.14.5, browserslist@^4.16.1:
+browserslist@^4.12.0, browserslist@^4.14.5, browserslist@^4.16.1:
   version "4.16.1"
   resolved "http://npm.cha0sdev/browserslist/-/browserslist-4.16.1.tgz#bf757a2da376b3447b800a16f0f1c96358138766"
   integrity sha512-UXhDrwqsNcpTYJBTZsbGATDxZbiVDsx6UjpmRUmtnP10pr8wAYr5LgFoEFw9ixriQH2mv/NX2SfGzE/o8GndLA==
@@ -2362,7 +2391,7 @@ camelcase@^6.0.0:
   resolved "http://npm.cha0sdev/camelcase/-/camelcase-6.2.0.tgz#924af881c9d525ac9d87f40d964e5cea982a1809"
   integrity sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg==
 
-caniuse-lite@^1.0.30001173:
+caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001173:
   version "1.0.30001179"
   resolved "http://npm.cha0sdev/caniuse-lite/-/caniuse-lite-1.0.30001179.tgz#b0803883b4471a6c62066fb1752756f8afc699c8"
   integrity sha512-blMmO0QQujuUWZKyVrD1msR4WNDAqb/UPO1Sw2WWsQ7deoM5bJiicKnWJ1Y0NS/aGINSnKPIWBMw5luX+NDUCA==
@@ -5972,6 +6001,11 @@ normalize-path@^3.0.0, normalize-path@~3.0.0:
   resolved "http://npm.cha0sdev/normalize-path/-/normalize-path-3.0.0.tgz#0dcd69ff23a1c9b11fd0978316644a0388216a65"
   integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
 
+normalize-range@^0.1.2:
+  version "0.1.2"
+  resolved "http://npm.cha0sdev/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
+  integrity sha1-LRDAa9/TEuqXd2laTShDlFa3WUI=
+
 normalize-url@1.9.1:
   version "1.9.1"
   resolved "http://npm.cha0sdev/normalize-url/-/normalize-url-1.9.1.tgz#2cc0d66b31ea23036458436e3620d85954c66c3c"
@@ -6006,6 +6040,11 @@ nth-check@^1.0.2:
   dependencies:
     boolbase "~1.0.0"
 
+num2fraction@^1.2.2:
+  version "1.2.2"
+  resolved "http://npm.cha0sdev/num2fraction/-/num2fraction-1.2.2.tgz#6f682b6a027a4e9ddfa4564cd2589d1d4e669ede"
+  integrity sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4=
+
 number-is-nan@^1.0.0:
   version "1.0.1"
   resolved "http://npm.cha0sdev/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"