Add spritesheet animation handling. Also fix several minor issues

docs/api/effect.md

@@ -350,6 +350,7 @@ In addition, a secondary options parameter can be given to this method, which ha
 - `offset: object` (default `{ x: 0, y: 0 }`) - causes the location to be offset by a set amount
 - `local: boolean` - Used with `offset` to cause the location to be offset locally to the effect's rotation
 - `gridUnits: boolean` - Used with `offset` to make each whole number represent in `x` and `y` to represent the effect's scene's grid size
+- `template: boolean` - Make the effect use the defined template in the sequencer database. See [Why templates are useful](https://fantasycomputer.works/FoundryVTT-Sequencer/#/database-basics?id=why-templates-are-useful).
 
 ## Rotate Towards
 
@@ -872,8 +873,6 @@ Animatable properties are as follows:
  - `scale.y`
  - `width`
  - `height`
-
-- `alphaFilter`
  - `alpha`
 
 - `spriteContainer`
@@ -924,8 +923,6 @@ Animatable properties are as follows:
  - `scale.y`
  - `width`
  - `height`
-
-- `alphaFilter`
  - `alpha`
 
 - `spriteContainer`

examples/effects/13-rotateTowards-template.js

@@ -0,0 +1,63 @@
+(async () => {
+ ui.notifications.info("Rotate towards different positions. Left is original scale, right are scaled variants");
+ const buildStar = (center, scale = 1) => {
+ for (let row = -1; row <= 1; row++) {
+ for (let col = -1; col <= 1; col++) {
+ if (!col && !row) {
+ continue;
+ }
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation(center)
+ .rotateTowards({ x: center.x + col, y: center.y + row }, { template: true })
+ .scale(scale)
+ .play();
+ }
+ }
+ };
+ buildStar({ x: 1400, y: 1400 });
+ buildStar({ x: 2100, y: 1400 }, 0.75);
+ buildStar({ x: 2900, y: 1400 }, 1.25);
+
+ ui.notifications.info(
+ "Below, rotation straight to the right (control) and offset by +/- 45 deg. Right is offset by +/- 100 units"
+ );
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 1400, y: 2000 })
+ .rotateTowards({ x: 1500, y: 2000 }, { rotationOffset: 45, template: true })
+ .play();
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 1400, y: 2000 })
+ .rotateTowards({ x: 1500, y: 2000 }, { rotationOffset: -45, template: true })
+ .play();
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 1400, y: 2000 })
+ .rotateTowards({ x: 1500, y: 2000 }, { template: true })
+ .play();
+
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 2000, y: 2000 })
+ .rotateTowards({ x: 2300, y: 2000 }, { offset: { y: -100 }, template: true })
+ .play();
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 2000, y: 2000 })
+ .rotateTowards({ x: 2300, y: 2000 }, { offset: { y: 100 }, template: true })
+ .play();
+ new Sequence()
+ .effect()
+ .file("jb2a.energy_beam.normal.bluepink.03.15ft")
+ .atLocation({ x: 2000, y: 2000 })
+ .rotateTowards({ x: 2300, y: 2000 }, { template: true })
+ .play();
+})();

examples/effects/52-spritesheets.js

@@ -0,0 +1,21 @@
+(async () => {
+ const textStyle = {
+ dropShadow: true,
+ dropShadowAngle: 0,
+ dropShadowBlur: 10,
+ dropShadowDistance: 0,
+ fill: "#ffffff",
+ fontStyle: "oblique",
+ miterLimit: 2,
+ strokeThickness: 5,
+ };
+
+ new Sequence()
+ .effect()
+ .file("modules/sequencer/samples/spritesheets/fire.json")
+ .atLocation({ x: 1200, y: 1100 })
+ .scale(2)
+ .text("spritesheet", {...textStyle, anchor: {x: 0.5, y: -2.5}})
+ .duration(5000)
+ .play();
+})();

examples/effects/53-stresstest.js

@@ -0,0 +1,34 @@
+(async () => {
+ // WARNING: this is taxing on the system, executing this script with sequencer 3.2.11 on time of writing
+ // will most likely make your world unresponsive. Safer values for cols and rows would be 10x15
+ const assets = [
+ { name: "video", file: "modules/sequencer/samples/fire.webm", cols: 30, rows: 22 },
+ { name: "spritesheet", file: "modules/sequencer/samples/spritesheets/fire.json", cols: 30, rows: 22 },
+ ];
+
+ const effectSize = 120;
+ const effectGridSize = 120;
+
+ for (const { name, file, cols, rows } of assets) {
+ ui.notifications.info(`Now playing ${name} effects`);
+ await Sequencer.Helpers.wait(250);
+
+ const start = { x: 1200, y: 900 };
+ const seq = new Sequence();
+ for (let row = 0; row < rows; row++) {
+ for (let col = 0; col < cols; col++) {
+ seq.effect()
+ .file(file)
+ .atLocation({
+ x: start.x + col * effectGridSize,
+ y: start.y + row * effectGridSize,
+ })
+ .size(effectSize)
+ .duration(20 * 1000);
+ }
+ }
+
+ await seq.play({ preload: true });
+ await Sequencer.Helpers.wait(21 * 1000);
+ }
+})();