From ca02addc64b9c899aaed899b93270810224c0f51 Mon Sep 17 00:00:00 2001 From: "Sean S. LeBlanc" Date: Tue, 16 Nov 2021 23:53:33 -0500 Subject: [PATCH] fix(custom text effect): update `color` documentation/examples --- src/custom text effect.js | 15 +++++---------- 1 file changed, 5 insertions(+), 10 deletions(-) diff --git a/src/custom text effect.js b/src/custom text effect.js index a97c7518..c833b85a 100644 --- a/src/custom text effect.js +++ b/src/custom text effect.js @@ -34,7 +34,8 @@ The key is the text you'll write inside {} in bitsy to trigger the effect The first argument is `char`, an individual character, which has the following properties: offset: offset from actual position in pixels. starts at {x:0, y:0} - color: color of rendered text in [0-255]. starts at {r:255, g:255, b:255, a:255} + color: palette index of rendered text. use `tileColorStartIndex`/`rainbowColorStartIndex` + to modify this, e.g. `tileColorStartIndex + 2` is the sprite colour bitmap: character bitmap as array of pixels row: vertical position in rows (doesn't affect rendering) col: horizontal position in characters (doesn't affect rendering) @@ -51,14 +52,15 @@ The second argument is `time`, which is the time in milliseconds A number of example effects are included */ +import bitsy from 'bitsy'; import { inject } from './helpers/kitsy-script-toolkit'; export var hackOptions = { 'my-effect': function () { - // a horizontal wavy effect with a blue tint + // a horizontal wavy effect using the blue rbw colour this.DoEffect = function (char, time) { char.offset.x += 5 * Math.sin(time / 100 + char.col / 3); - char.color.r = 255 * Math.cos(time / 100 + char.col / 3); + char.color = bitsy.rainbowColorStartIndex + 4; }; }, droop: function () { @@ -69,13 +71,6 @@ export var hackOptions = { char.offset.y += ((time - char.start) / 100) * Math.abs(Math.sin(char.col)); }; }, - fadeout: function () { - // fades text to invisible after appearing - this.DoEffect = function (char, time) { - char.start = char.start || time; - char.color.a = Math.max(0, 255 - (time - char.start) / 2); - }; - }, noise: function () { // renders noise on top of text // note that it's making a copy with `.slice()` since it's a dynamic bitmap change