@canvasengine/presets 2.0.0-beta.16 → 2.0.0-beta.18

package/dist/index.d.ts

@@ -7,6 +7,9 @@ interface BarProps {
     maxValue: number;
     width: number;
     height: number;
+    border?: any;
+    innerMargin?: number;
+    borderRadius?: number;
 }
 declare function Bar(opts: BarProps): canvasengine.Element<canvasengine.ComponentInstance>;
 
@@ -49,6 +52,4 @@ declare function Joystick(opts?: JoystickSettings): canvasengine.Element<canvase
 
 declare function TiledMap(props: any): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
 
-declare function ImageMap(props: any): canvasengine.Element<canvasengine.ComponentInstance> | Promise<canvasengine.Element<canvasengine.ComponentInstance>>;
-
-export { Bar, Direction, ImageMap, Joystick, type JoystickChangeEvent, type JoystickSettings, LightSpot, NightAmbiant, Particle, TiledMap };
+export { Bar, Direction, Joystick, type JoystickChangeEvent, type JoystickSettings, LightSpot, NightAmbiant, Particle, TiledMap };

package/dist/index.js

@@ -30,22 +30,22 @@ function Bar(opts) {
       ...opts,
       width,
       height,
-      draw(g) {
+      draw(graphics) {
         if (borderRadius()) {
-          g.roundRect(0, 0, width(), height(), borderRadius());
+          graphics.roundRect(0, 0, width(), height(), borderRadius());
         } else {
-          g.rect(0, 0, width(), height());
+          graphics.rect(0, 0, width(), height());
         }
         if (border) {
-          g.stroke(border);
+          graphics.stroke(border);
         }
-        g.fill(backgroundColor());
+        graphics.fill(backgroundColor());
       }
     },
     h(Graphics, {
       width,
       height,
-      draw(g) {
+      draw(graphics) {
         const margin = innerMargin();
         const _borderRadius = borderRadius();
         const w = Math.max(
@@ -55,18 +55,18 @@ function Bar(opts) {
             value() / maxValue() * (width() - 2 * margin)
           )
         );
-        const h7 = height() - 2 * margin;
+        const h6 = height() - 2 * margin;
         if (borderRadius) {
-          g.roundRect(margin, margin, w, h7, _borderRadius);
+          graphics.roundRect(margin, margin, w, h6, _borderRadius);
         } else {
-          g.rect(margin, margin, w, h7);
+          graphics.rect(margin, margin, w, h6);
         }
         const color = foregroundColor();
         if (color.startsWith("rgba")) {
-          const [r, g2, b, a] = color.match(/\d+(\.\d+)?/g).map(Number);
-          g2.fill({ color: rgbToHex(r, g2, b), alpha: a });
+          const [r, g, b, a] = color.match(/\d+(\.\d+)?/g).map(Number);
+          graphics.fill({ color: rgbToHex(r, g, b), alpha: a });
         } else {
-          g.fill(color);
+          graphics.fill(color);
         }
       }
     })
@@ -183,10 +183,10 @@ function NightAmbiant(props) {
     effect(() => {
       const { displayWidth, displayHeight } = el2.componentInstance;
       const w = +displayWidth();
-      const h7 = +displayHeight();
+      const h6 = +displayHeight();
       setTimeout(() => {
         width.update(() => w);
-        height.update(() => h7);
+        height.update(() => h6);
       }, 0);
     });
   });
@@ -424,9 +424,16 @@ import { TiledLayerType, TiledParserFile } from "@rpgjs/tiled";
 import { loop, h as h5, Container as Container4, TilingSprite, useProps as useProps4, effect as effect2, signal as signal3 } from "canvasengine";
 
 // src/Tilemap/TileLayer.ts
-import { CompositeTilemap, POINT_STRUCT_SIZE, settings } from "@pixi/tilemap";
+import {
+  CompositeTilemap,
+  settings
+} from "@pixi/tilemap";
 import { Layer } from "@rpgjs/tiled";
-import { createComponent, registerComponent, DisplayObject } from "canvasengine";
+import {
+  createComponent,
+  registerComponent,
+  DisplayObject
+} from "canvasengine";
 
 // src/Tilemap/Tile.ts
 import { AnimatedSprite, groupD8 } from "pixi.js";
@@ -456,6 +463,9 @@ var Tile = class _Tile extends AnimatedSprite {
     }
     return textures;
   }
+  get z() {
+    return this.properties.z ?? 0;
+  }
   get gid() {
     return this.tile.gid;
   }
@@ -496,8 +506,10 @@ var CanvasTileLayer = class _CanvasTileLayer extends DisplayObject(CompositeTile
   constructor() {
     super(...arguments);
     this._tiles = {};
+    // TODO: fix this, remove any. replace with Layer
+    this.frameTile = 0;
+    this.frameRateAnimation = 10;
   }
-  // TODO: fix this, remove any. replace with Layer
   static findTileSet(gid, tileSets) {
     let tileset;
     for (let i = tileSets.length - 1; i >= 0; i--) {
@@ -519,15 +531,9 @@ var CanvasTileLayer = class _CanvasTileLayer extends DisplayObject(CompositeTile
     const i = x + y * width;
     const tiledTile = this._layer.getTileByIndex(i);
     if (!tiledTile || tiledTile && tiledTile.gid == 0) return;
-    const tileset = _CanvasTileLayer.findTileSet(
-      tiledTile.gid,
-      this.tileSets
-    );
+    const tileset = _CanvasTileLayer.findTileSet(tiledTile.gid, this.tileSets);
     if (!tileset) return;
-    const tile = new Tile(
-      tiledTile,
-      tileset
-    );
+    const tile = new Tile(tiledTile, tileset);
     tile.x = x * tilewidth;
     tile.y = y * tileheight + (tileheight - tile.texture.height);
     tile._x = x;
@@ -542,56 +548,29 @@ var CanvasTileLayer = class _CanvasTileLayer extends DisplayObject(CompositeTile
     }
     return tile;
   }
-  /** @internal */
-  changeTile(x, y) {
-    const { tilewidth, tileheight } = this._layer;
-    x = Math.floor(x / tilewidth);
-    y = Math.floor(y / tileheight);
-    const oldTile = this._tiles[x + ";" + y];
-    const newTile = this.createTile(x, y);
-    if (!oldTile && newTile) {
-      this._addFrame(newTile, x, y);
-    } else {
-      if (newTile) {
-        const bufComposite = new CompositeTilemap();
-        const frame = bufComposite.tile(newTile.texture, newTile.x, newTile.y);
-        newTile.setAnimation(frame);
-        this._tiles[x + ";" + y] = newTile;
-        const pointsBufComposite = bufComposite.children[0].pointsBuf;
-        [0, 1, 4, 6, 7, 8].forEach((i) => {
-          if (this.pointsBuf) this.pointsBuf[oldTile.pointsBufIndex + i] = pointsBufComposite[i];
-        });
-        this.children[0].modificationMarker = 0;
-        this._addFrame(newTile, x, y);
-        this["modificationMarker"] = 0;
-      } else {
-        delete this._tiles[x + ";" + y];
-        if (this.pointsBuf) this.pointsBuf.splice(oldTile.pointsBufIndex, POINT_STRUCT_SIZE);
-      }
-    }
-  }
-  /** @internal */
-  get pointsBuf() {
-    const child = this.children[0];
-    if (!child) return null;
-    return child["pointsBuf"];
-  }
   _addFrame(tile, x, y) {
     const frame = this.tile(tile.texture, tile.x, tile.y, {
       rotate: tile.texture.rotate
     });
-    const pb = this.pointsBuf;
-    if (!pb) return null;
-    tile.pointsBufIndex = pb.length - POINT_STRUCT_SIZE;
     tile.setAnimation(frame);
     this._tiles[x + ";" + y] = tile;
   }
-  onMount(args) {
+  async onMount(args) {
     const { props } = args;
     this.tileSets = props.tilesets;
-    this._layer = new Layer({
-      ...props
-    }, this.tileSets);
+    this._layer = new Layer(
+      {
+        ...props
+      },
+      this.tileSets
+    );
+    const tick2 = props.context.tick;
+    this.subscriptionTick = tick2.observable.subscribe(({ value }) => {
+      if (value.frame % this.frameRateAnimation == 0) {
+        this.tileAnim = [this.frameTile, this.frameTile];
+        this.frameTile++;
+      }
+    });
     super.onMount(args);
   }
   onUpdate(props) {
@@ -613,6 +592,10 @@ var CanvasTileLayer = class _CanvasTileLayer extends DisplayObject(CompositeTile
       }
     }
   }
+  async onDestroy(parent) {
+    this.subscriptionTick.unsubscribe();
+    await super.onDestroy(parent);
+  }
 };
 registerComponent("CompositeTileLayer", CanvasTileLayer);
 function CompositeTileLayer(props) {
@@ -649,11 +632,87 @@ var TileSet = class extends TiledTilesetClass {
 };
 
 // src/Tilemap/index.ts
+function reorganizeLayersByTileZ(originalLayers, tilesets, mapData) {
+  const reorganizedLayers = [];
+  for (const layer of originalLayers) {
+    if (layer.type !== TiledLayerType.Tile) {
+      reorganizedLayers.push(layer);
+      continue;
+    }
+    const layersByZ = /* @__PURE__ */ new Map();
+    let layerData;
+    if (Array.isArray(layer.data)) {
+      layerData = layer.data.map((gid) => {
+        if (typeof gid === "number") {
+          return gid;
+        } else {
+          return parseInt(String(gid), 10);
+        }
+      });
+    } else {
+      reorganizedLayers.push(layer);
+      continue;
+    }
+    let tilesProcessed = 0;
+    let tilesWithZ = 0;
+    for (let i = 0; i < layerData.length; i++) {
+      const gid = layerData[i];
+      if (gid === 0) continue;
+      tilesProcessed++;
+      let tileset;
+      for (let j = tilesets.length - 1; j >= 0; j--) {
+        if (tilesets[j].firstgid && tilesets[j].firstgid <= gid) {
+          tileset = tilesets[j];
+          break;
+        }
+      }
+      if (!tileset) {
+        if (!layersByZ.has(0)) {
+          layersByZ.set(0, new Array(layerData.length).fill(0));
+        }
+        layersByZ.get(0)[i] = gid;
+        continue;
+      }
+      const localTileId = gid - tileset.firstgid;
+      const tileProperties = tileset.tileset.tiles?.[localTileId]?.properties;
+      const zValue = tileProperties?.z ?? 0;
+      if (tileProperties?.z !== void 0) {
+        tilesWithZ++;
+      }
+      if (!layersByZ.has(zValue)) {
+        layersByZ.set(zValue, new Array(layerData.length).fill(0));
+      }
+      layersByZ.get(zValue)[i] = gid;
+    }
+    const sortedZValues = Array.from(layersByZ.keys()).sort((a, b) => a - b);
+    for (const zValue of sortedZValues) {
+      const layerDataForZ = layersByZ.get(zValue);
+      if (layerDataForZ.some((gid) => gid !== 0)) {
+        const newLayer = {
+          ...layer,
+          name: `${layer.name}_z${zValue}`,
+          // Always add _z suffix
+          data: layerDataForZ,
+          properties: {
+            ...layer.properties,
+            z: zValue
+          }
+        };
+        reorganizedLayers.push(newLayer);
+      }
+    }
+  }
+  reorganizedLayers.sort((a, b) => {
+    const zA = a.properties?.z ?? 0.5;
+    const zB = b.properties?.z ?? 0.5;
+    return zA - zB;
+  });
+  return reorganizedLayers;
+}
 function TiledMap(props) {
-  const { map, basePath } = useProps4(props);
+  const { map, basePath, createLayersPerTilesZ } = useProps4(props);
   const layers = signal3([]);
   const objectLayer = props.objectLayer;
-  const child = props.children[0];
   let tilesets = [];
   let mapData = {};
   const parseTmx = async (file, relativePath = "") => {
@@ -677,10 +736,15 @@ function TiledMap(props) {
     const _map = map();
     if (_map) {
       mapData = await parseTmx(_map, basePath());
+      tilesets = [];
       for (let tileSet of mapData.tilesets) {
         tilesets.push(await new TileSet(tileSet).load(tileSet.image.source));
       }
-      layers.set(mapData.layers);
+      let finalLayers = mapData.layers;
+      if (createLayersPerTilesZ()) {
+        finalLayers = reorganizeLayersByTileZ(mapData.layers, tilesets, mapData);
+      }
+      layers.set(finalLayers);
     }
   });
   const createLayer = (layers2, props2 = {}) => {
@@ -708,8 +772,8 @@ function TiledMap(props) {
         case TiledLayerType.Group:
           return createLayer(signal3(layer.layers), layer);
         case TiledLayerType.ObjectGroup:
-          const child2 = objectLayer?.(layer);
-          return h5(Container4, layer, child2);
+          const child = objectLayer?.(layer);
+          return h5(Container4, layer, child);
         default:
           return h5(Container4);
       }
@@ -717,56 +781,9 @@ function TiledMap(props) {
   };
   return h5(Container4, props, createLayer(layers));
 }
-
-// src/DrawMap/index.ts
-import { effect as effect3, signal as signal4, loop as loop2, h as h6, Container as Container5, Sprite as Sprite2, useProps as useProps5 } from "canvasengine";
-function ImageMap(props) {
-  const { imageSource, tileData } = useProps5(props);
-  const tiles = signal4([]);
-  effect3(async () => {
-    const data = await fetch(tileData()).then((response) => response.json());
-    const objects = data;
-    if (props.objects) {
-      objects.push(...props.objects(data));
-    }
-    tiles.set(objects);
-  });
-  const createLayeredTiles = () => {
-    const layers = [createTileLayer(0), createTileLayer(1, true), createTileLayer(2)];
-    return h6(Container5, props, ...layers);
-  };
-  const createTileLayer = (layerIndex, sortableChildren = false) => {
-    return h6(
-      Container5,
-      {
-        sortableChildren
-      },
-      // TODO: fix this (remove any)
-      loop2(tiles, (object) => {
-        if (object.tag && layerIndex == 1) {
-          return object;
-        }
-        object.layerIndex || (object.layerIndex = 1);
-        if (object.layerIndex !== layerIndex) return null;
-        const [x, y, width, height] = object.rect;
-        const [drawX, drawY] = object.drawIn;
-        return h6(Sprite2, {
-          image: imageSource(),
-          x: drawX,
-          y: drawY,
-          rectangle: { x, y, width, height },
-          zIndex: drawY + height - 70
-          // zIndex: 0
-        });
-      })
-    );
-  };
-  return createLayeredTiles();
-}
 export {
   Bar,
   Direction,
-  ImageMap,
   Joystick,
   LightSpot,
   NightAmbiant,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Bar.ts","../src/Particle.ts","../src/NightAmbiant.ts","../src/Joystick.ts","../src/Tilemap/index.ts","../src/Tilemap/TileLayer.ts","../src/Tilemap/Tile.ts","../src/Tilemap/TileSet.ts","../src/DrawMap/index.ts"],"sourcesContent":["import { Graphics, h, useProps } from \"canvasengine\";\nimport * as PIXI from \"pixi.js\";\n\ninterface BarProps {\n  backgroundColor?: string;\n  foregroundColor?: string;\n  value: number;\n  maxValue: number;\n  width: number;\n  height: number;\n}\n\nfunction componentToHex(c) {\n  var hex = c.toString(16);\n  return hex.length == 1 ? \"0\" + hex : hex;\n}\n\nfunction rgbToHex(r, g, b) {\n  return \"#\" + componentToHex(r) + componentToHex(g) + componentToHex(b);\n}\n\nexport function Bar(opts: BarProps) {\n  const {\n    width,\n    height,\n    value,\n    maxValue,\n    backgroundColor,\n    foregroundColor,\n    border,\n    innerMargin,\n    borderRadius,\n  } = useProps(opts, {\n    backgroundColor: \"#000000\",\n    foregroundColor: \"#FFFFFF\",\n    innerMargin: 0,\n    borderRadius: 0,\n  });\n\n  return h(\n    Graphics,\n    {\n      ...opts,\n      width,\n      height,\n      draw(g: PIXI.Graphics) {\n        if (borderRadius()) {\n          g.roundRect(0, 0, width(), height(), borderRadius());\n        } else {\n          g.rect(0, 0, width(), height());\n        }\n        if (border) {\n          g.stroke(border);\n        }\n        g.fill(backgroundColor());\n      },\n    },\n    h(Graphics, {\n      width,\n      height,\n      draw(g: PIXI.Graphics) {\n        const margin = innerMargin();\n        const _borderRadius = borderRadius();\n        const w = Math.max(\n          0,\n          Math.min(\n            width() - 2 * margin,\n            (value() / maxValue()) * (width() - 2 * margin)\n          )\n        );\n        const h = height() - 2 * margin;\n        if (borderRadius) {\n          g.roundRect(margin, margin, w, h, _borderRadius);\n        } else {\n          g.rect(margin, margin, w, h);\n        }\n        const color = foregroundColor();\n        if (color.startsWith(\"rgba\")) {\n          const [r, g, b, a] = color.match(/\\d+(\\.\\d+)?/g).map(Number);\n          g.fill({ color: rgbToHex(r, g, b), alpha: a });\n        } else {\n          g.fill(color);\n        }\n      },\n    })\n  );\n}\n","import * as PIXI from \"pixi.js\";\nimport { FX } from \"revolt-fx\";\nimport { h, mount, tick, Container, on, useProps } from \"canvasengine\";\n\nexport function Particle(options) {\n  const { emit, settings = {} } = options;\n  const { name } = useProps(options);\n  const fx = new FX();\n  let element;\n\n  PIXI.Assets.add({ alias: \"fx_settings\", src: \"/default-bundle.json\" });\n  PIXI.Assets.add({\n    alias: \"fx_spritesheet\",\n    src: \"/revoltfx-spritesheet.json\",\n  });\n\n  tick(({deltaRatio}) => {\n    fx.update(deltaRatio);\n  });\n\n  mount(async (_element) => {\n    element = _element;\n\n    const data = await PIXI.Assets.load([\"fx_settings\", \"fx_spritesheet\"]);\n    let fxSettings = {...data.fx_settings};\n\n    if (settings.emitters) {\n      const lastId = 10000;\n      const emittersWithIds = settings.emitters.map((emitter, index) => ({\n        ...emitter,\n        id: lastId + index\n      }));\n\n      fxSettings.emitters = [\n        ...fxSettings.emitters,\n        ...emittersWithIds,\n      ];\n\n    }\n\n    fx.initBundle(fxSettings, true);\n  });\n\n  on(emit, () => {\n    const emitter = fx.getParticleEmitter(name());\n    emitter.init(element.componentInstance);\n  });\n\n  return h(Container);\n}\n","import { Container, Graphics, h, mount, useProps, animatedSignal, RadialGradient, effect, isSignal, signal, isObservable } from \"canvasengine\";\n\nexport function LightSpot(opts) {\n  const { radius } = useProps(opts);\n  const scale = animatedSignal(1);\n\n  const minScale = 1;\n  const maxScale = 2; // Reduced max scale for subtler effect\n  const scintillationSpeed = 0.001; // Significantly reduced for slower scintillation\n\n  const animate = () => {\n    // Use time-based animation for smoother, slower scintillation\n    const time = Date.now() * scintillationSpeed;\n\n    // Combine multiple sine waves for a more natural, less predictable effect\n    const scintillationFactor =\n      (Math.sin(time) + Math.sin(time * 1.3) + Math.sin(time * 0.7)) / 3;\n\n    // Map the scintillation factor to the scale range\n    const newScale =\n      minScale + (maxScale - minScale) * (scintillationFactor * 0.5 + 0.5);\n\n    scale.update(() => newScale);\n\n    requestAnimationFrame(animate);\n  };\n\n  animate();\n\n  const draw = (g) => {\n    const size = radius() * 2;\n    const gradient = new RadialGradient(size, size, 0, size, size, 0);\n    gradient.addColorStop(0, \"rgba(255, 255, 0, 1)\");\n    gradient.addColorStop(0.5, \"rgba(255, 255, 0, 0.3)\");\n    gradient.addColorStop(0.8, \"rgba(255, 255, 0, 0)\");\n\n    const translate = size / 2;\n\n    g.rect(-translate, -translate, size, size).fill(\n      gradient.render({ translate: { x: translate, y: translate } })\n    );\n  };\n\n  return h(Graphics, {\n    draw,\n    ...opts,\n    scale,\n  });\n}\n\nexport function NightAmbiant(props) {\n  const { children } = props;\n  let el\n  const width = signal(0);\n  const height = signal(0);\n  let subscription\n  const draw = (rectAndHole) => {\n    const margin = 80\n    rectAndHole.rect(-margin, -margin, width() + margin*2, height() + margin*2);\n    rectAndHole.fill(0x000000);\n    const applyChildren = (child) => {\n      const x = isSignal(child.propObservables.x)\n        ? child.propObservables.x()\n        : child.props.x;\n      const y = isSignal(child.propObservables.y)\n        ? child.propObservables.y()\n        : child.props.y;\n      const radius = isSignal(child.propObservables.radius)\n        ? child.propObservables.radius()\n        : child.props.radius;\n      rectAndHole.circle(x, y, radius);\n      rectAndHole.cut();\n    }\n    for (let child of children) {\n      if (isObservable(child)) {\n        if (subscription) {\n          subscription.unsubscribe()\n        }\n        subscription = child.subscribe((event: any) => {\n           for (let child of event.fullElements) {\n            applyChildren(child)\n           }\n        })\n        return\n      }\n      applyChildren(child)\n    }\n  };\n\n  mount((el) => {\n    effect(() => {\n      const { displayWidth, displayHeight } = el.componentInstance as any\n      const w = +displayWidth()\n      const h = +displayHeight()\n      setTimeout(() => {\n        width.update(() => w)\n        height.update(() => h)\n      }, 0) // hack\n    });\n  });\n\n  return h(\n    Container,\n    {\n      width: \"100%\",\n      height: \"100%\",\n      ...props,\n    },\n    h(Graphics, {\n      draw,\n      alpha: 0.8,\n      blur: 80,\n    }),\n    ...children\n  );\n}\n","/*\n * Joystick\n *\n * Inspired by https://github.com/endel/pixi-virtual-joystick\n */\n\nimport * as PIXI from \"pixi.js\";\nimport { Container, Graphics, Sprite, h, signal } from \"canvasengine\";\n\nexport interface JoystickChangeEvent {\n  angle: number;\n  direction: Direction;\n  power: number;\n}\n\nexport enum Direction {\n  LEFT = \"left\",\n  TOP = \"top\",\n  BOTTOM = \"bottom\",\n  RIGHT = \"right\",\n  TOP_LEFT = \"top_left\",\n  TOP_RIGHT = \"top_right\",\n  BOTTOM_LEFT = \"bottom_left\",\n  BOTTOM_RIGHT = \"bottom_right\",\n}\n\nexport interface JoystickSettings {\n  outer?: string;\n  inner?: string;\n  outerScale?: { x: number; y: number };\n  innerScale?: { x: number; y: number };\n  onChange?: (data: JoystickChangeEvent) => void;\n  onStart?: () => void;\n  onEnd?: () => void;\n}\n\nexport function Joystick(opts: JoystickSettings = {}) {\n  const settings = Object.assign(\n    {\n      outerScale: { x: 1, y: 1 },\n      innerScale: { x: 1, y: 1 },\n    },\n    opts\n  );\n\n  let outerRadius = 70;\n  let innerRadius = 10;\n  const innerAlphaStandby = 0.5;\n\n  let dragging = false;\n  let startPosition: PIXI.PointData | null = null;\n  let power = 0;\n\n  const innerPositionX = signal(0);\n  const innerPositionY = signal(0);\n  const innerAlpha = signal(innerAlphaStandby);\n\n  function getPower(centerPoint: PIXI.Point) {\n    const a = centerPoint.x - 0;\n    const b = centerPoint.y - 0;\n    return Math.min(1, Math.sqrt(a * a + b * b) / outerRadius);\n  }\n\n  function getDirection(center: PIXI.Point) {\n    let rad = Math.atan2(center.y, center.x); // [-PI, PI]\n    if ((rad >= -Math.PI / 8 && rad < 0) || (rad >= 0 && rad < Math.PI / 8)) {\n      return Direction.RIGHT;\n    } else if (rad >= Math.PI / 8 && rad < (3 * Math.PI) / 8) {\n      return Direction.BOTTOM_RIGHT;\n    } else if (rad >= (3 * Math.PI) / 8 && rad < (5 * Math.PI) / 8) {\n      return Direction.BOTTOM;\n    } else if (rad >= (5 * Math.PI) / 8 && rad < (7 * Math.PI) / 8) {\n      return Direction.BOTTOM_LEFT;\n    } else if (\n      (rad >= (7 * Math.PI) / 8 && rad < Math.PI) ||\n      (rad >= -Math.PI && rad < (-7 * Math.PI) / 8)\n    ) {\n      return Direction.LEFT;\n    } else if (rad >= (-7 * Math.PI) / 8 && rad < (-5 * Math.PI) / 8) {\n      return Direction.TOP_LEFT;\n    } else if (rad >= (-5 * Math.PI) / 8 && rad < (-3 * Math.PI) / 8) {\n      return Direction.TOP;\n    } else {\n      return Direction.TOP_RIGHT;\n    }\n  }\n\n  function handleDragStart(event: PIXI.FederatedPointerEvent) {\n    startPosition = event.getLocalPosition(this);\n    dragging = true;\n    innerAlpha.set(1);\n    settings.onStart?.();\n  }\n\n  function handleDragEnd() {\n    if (!dragging) return;\n    innerPositionX.set(0);\n    innerPositionY.set(0);\n    dragging = false;\n    innerAlpha.set(innerAlphaStandby);\n    settings.onEnd?.();\n  }\n\n  function handleDragMove(event: PIXI.FederatedPointerEvent) {\n    if (dragging == false) {\n      return;\n    }\n\n    let newPosition = event.getLocalPosition(this);\n\n    let sideX = newPosition.x - (startPosition?.x ?? 0);\n    let sideY = newPosition.y - (startPosition?.y ?? 0);\n\n    let centerPoint = new PIXI.Point(0, 0);\n    let angle = 0;\n\n    if (sideX == 0 && sideY == 0) {\n      return;\n    }\n\n    let calRadius = 0;\n\n    if (sideX * sideX + sideY * sideY >= outerRadius * outerRadius) {\n      calRadius = outerRadius;\n    } else {\n      calRadius = outerRadius - innerRadius;\n    }\n\n    /**\n     * x:   -1 <-> 1\n     * y:   -1 <-> 1\n     *          Y\n     *          ^\n     *          |\n     *     180  |  90\n     *    ------------> X\n     *     270  |  360\n     *          |\n     *          |\n     */\n\n    let direction = Direction.LEFT;\n\n    if (sideX == 0) {\n      if (sideY > 0) {\n        centerPoint.set(0, sideY > outerRadius ? outerRadius : sideY);\n        angle = 270;\n        direction = Direction.BOTTOM;\n      } else {\n        centerPoint.set(\n          0,\n          -(Math.abs(sideY) > outerRadius ? outerRadius : Math.abs(sideY))\n        );\n        angle = 90;\n        direction = Direction.TOP;\n      }\n      innerPositionX.set(centerPoint.x);\n      innerPositionY.set(centerPoint.y);\n      power = getPower(centerPoint);\n      settings.onChange?.({ angle, direction, power });\n      return;\n    }\n\n    if (sideY == 0) {\n      if (sideX > 0) {\n        centerPoint.set(\n          Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX),\n          0\n        );\n        angle = 0;\n        direction = Direction.LEFT;\n      } else {\n        centerPoint.set(\n          -(Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX)),\n          0\n        );\n        angle = 180;\n        direction = Direction.RIGHT;\n      }\n\n      innerPositionX.set(centerPoint.x);\n      innerPositionY.set(centerPoint.y);\n      power = getPower(centerPoint);\n      settings.onChange?.({ angle, direction, power });\n      return;\n    }\n\n    let tanVal = Math.abs(sideY / sideX);\n    let radian = Math.atan(tanVal);\n    angle = (radian * 180) / Math.PI;\n\n    let centerX = 0;\n    let centerY = 0;\n\n    if (sideX * sideX + sideY * sideY >= outerRadius * outerRadius) {\n      centerX = outerRadius * Math.cos(radian);\n      centerY = outerRadius * Math.sin(radian);\n    } else {\n      centerX = Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX);\n      centerY = Math.abs(sideY) > outerRadius ? outerRadius : Math.abs(sideY);\n    }\n\n    if (sideY < 0) {\n      centerY = -Math.abs(centerY);\n    }\n    if (sideX < 0) {\n      centerX = -Math.abs(centerX);\n    }\n\n    if (sideX > 0 && sideY < 0) {\n      // < 90\n    } else if (sideX < 0 && sideY < 0) {\n      // 90 ~ 180\n      angle = 180 - angle;\n    } else if (sideX < 0 && sideY > 0) {\n      // 180 ~ 270\n      angle = angle + 180;\n    } else if (sideX > 0 && sideY > 0) {\n      // 270 ~ 369\n      angle = 360 - angle;\n    }\n    centerPoint.set(centerX, centerY);\n    power = getPower(centerPoint);\n\n    direction = getDirection(centerPoint);\n    innerPositionX.set(centerPoint.x);\n    innerPositionY.set(centerPoint.y);\n\n    settings.onChange?.({ angle, direction, power });\n  }\n\n  let innerElement;\n  let outerElement;\n\n  if (!settings.outer) {\n    outerElement = h(Graphics, {\n      draw: (g) => {\n        g.circle(0, 0, outerRadius).fill(0x000000);\n      },\n      alpha: 0.5,\n    });\n  } else {\n    outerElement = h(Sprite, {\n      image: settings.outer,\n      anchor: { x: 0.5, y: 0.5 },\n      scale: settings.outerScale,\n    });\n  }\n\n  const innerOptions: any = {\n    scale: settings.innerScale,\n    x: innerPositionX,\n    y: innerPositionY,\n    alpha: innerAlpha,\n  };\n\n  if (!settings.inner) {\n    innerElement = h(Graphics, {\n      draw: (g) => {\n        g.circle(0, 0, innerRadius * 2.5).fill(0x000000);\n      },\n      ...innerOptions,\n    });\n  } else {\n    innerElement = h(Sprite, {\n      image: settings.inner,\n      anchor: { x: 0.5, y: 0.5 },\n      ...innerOptions,\n    });\n  }\n\n  return h(\n    Container,\n    {\n      ...opts,\n      pointerdown: handleDragStart,\n      pointerup: handleDragEnd,\n      pointerupoutside: handleDragEnd,\n      pointermove: handleDragMove,\n    },\n    outerElement,\n    innerElement\n  );\n}\n","import { TiledLayer, TiledLayerType, TiledMap, TiledParserFile, TiledTileset } from \"@rpgjs/tiled\"\nimport { loop, h, Container, TilingSprite, useProps, effect, signal } from \"canvasengine\"\nimport { CompositeTileLayer } from \"./TileLayer\"\nimport { TileSet } from \"./TileSet\"\n\nexport function TiledMap(props) {\n    const { map, basePath } = useProps(props)\n    const layers = signal<TiledLayer[]>([])\n    const objectLayer = props.objectLayer\n    const child = props.children[0]\n    let tilesets: TiledTileset[] = []\n    let mapData: TiledMap = {} as TiledMap\n\n    const parseTmx = async (file: string, relativePath: string = '') => {\n        if (typeof file !== 'string') {\n            return file\n        }\n        // @ts-ignore\n        const parser = new TiledParserFile(\n            file,\n            {\n                basePath: '',\n                staticDir: '',\n                relativePath\n            }\n        )\n        const data = await parser.parseFilePromise({\n            getOnlyBasename: false\n        })\n\n        return data\n    }\n\n    effect(async () => {\n        const _map = map()\n        if (_map) {\n            mapData = await parseTmx(_map, basePath())\n            for (let tileSet of mapData.tilesets) {\n                tilesets.push(await new TileSet(tileSet).load(tileSet.image.source))\n            }\n            layers.set(mapData.layers)\n        }\n    })\n\n    const createLayer = (layers, props = {}) => {\n        return h(Container, props, loop<any>(layers, (layer) => {\n            switch (layer.type) {\n                case TiledLayerType.Tile:\n                    return h(CompositeTileLayer, {\n                        tilewidth: mapData.tilewidth,\n                        tileheight: mapData.tileheight,\n                        // @ts-ignore\n                        width: mapData.width,\n                        // @ts-ignore\n                        height: mapData.height,\n                        ...layer,\n                        tilesets\n                    })\n                case TiledLayerType.Image:\n                    const { width, height, source } = layer.image\n                    return h(TilingSprite, {\n                        image: source,\n                        ...layer,\n                        width: layer.repeatx ? layer.width * layer.tilewidth : width,\n                        height: layer.repeaty ? layer.height * layer.tileheight : height\n                    })\n                case TiledLayerType.Group:\n                    return createLayer(signal(layer.layers), layer)\n                case TiledLayerType.ObjectGroup:\n                    const child = objectLayer?.(layer)\n                    return h(Container, layer, child)\n                default:\n                    return h(Container)\n            }\n        }))\n    }\n\n    return h(Container, props, createLayer(layers))\n}","import { CompositeTilemap, POINT_STRUCT_SIZE, Tilemap, settings } from '@pixi/tilemap';\nimport { Layer, Tile as TileClass } from '@rpgjs/tiled';\nimport { createComponent, registerComponent, DisplayObject } from 'canvasengine';\nimport { Tile } from './Tile';\nimport { TileSet } from './TileSet';\n\nsettings.use32bitIndex = true\n\nexport class CanvasTileLayer extends DisplayObject(CompositeTilemap) {\n    private _tiles: any = {}\n    tiles: (TileClass | null)[]\n    private _layer: any // TODO: fix this, remove any. replace with Layer\n\n    static findTileSet(gid: number, tileSets: TileSet[]) {\n        let tileset: TileSet | undefined\n        for (let i = tileSets.length - 1; i >= 0; i--) {\n            tileset = tileSets[i]\n            if (tileset.firstgid && tileset.firstgid <= gid) {\n                break;\n            }\n        }\n        return tileset;\n    }\n\n    /** @internal */\n    createTile(x: number, y: number, options: any = {}): Tile | undefined {\n        const { real, filter } = options\n        const { tilewidth, tileheight, width } = this._layer\n        if (real) {\n            x = Math.floor(x / tilewidth)\n            y = Math.floor(y / tileheight)\n        }\n        const i = x + y * width;\n        const tiledTile = this._layer.getTileByIndex(i)\n\n        if (!tiledTile || (tiledTile && tiledTile.gid == 0)) return\n\n        const tileset = CanvasTileLayer.findTileSet(\n            tiledTile.gid,\n            this.tileSets\n        )\n\n        if (!tileset) return\n\n        const tile = new Tile(\n            tiledTile,\n            tileset\n        )\n\n        tile.x = x * tilewidth;\n        tile.y =\n            y * tileheight +\n            (tileheight -\n                tile.texture.height);\n\n        tile._x = x;\n        tile._y = y;\n\n        if (tileset.tileoffset) {\n            tile.x += tileset.tileoffset.x ?? 0;\n            tile.y += tileset.tileoffset.y ?? 0;\n        }\n\n        if (filter) {\n            const ret = filter(tile)\n            if (!ret) return\n        }\n\n        return tile\n    }\n\n    /** @internal */\n    changeTile(x: number, y: number) {\n        const { tilewidth, tileheight } = this._layer\n        x = Math.floor(x / tilewidth)\n        y = Math.floor(y / tileheight)\n        const oldTile: Tile = this._tiles[x + ';' + y]\n        const newTile = this.createTile(x, y)\n        if (!oldTile && newTile) {\n            this._addFrame(newTile, x, y)\n        }\n        else {\n            if (newTile) {\n                const bufComposite: CompositeTilemap = new CompositeTilemap()\n                const frame = bufComposite.tile(newTile.texture, newTile.x, newTile.y)\n                newTile.setAnimation(frame)\n                this._tiles[x + ';' + y] = newTile\n                // @ts-ignore\n                const pointsBufComposite = (bufComposite.children[0] as Tilemap).pointsBuf\n                    // Change Texture (=0, 1 and 7, rotate (=4), animX (=5), animY (=6))\n                    ;[0, 1, 4, 6, 7, 8].forEach((i) => {\n                        if (this.pointsBuf) this.pointsBuf[oldTile.pointsBufIndex + i] = pointsBufComposite[i]\n                    })\n                // @ts-ignore\n                this.children[0].modificationMarker = 0\n                this._addFrame(newTile, x, y)\n                this['modificationMarker'] = 0\n            }\n            else {\n                delete this._tiles[x + ';' + y]\n                if (this.pointsBuf) this.pointsBuf.splice(oldTile.pointsBufIndex, POINT_STRUCT_SIZE)\n            }\n        }\n    }\n\n    /** @internal */\n    get pointsBuf(): number[] | null {\n        const child = this.children[0] as Tilemap\n        if (!child) return null\n        return child['pointsBuf']\n    }\n\n    private _addFrame(tile: Tile, x: number, y: number) {\n        const frame = this.tile(tile.texture, tile.x, tile.y, {\n            rotate: tile.texture.rotate\n        })\n        const pb = this.pointsBuf\n        if (!pb) return null\n        tile.pointsBufIndex = pb.length - POINT_STRUCT_SIZE\n        tile.setAnimation(frame)\n        this._tiles[x + ';' + y] = tile\n    }\n\n    onMount(args) {\n        const { props } = args\n        this.tileSets = props.tilesets\n        this._layer = new Layer({\n            ...props\n        }, this.tileSets)\n        super.onMount(args)\n    }\n\n    onUpdate(props) {\n        super.onUpdate(props)\n        if (!this.isMounted) return\n        if (props.tileheight) this._layer.tileheight = props.tileheight\n        if (props.tilewidth) this._layer.tilewidth = props.tilewidth\n        if (props.width) this._layer.width = props.width\n        if (props.height) this._layer.height = props.height\n        if (props.parallaxX) this._layer.parallaxX = props.parallaxx\n        if (props.parallaxY) this._layer.parallaxY = props.parallaxy\n\n        this.removeChildren()\n\n        for (let y = 0; y < this._layer.height; y++) {\n            for (let x = 0; x < this._layer.width; x++) {\n                const tile = this.createTile(x, y)\n                if (tile) {\n                    this._addFrame(tile, x, y)\n                }\n            }\n        }\n    }\n}\n\nexport interface CanvasTileLayer extends CompositeTilemap { }\n\nregisterComponent('CompositeTileLayer', CanvasTileLayer)\n\nexport function CompositeTileLayer(props) {\n    return createComponent('CompositeTileLayer', props)\n}","import { CompositeTilemap } from \"@pixi/tilemap\";\nimport { Tile as TiledTileClass } from '@rpgjs/tiled';\nimport { AnimatedSprite, Texture, groupD8 } from \"pixi.js\";\nimport { TileSet } from \"./TileSet\";\n\nexport class Tile extends AnimatedSprite {\n    static getTextures(tile: TiledTileClass, tileSet: TileSet) {\n        const textures: Texture[] = [];\n\n        if (tile.animations && tile.animations.length) {\n            tile.animations.forEach(frame => {\n                textures.push(tileSet.textures[frame.tileid])\n            });\n        } else {\n            textures.push(tileSet.textures[tile.gid - tileSet.firstgid])\n        }\n\n        return textures;\n    }\n\n    animations: { tileid: number, duration: number }[] = []\n    _x: number = 0\n    _y: number = 0\n    pointsBufIndex: number\n    properties: any = {}\n\n    constructor(\n        private tile: TiledTileClass,\n        private tileSet: TileSet\n    ) {\n        super(Tile.getTextures(tile, tileSet));\n        this.animations = tile.animations || []\n        this.properties = tile.properties\n        this.textures = Tile.getTextures(tile, tileSet)\n        this.texture = this.textures[0] as Texture\n        this.flip()\n    }\n\n    get gid() {\n        return this.tile.gid\n    }\n\n    setAnimation(frame: CompositeTilemap) {\n        const size = this.animations.length\n        if (size > 1) {\n            const offset = (this.animations[1].tileid - this.animations[0].tileid) * this.width\n            frame.tileAnimX(offset, size)\n        }\n    }\n\n    flip() {\n        let symmetry\n        let i = 0\n        const add = (symmetrySecond) => {\n            i++\n            if (symmetry) symmetry = groupD8.add(symmetry, symmetrySecond)\n            else symmetry = symmetrySecond\n        }\n\n        if (this.tile.horizontalFlip) {\n            add(groupD8.MIRROR_HORIZONTAL)\n        }\n\n        if (this.tile.verticalFlip) {\n            add(groupD8.MIRROR_VERTICAL)\n        }\n\n        if (this.tile.diagonalFlip) {\n            if (i % 2 == 0) {\n                add(groupD8.MAIN_DIAGONAL)\n            }\n            else {\n                add(groupD8.REVERSE_DIAGONAL)\n            }\n        }\n\n        //if (symmetry) this.texture.rotate = symmetry\n    }\n}","import { TiledTileset, Tileset as TiledTilesetClass } from \"@rpgjs/tiled\";\nimport { Assets, Rectangle, Texture } from \"pixi.js\";\n\nexport class TileSet extends TiledTilesetClass {\n  public textures: Texture[] = [];\n  private tileGroups = {};\n\n  constructor(tileSet: TiledTileset) {\n    super(tileSet);\n  }\n\n  loadGroup() {\n    // for (let tile of this.tileset.tiles) {\n    // }\n  }\n\n  /** @internal */\n  async load(image: string) {\n    const texture = await Assets.load(image);\n    for (\n      let y = this.margin;\n      y < this.image.height;\n      y += this.tileheight + this.spacing\n    ) {\n      for (\n        let x = this.margin;\n        x < this.image.width;\n        x += this.tilewidth + this.spacing\n      ) {\n        this.textures.push(\n          new Texture({\n            source: texture.source,\n            frame: new Rectangle(+x, +y, +this.tilewidth, +this.tileheight),\n          })\n        );\n      }\n    }\n    this.loadGroup();\n    return this;\n  }\n}\n","import { effect, signal, loop, h, Container, Sprite, useProps } from \"canvasengine\";\n\ninterface TileData {\n  id: number;\n  rect: [number, number, number, number];\n  drawIn: [number, number];\n  layerIndex: number;\n}\n\nexport function ImageMap(props) {\n  const { imageSource, tileData } = useProps(props);\n  const tiles = signal<TileData[]>([]);\n\n  effect(async () => {\n    const data = await fetch(tileData()).then((response) => response.json());\n    const objects = data;\n    if (props.objects) {\n      objects.push(...props.objects(data));\n    }\n    tiles.set(objects);\n  });\n\n  const createLayeredTiles = () => {\n    const layers = [createTileLayer(0), createTileLayer(1, true), createTileLayer(2)];\n\n    return h(Container, props, ...layers);\n  };\n\n  const createTileLayer = (layerIndex: number, sortableChildren = false) => {\n    return h(\n      Container,\n      {\n        sortableChildren,\n      },\n      // TODO: fix this (remove any)\n      loop(tiles, (object: any) => {\n        if (object.tag && layerIndex == 1) {\n            return object\n        }\n\n        object.layerIndex ||= 1;\n        if (object.layerIndex !== layerIndex) return null;\n\n        const [x, y, width, height] = object.rect;\n        const [drawX, drawY] = object.drawIn;\n\n        return h(Sprite, {\n          image: imageSource(),\n          x: drawX,\n          y: drawY,\n          rectangle: { x, y, width, height },\n          zIndex: drawY + height - 70,\n        // zIndex: 0\n        });\n      })\n    );\n  };\n\n  return createLayeredTiles();\n}\n"],"mappings":"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","names":["h","g","h","useProps","settings","Container","Graphics","h","mount","useProps","child","el","PIXI","Container","Graphics","h","signal","Direction","settings","h","Container","useProps","effect","signal","Assets","Texture","useProps","signal","effect","layers","props","h","Container","child","effect","signal","loop","h","Container","Sprite","useProps"]}
+{"version":3,"sources":["../src/Bar.ts","../src/Particle.ts","../src/NightAmbiant.ts","../src/Joystick.ts","../src/Tilemap/index.ts","../src/Tilemap/TileLayer.ts","../src/Tilemap/Tile.ts","../src/Tilemap/TileSet.ts"],"sourcesContent":["import { Graphics, h, useProps } from \"canvasengine\";\nimport * as PIXI from \"pixi.js\";\n\ninterface BarProps {\n  backgroundColor?: string;\n  foregroundColor?: string;\n  value: number;\n  maxValue: number;\n  width: number;\n  height: number;\n  border?: any;\n  innerMargin?: number;\n  borderRadius?: number;\n}\n\nfunction componentToHex(c) {\n  var hex = c.toString(16);\n  return hex.length == 1 ? \"0\" + hex : hex;\n}\n\nfunction rgbToHex(r, g, b) {\n  return \"#\" + componentToHex(r) + componentToHex(g) + componentToHex(b);\n}\n\nexport function Bar(opts: BarProps) {\n  const {\n    width,\n    height,\n    value,\n    maxValue,\n    backgroundColor,\n    foregroundColor,\n    border,\n    innerMargin,\n    borderRadius,\n  } = useProps(opts, {\n    backgroundColor: \"#000000\",\n    foregroundColor: \"#FFFFFF\",\n    innerMargin: 0,\n    borderRadius: 0,\n  });\n\n  return h(\n    Graphics,\n    {\n      ...opts,\n      width,\n      height,\n      draw(graphics: any) {\n        if (borderRadius()) {\n          graphics.roundRect(0, 0, width(), height(), borderRadius());\n        } else {\n          graphics.rect(0, 0, width(), height());\n        }\n        if (border) {\n          graphics.stroke(border);\n        }\n        graphics.fill(backgroundColor());\n      },\n    },\n    h(Graphics, {\n      width,\n      height,\n      draw(graphics: any) {\n        const margin = innerMargin();\n        const _borderRadius = borderRadius();\n        const w = Math.max(\n          0,\n          Math.min(\n            width() - 2 * margin,\n            (value() / maxValue()) * (width() - 2 * margin)\n          )\n        );\n        const h = height() - 2 * margin;\n        if (borderRadius) {\n          graphics.roundRect(margin, margin, w, h, _borderRadius);\n        } else {\n          graphics.rect(margin, margin, w, h);\n        }\n        const color = foregroundColor();\n        if (color.startsWith(\"rgba\")) {\n          const [r, g, b, a] = color.match(/\\d+(\\.\\d+)?/g).map(Number);\n          graphics.fill({ color: rgbToHex(r, g, b), alpha: a });\n        } else {\n          graphics.fill(color);\n        }\n      },\n    })\n  );\n}\n","import * as PIXI from \"pixi.js\";\nimport { FX } from \"revolt-fx\";\nimport { h, mount, tick, Container, on, useProps } from \"canvasengine\";\n\nexport function Particle(options) {\n  const { emit, settings = {} } = options;\n  const { name } = useProps(options);\n  const fx = new FX();\n  let element;\n\n  PIXI.Assets.add({ alias: \"fx_settings\", src: \"/default-bundle.json\" });\n  PIXI.Assets.add({\n    alias: \"fx_spritesheet\",\n    src: \"/revoltfx-spritesheet.json\",\n  });\n\n  tick(({deltaRatio}) => {\n    fx.update(deltaRatio);\n  });\n\n  mount(async (_element) => {\n    element = _element;\n\n    const data = await PIXI.Assets.load([\"fx_settings\", \"fx_spritesheet\"]);\n    let fxSettings = {...data.fx_settings};\n\n    if (settings.emitters) {\n      const lastId = 10000;\n      const emittersWithIds = settings.emitters.map((emitter, index) => ({\n        ...emitter,\n        id: lastId + index\n      }));\n\n      fxSettings.emitters = [\n        ...fxSettings.emitters,\n        ...emittersWithIds,\n      ];\n\n    }\n\n    fx.initBundle(fxSettings, true);\n  });\n\n  on(emit, () => {\n    const emitter = fx.getParticleEmitter(name());\n    emitter.init(element.componentInstance);\n  });\n\n  return h(Container);\n}\n","import { Container, Graphics, h, mount, useProps, animatedSignal, RadialGradient, effect, isSignal, signal, isObservable } from \"canvasengine\";\n\nexport function LightSpot(opts) {\n  const { radius } = useProps(opts);\n  const scale = animatedSignal(1);\n\n  const minScale = 1;\n  const maxScale = 2; // Reduced max scale for subtler effect\n  const scintillationSpeed = 0.001; // Significantly reduced for slower scintillation\n\n  const animate = () => {\n    // Use time-based animation for smoother, slower scintillation\n    const time = Date.now() * scintillationSpeed;\n\n    // Combine multiple sine waves for a more natural, less predictable effect\n    const scintillationFactor =\n      (Math.sin(time) + Math.sin(time * 1.3) + Math.sin(time * 0.7)) / 3;\n\n    // Map the scintillation factor to the scale range\n    const newScale =\n      minScale + (maxScale - minScale) * (scintillationFactor * 0.5 + 0.5);\n\n    scale.update(() => newScale);\n\n    requestAnimationFrame(animate);\n  };\n\n  animate();\n\n  const draw = (g) => {\n    const size = radius() * 2;\n    const gradient = new RadialGradient(size, size, 0, size, size, 0);\n    gradient.addColorStop(0, \"rgba(255, 255, 0, 1)\");\n    gradient.addColorStop(0.5, \"rgba(255, 255, 0, 0.3)\");\n    gradient.addColorStop(0.8, \"rgba(255, 255, 0, 0)\");\n\n    const translate = size / 2;\n\n    g.rect(-translate, -translate, size, size).fill(\n      gradient.render({ translate: { x: translate, y: translate } })\n    );\n  };\n\n  return h(Graphics, {\n    draw,\n    ...opts,\n    scale,\n  });\n}\n\nexport function NightAmbiant(props) {\n  const { children } = props;\n  let el\n  const width = signal(0);\n  const height = signal(0);\n  let subscription\n  const draw = (rectAndHole) => {\n    const margin = 80\n    rectAndHole.rect(-margin, -margin, width() + margin*2, height() + margin*2);\n    rectAndHole.fill(0x000000);\n    const applyChildren = (child) => {\n      const x = isSignal(child.propObservables.x)\n        ? child.propObservables.x()\n        : child.props.x;\n      const y = isSignal(child.propObservables.y)\n        ? child.propObservables.y()\n        : child.props.y;\n      const radius = isSignal(child.propObservables.radius)\n        ? child.propObservables.radius()\n        : child.props.radius;\n      rectAndHole.circle(x, y, radius);\n      rectAndHole.cut();\n    }\n    for (let child of children) {\n      if (isObservable(child)) {\n        if (subscription) {\n          subscription.unsubscribe()\n        }\n        subscription = child.subscribe((event: any) => {\n           for (let child of event.fullElements) {\n            applyChildren(child)\n           }\n        })\n        return\n      }\n      applyChildren(child)\n    }\n  };\n\n  mount((el) => {\n    effect(() => {\n      const { displayWidth, displayHeight } = el.componentInstance as any\n      const w = +displayWidth()\n      const h = +displayHeight()\n      setTimeout(() => {\n        width.update(() => w)\n        height.update(() => h)\n      }, 0) // hack\n    });\n  });\n\n  return h(\n    Container,\n    {\n      width: \"100%\",\n      height: \"100%\",\n      ...props,\n    },\n    h(Graphics, {\n      draw,\n      alpha: 0.8,\n      blur: 80,\n    }),\n    ...children\n  );\n}\n","/*\n * Joystick\n *\n * Inspired by https://github.com/endel/pixi-virtual-joystick\n */\n\nimport * as PIXI from \"pixi.js\";\nimport { Container, Graphics, Sprite, h, signal } from \"canvasengine\";\n\nexport interface JoystickChangeEvent {\n  angle: number;\n  direction: Direction;\n  power: number;\n}\n\nexport enum Direction {\n  LEFT = \"left\",\n  TOP = \"top\",\n  BOTTOM = \"bottom\",\n  RIGHT = \"right\",\n  TOP_LEFT = \"top_left\",\n  TOP_RIGHT = \"top_right\",\n  BOTTOM_LEFT = \"bottom_left\",\n  BOTTOM_RIGHT = \"bottom_right\",\n}\n\nexport interface JoystickSettings {\n  outer?: string;\n  inner?: string;\n  outerScale?: { x: number; y: number };\n  innerScale?: { x: number; y: number };\n  onChange?: (data: JoystickChangeEvent) => void;\n  onStart?: () => void;\n  onEnd?: () => void;\n}\n\nexport function Joystick(opts: JoystickSettings = {}) {\n  const settings = Object.assign(\n    {\n      outerScale: { x: 1, y: 1 },\n      innerScale: { x: 1, y: 1 },\n    },\n    opts\n  );\n\n  let outerRadius = 70;\n  let innerRadius = 10;\n  const innerAlphaStandby = 0.5;\n\n  let dragging = false;\n  let startPosition: PIXI.PointData | null = null;\n  let power = 0;\n\n  const innerPositionX = signal(0);\n  const innerPositionY = signal(0);\n  const innerAlpha = signal(innerAlphaStandby);\n\n  function getPower(centerPoint: PIXI.Point) {\n    const a = centerPoint.x - 0;\n    const b = centerPoint.y - 0;\n    return Math.min(1, Math.sqrt(a * a + b * b) / outerRadius);\n  }\n\n  function getDirection(center: PIXI.Point) {\n    let rad = Math.atan2(center.y, center.x); // [-PI, PI]\n    if ((rad >= -Math.PI / 8 && rad < 0) || (rad >= 0 && rad < Math.PI / 8)) {\n      return Direction.RIGHT;\n    } else if (rad >= Math.PI / 8 && rad < (3 * Math.PI) / 8) {\n      return Direction.BOTTOM_RIGHT;\n    } else if (rad >= (3 * Math.PI) / 8 && rad < (5 * Math.PI) / 8) {\n      return Direction.BOTTOM;\n    } else if (rad >= (5 * Math.PI) / 8 && rad < (7 * Math.PI) / 8) {\n      return Direction.BOTTOM_LEFT;\n    } else if (\n      (rad >= (7 * Math.PI) / 8 && rad < Math.PI) ||\n      (rad >= -Math.PI && rad < (-7 * Math.PI) / 8)\n    ) {\n      return Direction.LEFT;\n    } else if (rad >= (-7 * Math.PI) / 8 && rad < (-5 * Math.PI) / 8) {\n      return Direction.TOP_LEFT;\n    } else if (rad >= (-5 * Math.PI) / 8 && rad < (-3 * Math.PI) / 8) {\n      return Direction.TOP;\n    } else {\n      return Direction.TOP_RIGHT;\n    }\n  }\n\n  function handleDragStart(event: any) {\n    startPosition = event.getLocalPosition(this);\n    dragging = true;\n    innerAlpha.set(1);\n    settings.onStart?.();\n  }\n\n  function handleDragEnd() {\n    if (!dragging) return;\n    innerPositionX.set(0);\n    innerPositionY.set(0);\n    dragging = false;\n    innerAlpha.set(innerAlphaStandby);\n    settings.onEnd?.();\n  }\n\n  function handleDragMove(event: any) {\n    if (dragging == false) {\n      return;\n    }\n\n    let newPosition = event.getLocalPosition(this);\n\n    let sideX = newPosition.x - (startPosition?.x ?? 0);\n    let sideY = newPosition.y - (startPosition?.y ?? 0);\n\n    let centerPoint = new PIXI.Point(0, 0);\n    let angle = 0;\n\n    if (sideX == 0 && sideY == 0) {\n      return;\n    }\n\n    let calRadius = 0;\n\n    if (sideX * sideX + sideY * sideY >= outerRadius * outerRadius) {\n      calRadius = outerRadius;\n    } else {\n      calRadius = outerRadius - innerRadius;\n    }\n\n    /**\n     * x:   -1 <-> 1\n     * y:   -1 <-> 1\n     *          Y\n     *          ^\n     *          |\n     *     180  |  90\n     *    ------------> X\n     *     270  |  360\n     *          |\n     *          |\n     */\n\n    let direction = Direction.LEFT;\n\n    if (sideX == 0) {\n      if (sideY > 0) {\n        centerPoint.set(0, sideY > outerRadius ? outerRadius : sideY);\n        angle = 270;\n        direction = Direction.BOTTOM;\n      } else {\n        centerPoint.set(\n          0,\n          -(Math.abs(sideY) > outerRadius ? outerRadius : Math.abs(sideY))\n        );\n        angle = 90;\n        direction = Direction.TOP;\n      }\n      innerPositionX.set(centerPoint.x);\n      innerPositionY.set(centerPoint.y);\n      power = getPower(centerPoint);\n      settings.onChange?.({ angle, direction, power });\n      return;\n    }\n\n    if (sideY == 0) {\n      if (sideX > 0) {\n        centerPoint.set(\n          Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX),\n          0\n        );\n        angle = 0;\n        direction = Direction.LEFT;\n      } else {\n        centerPoint.set(\n          -(Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX)),\n          0\n        );\n        angle = 180;\n        direction = Direction.RIGHT;\n      }\n\n      innerPositionX.set(centerPoint.x);\n      innerPositionY.set(centerPoint.y);\n      power = getPower(centerPoint);\n      settings.onChange?.({ angle, direction, power });\n      return;\n    }\n\n    let tanVal = Math.abs(sideY / sideX);\n    let radian = Math.atan(tanVal);\n    angle = (radian * 180) / Math.PI;\n\n    let centerX = 0;\n    let centerY = 0;\n\n    if (sideX * sideX + sideY * sideY >= outerRadius * outerRadius) {\n      centerX = outerRadius * Math.cos(radian);\n      centerY = outerRadius * Math.sin(radian);\n    } else {\n      centerX = Math.abs(sideX) > outerRadius ? outerRadius : Math.abs(sideX);\n      centerY = Math.abs(sideY) > outerRadius ? outerRadius : Math.abs(sideY);\n    }\n\n    if (sideY < 0) {\n      centerY = -Math.abs(centerY);\n    }\n    if (sideX < 0) {\n      centerX = -Math.abs(centerX);\n    }\n\n    if (sideX > 0 && sideY < 0) {\n      // < 90\n    } else if (sideX < 0 && sideY < 0) {\n      // 90 ~ 180\n      angle = 180 - angle;\n    } else if (sideX < 0 && sideY > 0) {\n      // 180 ~ 270\n      angle = angle + 180;\n    } else if (sideX > 0 && sideY > 0) {\n      // 270 ~ 369\n      angle = 360 - angle;\n    }\n    centerPoint.set(centerX, centerY);\n    power = getPower(centerPoint);\n\n    direction = getDirection(centerPoint);\n    innerPositionX.set(centerPoint.x);\n    innerPositionY.set(centerPoint.y);\n\n    settings.onChange?.({ angle, direction, power });\n  }\n\n  let innerElement;\n  let outerElement;\n\n  if (!settings.outer) {\n    outerElement = h(Graphics, {\n      draw: (g) => {\n        g.circle(0, 0, outerRadius).fill(0x000000);\n      },\n      alpha: 0.5,\n    });\n  } else {\n    outerElement = h(Sprite, {\n      image: settings.outer,\n      anchor: { x: 0.5, y: 0.5 },\n      scale: settings.outerScale,\n    });\n  }\n\n  const innerOptions: any = {\n    scale: settings.innerScale,\n    x: innerPositionX,\n    y: innerPositionY,\n    alpha: innerAlpha,\n  };\n\n  if (!settings.inner) {\n    innerElement = h(Graphics, {\n      draw: (g) => {\n        g.circle(0, 0, innerRadius * 2.5).fill(0x000000);\n      },\n      ...innerOptions,\n    });\n  } else {\n    innerElement = h(Sprite, {\n      image: settings.inner,\n      anchor: { x: 0.5, y: 0.5 },\n      ...innerOptions,\n    });\n  }\n\n  return h(\n    Container,\n    {\n      ...opts,\n      pointerdown: handleDragStart,\n      pointerup: handleDragEnd,\n      pointerupoutside: handleDragEnd,\n      pointermove: handleDragMove,\n    },\n    outerElement,\n    innerElement\n  );\n}\n","import { TiledLayer, TiledLayerType, TiledMap, TiledParserFile, TiledTileset } from \"@rpgjs/tiled\"\nimport { loop, h, Container, TilingSprite, useProps, effect, signal } from \"canvasengine\"\nimport { CompositeTileLayer } from \"./TileLayer\"\nimport { TileSet } from \"./TileSet\"\n\n/**\n * Reorganizes tile layers based on the z property of tiles\n * \n * This function analyzes each tile in the layer data and groups them by their z property.\n * If a tile has a z property different from 0, it creates new layers for each z value.\n * \n * @param {TiledLayer[]} originalLayers - The original layers from the tilemap\n * @param {TileSet[]} tilesets - Array of loaded tilesets\n * @param {TiledMap} mapData - The complete map data\n * @returns {TiledLayer[]} - Reorganized layers with tiles grouped by z property\n * \n * @example\n * ```typescript\n * const reorganizedLayers = reorganizeLayersByTileZ(mapData.layers, tilesets, mapData);\n * ```\n */\nfunction reorganizeLayersByTileZ(originalLayers: TiledLayer[], tilesets: TileSet[], mapData: TiledMap): TiledLayer[] {\n    const reorganizedLayers: TiledLayer[] = [];\n    \n    for (const layer of originalLayers) {\n        if (layer.type !== TiledLayerType.Tile) {\n            // Keep non-tile layers as they are\n            reorganizedLayers.push(layer);\n            continue;\n        }\n\n        // Group tiles by their z property\n        const layersByZ = new Map<number, number[]>();\n        \n        // Initialize empty arrays for all z values we'll find\n        // Don't pre-populate with original data anymore\n        \n        // Ensure layer data is number array\n        let layerData: number[];\n        if (Array.isArray(layer.data)) {\n            layerData = layer.data.map(gid => {\n                if (typeof gid === 'number') {\n                    return gid;\n                } else {\n                    return parseInt(String(gid), 10);\n                }\n            });\n        } else {\n            // If data is a string, it might be compressed - for now, skip this layer\n            reorganizedLayers.push(layer);\n            continue;\n        }\n        \n        let tilesProcessed = 0;\n        let tilesWithZ = 0;\n        \n        // Analyze each tile in the layer\n        for (let i = 0; i < layerData.length; i++) {\n            const gid = layerData[i];\n            \n            if (gid === 0) continue; // Empty tile\n            \n            tilesProcessed++;\n            \n            // Find the corresponding tileset\n            let tileset: TileSet | undefined;\n            for (let j = tilesets.length - 1; j >= 0; j--) {\n                if (tilesets[j].firstgid && tilesets[j].firstgid <= gid) {\n                    tileset = tilesets[j];\n                    break;\n                }\n            }\n            \n            if (!tileset) {\n                // If no tileset found, put tile in z=0 layer\n                if (!layersByZ.has(0)) {\n                    layersByZ.set(0, new Array(layerData.length).fill(0));\n                }\n                layersByZ.get(0)![i] = gid;\n                continue;\n            }\n            \n            // Get tile properties from tileset\n            const localTileId = gid - tileset.firstgid;\n            // @ts-ignore\n            const tileProperties = tileset.tileset.tiles?.[localTileId]?.properties;\n            const zValue = tileProperties?.z ?? 0;\n            \n            // Count tiles with explicit z property\n            if (tileProperties?.z !== undefined) {\n                tilesWithZ++;\n            }\n            \n            // Create or get the layer for this z value\n            if (!layersByZ.has(zValue)) {\n                layersByZ.set(zValue, new Array(layerData.length).fill(0));\n            }\n            \n            // Place tile in the appropriate z layer\n            layersByZ.get(zValue)![i] = gid;\n        }\n        \n        // Create layers for each z value, ensuring z=0 comes first\n        const sortedZValues = Array.from(layersByZ.keys()).sort((a, b) => a - b);\n        \n        for (const zValue of sortedZValues) {\n            const layerDataForZ = layersByZ.get(zValue)!;\n            \n            // Only create layer if it has tiles\n            if (layerDataForZ.some(gid => gid !== 0)) {\n                const newLayer = {\n                    ...layer,\n                    name: `${layer.name}_z${zValue}`, // Always add _z suffix\n                    data: layerDataForZ,\n                    properties: {\n                        ...layer.properties,\n                        z: zValue\n                    }\n                };\n                \n                reorganizedLayers.push(newLayer);\n            }\n        }\n    }\n    \n    // Sort final layers to ensure z=0 layers come first, then by z value\n    reorganizedLayers.sort((a, b) => {\n        const zA = a.properties?.z ?? 0.5;\n        const zB = b.properties?.z ?? 0.5;\n        return zA - zB;\n    });\n    \n    return reorganizedLayers;\n}\n\nexport function TiledMap(props) {\n    const { map, basePath, createLayersPerTilesZ } = useProps(props)\n    const layers = signal<TiledLayer[]>([])\n    const objectLayer = props.objectLayer\n    let tilesets: TileSet[] = []\n    let mapData: TiledMap = {} as TiledMap\n\n    const parseTmx = async (file: string, relativePath: string = '') => {\n        if (typeof file !== 'string') {\n            return file\n        }\n        // @ts-ignore\n        const parser = new TiledParserFile(\n            file,\n            {\n                basePath: '',\n                staticDir: '',\n                relativePath\n            }\n        )\n        const data = await parser.parseFilePromise({\n            getOnlyBasename: false\n        })\n\n        return data\n    }\n\n    effect(async () => {\n        const _map = map()\n        if (_map) {\n            mapData = await parseTmx(_map, basePath())\n            tilesets = [] // Reset tilesets array\n            for (let tileSet of mapData.tilesets) {\n                tilesets.push(await new TileSet(tileSet).load(tileSet.image.source))\n            }\n            \n            // Reorganize layers by tile z property if enabled\n            let finalLayers = mapData.layers;\n            if (createLayersPerTilesZ()) {\n                finalLayers = reorganizeLayersByTileZ(mapData.layers, tilesets, mapData);\n            }\n            \n            layers.set(finalLayers)\n        }\n    })\n\n    const createLayer = (layers, props = {}) => {\n        return h(Container, props, loop<any>(layers, (layer) => {\n            switch (layer.type) {\n                case TiledLayerType.Tile:\n                    return h(CompositeTileLayer, {\n                        tilewidth: mapData.tilewidth,\n                        tileheight: mapData.tileheight,\n                        // @ts-ignore\n                        width: mapData.width,\n                        // @ts-ignore\n                        height: mapData.height,\n                        ...layer,\n                        tilesets\n                    })\n                case TiledLayerType.Image:\n                    const { width, height, source } = layer.image\n                    return h(TilingSprite, {\n                        image: source,\n                        ...layer,\n                        width: layer.repeatx ? layer.width * layer.tilewidth : width,\n                        height: layer.repeaty ? layer.height * layer.tileheight : height\n                    })\n                case TiledLayerType.Group:\n                    return createLayer(signal(layer.layers), layer)\n                case TiledLayerType.ObjectGroup:\n                    const child = objectLayer?.(layer)\n                    return h(Container, layer, child)\n                default:\n                    return h(Container)\n            }\n        }))\n    }\n\n    return h(Container, props, createLayer(layers))\n}","import {\n  CompositeTilemap,\n  POINT_STRUCT_SIZE,\n  Tilemap,\n  settings,\n} from \"@pixi/tilemap\";\nimport { Layer, Tile as TileClass } from \"@rpgjs/tiled\";\nimport {\n  createComponent,\n  registerComponent,\n  DisplayObject,\n  Signal,\n} from \"canvasengine\";\nimport { Tile } from \"./Tile\";\nimport { TileSet } from \"./TileSet\";\nimport { Subscription } from \"rxjs\";\n\nsettings.use32bitIndex = true;\n\nexport class CanvasTileLayer extends DisplayObject(CompositeTilemap) {\n  private _tiles: any = {};\n  tiles: (TileClass | null)[];\n  private _layer: any; // TODO: fix this, remove any. replace with Layer\n  private frameTile: number = 0;\n  private frameRateAnimation: number = 10;\n  private subscriptionTick: Subscription;\n\n  static findTileSet(gid: number, tileSets: TileSet[]) {\n    let tileset: TileSet | undefined;\n    for (let i = tileSets.length - 1; i >= 0; i--) {\n      tileset = tileSets[i];\n      if (tileset.firstgid && tileset.firstgid <= gid) {\n        break;\n      }\n    }\n    return tileset;\n  }\n\n  /** @internal */\n  createTile(x: number, y: number, options: any = {}): Tile | undefined {\n    const { real, filter } = options;\n    const { tilewidth, tileheight, width } = this._layer;\n    if (real) {\n      x = Math.floor(x / tilewidth);\n      y = Math.floor(y / tileheight);\n    }\n    const i = x + y * width;\n    const tiledTile = this._layer.getTileByIndex(i);\n\n    if (!tiledTile || (tiledTile && tiledTile.gid == 0)) return;\n\n    const tileset = CanvasTileLayer.findTileSet(tiledTile.gid, this.tileSets);\n\n    if (!tileset) return;\n\n    const tile = new Tile(tiledTile, tileset);\n\n    tile.x = x * tilewidth;\n    tile.y = y * tileheight + (tileheight - tile.texture.height);\n\n    tile._x = x;\n    tile._y = y;\n\n    if (tileset.tileoffset) {\n      tile.x += tileset.tileoffset.x ?? 0;\n      tile.y += tileset.tileoffset.y ?? 0;\n    }\n\n    if (filter) {\n      const ret = filter(tile);\n      if (!ret) return;\n    }\n\n    return tile;\n  }\n\n  private _addFrame(tile: Tile, x: number, y: number) {\n    const frame = this.tile(tile.texture, tile.x, tile.y, {\n      rotate: tile.texture.rotate,\n    });\n    // const pb = this.pointsBuf\n    // if (!pb) return null\n    // tile.pointsBufIndex = pb.length - POINT_STRUCT_SIZE\n    tile.setAnimation(frame);\n    this._tiles[x + \";\" + y] = tile;\n  }\n\n  async onMount(args) {\n    const { props } = args;\n\n    this.tileSets = props.tilesets;\n    this._layer = new Layer(\n      {\n        ...props,\n      },\n      this.tileSets\n    );\n\n    const tick: Signal = props.context.tick;\n\n    this.subscriptionTick = tick.observable.subscribe(({ value }) => {\n        if (value.frame % this.frameRateAnimation == 0) {\n            this.tileAnim = [this.frameTile, this.frameTile];\n            this.frameTile++\n         }\n    });\n\n    super.onMount(args);\n  }\n\n  onUpdate(props) {\n    super.onUpdate(props);\n    if (!this.isMounted) return;\n    if (props.tileheight) this._layer.tileheight = props.tileheight;\n    if (props.tilewidth) this._layer.tilewidth = props.tilewidth;\n    if (props.width) this._layer.width = props.width;\n    if (props.height) this._layer.height = props.height;\n    if (props.parallaxX) this._layer.parallaxX = props.parallaxx;\n    if (props.parallaxY) this._layer.parallaxY = props.parallaxy;\n\n    this.removeChildren();\n\n    for (let y = 0; y < this._layer.height; y++) {\n      for (let x = 0; x < this._layer.width; x++) {\n        const tile = this.createTile(x, y);\n        if (tile) {\n          this._addFrame(tile, x, y);\n        }\n      }\n    }\n  }\n\n  async onDestroy(parent: any) {\n    this.subscriptionTick.unsubscribe();\n    await super.onDestroy(parent);\n  }\n}\n\n// @ts-ignore\nexport interface CanvasTileLayer extends CompositeTilemap {}\n\nregisterComponent(\"CompositeTileLayer\", CanvasTileLayer);\n\nexport function CompositeTileLayer(props) {\n  return createComponent(\"CompositeTileLayer\", props);\n}\n","import { CompositeTilemap } from \"@pixi/tilemap\";\nimport { Tile as TiledTileClass } from '@rpgjs/tiled';\nimport { AnimatedSprite, Texture, groupD8 } from \"pixi.js\";\nimport { TileSet } from \"./TileSet\";\n\nexport class Tile extends AnimatedSprite {\n    static getTextures(tile: TiledTileClass, tileSet: TileSet) {\n        const textures: Texture[] = [];\n\n        if (tile.animations && tile.animations.length) {\n            tile.animations.forEach(frame => {\n                textures.push(tileSet.textures[frame.tileid])\n            });\n        } else {\n            textures.push(tileSet.textures[tile.gid - tileSet.firstgid])\n        }\n\n        return textures;\n    }\n\n    animations: { tileid: number, duration: number }[] = []\n    _x: number = 0\n    _y: number = 0\n    pointsBufIndex: number\n    properties: any = {}\n\n    constructor(\n        private tile: TiledTileClass,\n        private tileSet: TileSet\n    ) {\n        super(Tile.getTextures(tile, tileSet));\n        this.animations = tile.animations || []\n        this.properties = tile.properties\n        this.textures = Tile.getTextures(tile, tileSet)\n        this.texture = this.textures[0] as Texture\n        this.flip()\n    }\n\n    get z() {\n        return this.properties.z ?? 0\n    }\n\n    get gid() {\n        return this.tile.gid\n    }\n\n    setAnimation(frame: CompositeTilemap) {\n        const size = this.animations.length\n        if (size > 1) {\n            const offset = (this.animations[1].tileid - this.animations[0].tileid) * this.width\n            frame.tileAnimX(offset, size)\n        }\n    }\n\n    flip() {\n        let symmetry\n        let i = 0\n        const add = (symmetrySecond) => {\n            i++\n            if (symmetry) symmetry = groupD8.add(symmetry, symmetrySecond)\n            else symmetry = symmetrySecond\n        }\n\n        if (this.tile.horizontalFlip) {\n            add(groupD8.MIRROR_HORIZONTAL)\n        }\n\n        if (this.tile.verticalFlip) {\n            add(groupD8.MIRROR_VERTICAL)\n        }\n\n        if (this.tile.diagonalFlip) {\n            if (i % 2 == 0) {\n                add(groupD8.MAIN_DIAGONAL)\n            }\n            else {\n                add(groupD8.REVERSE_DIAGONAL)\n            }\n        }\n\n        //if (symmetry) this.texture.rotate = symmetry\n    }\n}","import { TiledTileset, Tileset as TiledTilesetClass } from \"@rpgjs/tiled\";\nimport { Assets, Rectangle, Texture } from \"pixi.js\";\n\nexport class TileSet extends TiledTilesetClass {\n  public textures: Texture[] = [];\n  private tileGroups = {};\n\n  constructor(tileSet: TiledTileset) {\n    super(tileSet);\n  }\n\n  loadGroup() {\n    // for (let tile of this.tileset.tiles) {\n    // }\n  }\n\n  /** @internal */\n  async load(image: string) {\n    const texture = await Assets.load(image);\n    for (\n      let y = this.margin;\n      y < this.image.height;\n      y += this.tileheight + this.spacing\n    ) {\n      for (\n        let x = this.margin;\n        x < this.image.width;\n        x += this.tilewidth + this.spacing\n      ) {\n        this.textures.push(\n          new Texture({\n            source: texture.source,\n            frame: new Rectangle(+x, +y, +this.tilewidth, +this.tileheight),\n          })\n        );\n      }\n    }\n    this.loadGroup();\n    return this;\n  }\n}\n"],"mappings":"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","names":["h","h","useProps","settings","Container","Graphics","h","mount","useProps","child","el","PIXI","Container","Graphics","h","signal","Direction","settings","h","Container","useProps","effect","signal","tick","Assets","Texture","useProps","signal","effect","layers","props","h","Container"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canvasengine/presets",
-  "version": "2.0.0-beta.16",
+  "version": "2.0.0-beta.18",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -8,11 +8,12 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "pixi.js": "^8.6.4",
-    "revolt-fx": "^1.3.5",
     "@pixi/tilemap": "^5.0.1",
     "@rpgjs/tiled": "^4.3.0",
-    "canvasengine": "2.0.0-beta.16"
+    "pixi.js": "^8.9.2",
+    "revolt-fx": "^1.3.5",
+    "rxjs": "^7.8.1",
+    "canvasengine": "2.0.0-beta.18"
   },
   "publishConfig": {
     "access": "public"

package/src/Bar.ts

@@ -8,6 +8,9 @@ interface BarProps {
   maxValue: number;
   width: number;
   height: number;
+  border?: any;
+  innerMargin?: number;
+  borderRadius?: number;
 }
 
 function componentToHex(c) {
@@ -43,22 +46,22 @@ export function Bar(opts: BarProps) {
       ...opts,
       width,
       height,
-      draw(g: PIXI.Graphics) {
+      draw(graphics: any) {
         if (borderRadius()) {
-          g.roundRect(0, 0, width(), height(), borderRadius());
+          graphics.roundRect(0, 0, width(), height(), borderRadius());
         } else {
-          g.rect(0, 0, width(), height());
+          graphics.rect(0, 0, width(), height());
         }
         if (border) {
-          g.stroke(border);
+          graphics.stroke(border);
         }
-        g.fill(backgroundColor());
+        graphics.fill(backgroundColor());
       },
     },
     h(Graphics, {
       width,
       height,
-      draw(g: PIXI.Graphics) {
+      draw(graphics: any) {
         const margin = innerMargin();
         const _borderRadius = borderRadius();
         const w = Math.max(
@@ -70,16 +73,16 @@ export function Bar(opts: BarProps) {
         );
         const h = height() - 2 * margin;
         if (borderRadius) {
-          g.roundRect(margin, margin, w, h, _borderRadius);
+          graphics.roundRect(margin, margin, w, h, _borderRadius);
         } else {
-          g.rect(margin, margin, w, h);
+          graphics.rect(margin, margin, w, h);
         }
         const color = foregroundColor();
         if (color.startsWith("rgba")) {
           const [r, g, b, a] = color.match(/\d+(\.\d+)?/g).map(Number);
-          g.fill({ color: rgbToHex(r, g, b), alpha: a });
+          graphics.fill({ color: rgbToHex(r, g, b), alpha: a });
         } else {
-          g.fill(color);
+          graphics.fill(color);
         }
       },
     })

package/src/Joystick.ts

@@ -85,7 +85,7 @@ export function Joystick(opts: JoystickSettings = {}) {
     }
   }
 
-  function handleDragStart(event: PIXI.FederatedPointerEvent) {
+  function handleDragStart(event: any) {
     startPosition = event.getLocalPosition(this);
     dragging = true;
     innerAlpha.set(1);
@@ -101,7 +101,7 @@ export function Joystick(opts: JoystickSettings = {}) {
     settings.onEnd?.();
   }
 
-  function handleDragMove(event: PIXI.FederatedPointerEvent) {
+  function handleDragMove(event: any) {
     if (dragging == false) {
       return;
     }

package/src/Tilemap/Tile.ts

@@ -36,6 +36,10 @@ export class Tile extends AnimatedSprite {
         this.flip()
     }
 
+    get z() {
+        return this.properties.z ?? 0
+    }
+
     get gid() {
         return this.tile.gid
     }

package/src/Tilemap/TileLayer.ts

@@ -1,162 +1,146 @@
-import { CompositeTilemap, POINT_STRUCT_SIZE, Tilemap, settings } from '@pixi/tilemap';
-import { Layer, Tile as TileClass } from '@rpgjs/tiled';
-import { createComponent, registerComponent, DisplayObject } from 'canvasengine';
-import { Tile } from './Tile';
-import { TileSet } from './TileSet';
-
-settings.use32bitIndex = true
+import {
+  CompositeTilemap,
+  POINT_STRUCT_SIZE,
+  Tilemap,
+  settings,
+} from "@pixi/tilemap";
+import { Layer, Tile as TileClass } from "@rpgjs/tiled";
+import {
+  createComponent,
+  registerComponent,
+  DisplayObject,
+  Signal,
+} from "canvasengine";
+import { Tile } from "./Tile";
+import { TileSet } from "./TileSet";
+import { Subscription } from "rxjs";
+
+settings.use32bitIndex = true;
 
 export class CanvasTileLayer extends DisplayObject(CompositeTilemap) {
-    private _tiles: any = {}
-    tiles: (TileClass | null)[]
-    private _layer: any // TODO: fix this, remove any. replace with Layer
-
-    static findTileSet(gid: number, tileSets: TileSet[]) {
-        let tileset: TileSet | undefined
-        for (let i = tileSets.length - 1; i >= 0; i--) {
-            tileset = tileSets[i]
-            if (tileset.firstgid && tileset.firstgid <= gid) {
-                break;
-            }
-        }
-        return tileset;
+  private _tiles: any = {};
+  tiles: (TileClass | null)[];
+  private _layer: any; // TODO: fix this, remove any. replace with Layer
+  private frameTile: number = 0;
+  private frameRateAnimation: number = 10;
+  private subscriptionTick: Subscription;
+
+  static findTileSet(gid: number, tileSets: TileSet[]) {
+    let tileset: TileSet | undefined;
+    for (let i = tileSets.length - 1; i >= 0; i--) {
+      tileset = tileSets[i];
+      if (tileset.firstgid && tileset.firstgid <= gid) {
+        break;
+      }
     }
+    return tileset;
+  }
+
+  /** @internal */
+  createTile(x: number, y: number, options: any = {}): Tile | undefined {
+    const { real, filter } = options;
+    const { tilewidth, tileheight, width } = this._layer;
+    if (real) {
+      x = Math.floor(x / tilewidth);
+      y = Math.floor(y / tileheight);
+    }
+    const i = x + y * width;
+    const tiledTile = this._layer.getTileByIndex(i);
 
-    /** @internal */
-    createTile(x: number, y: number, options: any = {}): Tile | undefined {
-        const { real, filter } = options
-        const { tilewidth, tileheight, width } = this._layer
-        if (real) {
-            x = Math.floor(x / tilewidth)
-            y = Math.floor(y / tileheight)
-        }
-        const i = x + y * width;
-        const tiledTile = this._layer.getTileByIndex(i)
-
-        if (!tiledTile || (tiledTile && tiledTile.gid == 0)) return
-
-        const tileset = CanvasTileLayer.findTileSet(
-            tiledTile.gid,
-            this.tileSets
-        )
+    if (!tiledTile || (tiledTile && tiledTile.gid == 0)) return;
 
-        if (!tileset) return
+    const tileset = CanvasTileLayer.findTileSet(tiledTile.gid, this.tileSets);
 
-        const tile = new Tile(
-            tiledTile,
-            tileset
-        )
+    if (!tileset) return;
 
-        tile.x = x * tilewidth;
-        tile.y =
-            y * tileheight +
-            (tileheight -
-                tile.texture.height);
+    const tile = new Tile(tiledTile, tileset);
 
-        tile._x = x;
-        tile._y = y;
+    tile.x = x * tilewidth;
+    tile.y = y * tileheight + (tileheight - tile.texture.height);
 
-        if (tileset.tileoffset) {
-            tile.x += tileset.tileoffset.x ?? 0;
-            tile.y += tileset.tileoffset.y ?? 0;
-        }
+    tile._x = x;
+    tile._y = y;
 
-        if (filter) {
-            const ret = filter(tile)
-            if (!ret) return
-        }
-
-        return tile
+    if (tileset.tileoffset) {
+      tile.x += tileset.tileoffset.x ?? 0;
+      tile.y += tileset.tileoffset.y ?? 0;
     }
 
-    /** @internal */
-    changeTile(x: number, y: number) {
-        const { tilewidth, tileheight } = this._layer
-        x = Math.floor(x / tilewidth)
-        y = Math.floor(y / tileheight)
-        const oldTile: Tile = this._tiles[x + ';' + y]
-        const newTile = this.createTile(x, y)
-        if (!oldTile && newTile) {
-            this._addFrame(newTile, x, y)
-        }
-        else {
-            if (newTile) {
-                const bufComposite: CompositeTilemap = new CompositeTilemap()
-                const frame = bufComposite.tile(newTile.texture, newTile.x, newTile.y)
-                newTile.setAnimation(frame)
-                this._tiles[x + ';' + y] = newTile
-                // @ts-ignore
-                const pointsBufComposite = (bufComposite.children[0] as Tilemap).pointsBuf
-                    // Change Texture (=0, 1 and 7, rotate (=4), animX (=5), animY (=6))
-                    ;[0, 1, 4, 6, 7, 8].forEach((i) => {
-                        if (this.pointsBuf) this.pointsBuf[oldTile.pointsBufIndex + i] = pointsBufComposite[i]
-                    })
-                // @ts-ignore
-                this.children[0].modificationMarker = 0
-                this._addFrame(newTile, x, y)
-                this['modificationMarker'] = 0
-            }
-            else {
-                delete this._tiles[x + ';' + y]
-                if (this.pointsBuf) this.pointsBuf.splice(oldTile.pointsBufIndex, POINT_STRUCT_SIZE)
-            }
-        }
-    }
-
-    /** @internal */
-    get pointsBuf(): number[] | null {
-        const child = this.children[0] as Tilemap
-        if (!child) return null
-        return child['pointsBuf']
-    }
-
-    private _addFrame(tile: Tile, x: number, y: number) {
-        const frame = this.tile(tile.texture, tile.x, tile.y, {
-            rotate: tile.texture.rotate
-        })
-        const pb = this.pointsBuf
-        if (!pb) return null
-        tile.pointsBufIndex = pb.length - POINT_STRUCT_SIZE
-        tile.setAnimation(frame)
-        this._tiles[x + ';' + y] = tile
+    if (filter) {
+      const ret = filter(tile);
+      if (!ret) return;
     }
 
-    onMount(args) {
-        const { props } = args
-        this.tileSets = props.tilesets
-        this._layer = new Layer({
-            ...props
-        }, this.tileSets)
-        super.onMount(args)
-    }
-
-    onUpdate(props) {
-        super.onUpdate(props)
-        if (!this.isMounted) return
-        if (props.tileheight) this._layer.tileheight = props.tileheight
-        if (props.tilewidth) this._layer.tilewidth = props.tilewidth
-        if (props.width) this._layer.width = props.width
-        if (props.height) this._layer.height = props.height
-        if (props.parallaxX) this._layer.parallaxX = props.parallaxx
-        if (props.parallaxY) this._layer.parallaxY = props.parallaxy
-
-        this.removeChildren()
-
-        for (let y = 0; y < this._layer.height; y++) {
-            for (let x = 0; x < this._layer.width; x++) {
-                const tile = this.createTile(x, y)
-                if (tile) {
-                    this._addFrame(tile, x, y)
-                }
-            }
+    return tile;
+  }
+
+  private _addFrame(tile: Tile, x: number, y: number) {
+    const frame = this.tile(tile.texture, tile.x, tile.y, {
+      rotate: tile.texture.rotate,
+    });
+    // const pb = this.pointsBuf
+    // if (!pb) return null
+    // tile.pointsBufIndex = pb.length - POINT_STRUCT_SIZE
+    tile.setAnimation(frame);
+    this._tiles[x + ";" + y] = tile;
+  }
+
+  async onMount(args) {
+    const { props } = args;
+
+    this.tileSets = props.tilesets;
+    this._layer = new Layer(
+      {
+        ...props,
+      },
+      this.tileSets
+    );
+
+    const tick: Signal = props.context.tick;
+
+    this.subscriptionTick = tick.observable.subscribe(({ value }) => {
+        if (value.frame % this.frameRateAnimation == 0) {
+            this.tileAnim = [this.frameTile, this.frameTile];
+            this.frameTile++
+         }
+    });
+
+    super.onMount(args);
+  }
+
+  onUpdate(props) {
+    super.onUpdate(props);
+    if (!this.isMounted) return;
+    if (props.tileheight) this._layer.tileheight = props.tileheight;
+    if (props.tilewidth) this._layer.tilewidth = props.tilewidth;
+    if (props.width) this._layer.width = props.width;
+    if (props.height) this._layer.height = props.height;
+    if (props.parallaxX) this._layer.parallaxX = props.parallaxx;
+    if (props.parallaxY) this._layer.parallaxY = props.parallaxy;
+
+    this.removeChildren();
+
+    for (let y = 0; y < this._layer.height; y++) {
+      for (let x = 0; x < this._layer.width; x++) {
+        const tile = this.createTile(x, y);
+        if (tile) {
+          this._addFrame(tile, x, y);
         }
+      }
     }
+  }
+
+  async onDestroy(parent: any) {
+    this.subscriptionTick.unsubscribe();
+    await super.onDestroy(parent);
+  }
 }
 
-export interface CanvasTileLayer extends CompositeTilemap { }
+// @ts-ignore
+export interface CanvasTileLayer extends CompositeTilemap {}
 
-registerComponent('CompositeTileLayer', CanvasTileLayer)
+registerComponent("CompositeTileLayer", CanvasTileLayer);
 
 export function CompositeTileLayer(props) {
-    return createComponent('CompositeTileLayer', props)
-}
+  return createComponent("CompositeTileLayer", props);
+}

package/src/Tilemap/index.ts

@@ -3,12 +3,141 @@ import { loop, h, Container, TilingSprite, useProps, effect, signal } from "canv
 import { CompositeTileLayer } from "./TileLayer"
 import { TileSet } from "./TileSet"
 
+/**
+ * Reorganizes tile layers based on the z property of tiles
+ * 
+ * This function analyzes each tile in the layer data and groups them by their z property.
+ * If a tile has a z property different from 0, it creates new layers for each z value.
+ * 
+ * @param {TiledLayer[]} originalLayers - The original layers from the tilemap
+ * @param {TileSet[]} tilesets - Array of loaded tilesets
+ * @param {TiledMap} mapData - The complete map data
+ * @returns {TiledLayer[]} - Reorganized layers with tiles grouped by z property
+ * 
+ * @example
+ * ```typescript
+ * const reorganizedLayers = reorganizeLayersByTileZ(mapData.layers, tilesets, mapData);
+ * ```
+ */
+function reorganizeLayersByTileZ(originalLayers: TiledLayer[], tilesets: TileSet[], mapData: TiledMap): TiledLayer[] {
+    const reorganizedLayers: TiledLayer[] = [];
+    
+    for (const layer of originalLayers) {
+        if (layer.type !== TiledLayerType.Tile) {
+            // Keep non-tile layers as they are
+            reorganizedLayers.push(layer);
+            continue;
+        }
+
+        // Group tiles by their z property
+        const layersByZ = new Map<number, number[]>();
+        
+        // Initialize empty arrays for all z values we'll find
+        // Don't pre-populate with original data anymore
+        
+        // Ensure layer data is number array
+        let layerData: number[];
+        if (Array.isArray(layer.data)) {
+            layerData = layer.data.map(gid => {
+                if (typeof gid === 'number') {
+                    return gid;
+                } else {
+                    return parseInt(String(gid), 10);
+                }
+            });
+        } else {
+            // If data is a string, it might be compressed - for now, skip this layer
+            reorganizedLayers.push(layer);
+            continue;
+        }
+        
+        let tilesProcessed = 0;
+        let tilesWithZ = 0;
+        
+        // Analyze each tile in the layer
+        for (let i = 0; i < layerData.length; i++) {
+            const gid = layerData[i];
+            
+            if (gid === 0) continue; // Empty tile
+            
+            tilesProcessed++;
+            
+            // Find the corresponding tileset
+            let tileset: TileSet | undefined;
+            for (let j = tilesets.length - 1; j >= 0; j--) {
+                if (tilesets[j].firstgid && tilesets[j].firstgid <= gid) {
+                    tileset = tilesets[j];
+                    break;
+                }
+            }
+            
+            if (!tileset) {
+                // If no tileset found, put tile in z=0 layer
+                if (!layersByZ.has(0)) {
+                    layersByZ.set(0, new Array(layerData.length).fill(0));
+                }
+                layersByZ.get(0)![i] = gid;
+                continue;
+            }
+            
+            // Get tile properties from tileset
+            const localTileId = gid - tileset.firstgid;
+            // @ts-ignore
+            const tileProperties = tileset.tileset.tiles?.[localTileId]?.properties;
+            const zValue = tileProperties?.z ?? 0;
+            
+            // Count tiles with explicit z property
+            if (tileProperties?.z !== undefined) {
+                tilesWithZ++;
+            }
+            
+            // Create or get the layer for this z value
+            if (!layersByZ.has(zValue)) {
+                layersByZ.set(zValue, new Array(layerData.length).fill(0));
+            }
+            
+            // Place tile in the appropriate z layer
+            layersByZ.get(zValue)![i] = gid;
+        }
+        
+        // Create layers for each z value, ensuring z=0 comes first
+        const sortedZValues = Array.from(layersByZ.keys()).sort((a, b) => a - b);
+        
+        for (const zValue of sortedZValues) {
+            const layerDataForZ = layersByZ.get(zValue)!;
+            
+            // Only create layer if it has tiles
+            if (layerDataForZ.some(gid => gid !== 0)) {
+                const newLayer = {
+                    ...layer,
+                    name: `${layer.name}_z${zValue}`, // Always add _z suffix
+                    data: layerDataForZ,
+                    properties: {
+                        ...layer.properties,
+                        z: zValue
+                    }
+                };
+                
+                reorganizedLayers.push(newLayer);
+            }
+        }
+    }
+    
+    // Sort final layers to ensure z=0 layers come first, then by z value
+    reorganizedLayers.sort((a, b) => {
+        const zA = a.properties?.z ?? 0.5;
+        const zB = b.properties?.z ?? 0.5;
+        return zA - zB;
+    });
+    
+    return reorganizedLayers;
+}
+
 export function TiledMap(props) {
-    const { map, basePath } = useProps(props)
+    const { map, basePath, createLayersPerTilesZ } = useProps(props)
     const layers = signal<TiledLayer[]>([])
     const objectLayer = props.objectLayer
-    const child = props.children[0]
-    let tilesets: TiledTileset[] = []
+    let tilesets: TileSet[] = []
     let mapData: TiledMap = {} as TiledMap
 
     const parseTmx = async (file: string, relativePath: string = '') => {
@@ -35,10 +164,18 @@ export function TiledMap(props) {
         const _map = map()
         if (_map) {
             mapData = await parseTmx(_map, basePath())
+            tilesets = [] // Reset tilesets array
             for (let tileSet of mapData.tilesets) {
                 tilesets.push(await new TileSet(tileSet).load(tileSet.image.source))
             }
-            layers.set(mapData.layers)
+            
+            // Reorganize layers by tile z property if enabled
+            let finalLayers = mapData.layers;
+            if (createLayersPerTilesZ()) {
+                finalLayers = reorganizeLayersByTileZ(mapData.layers, tilesets, mapData);
+            }
+            
+            layers.set(finalLayers)
         }
     })
 

package/src/index.ts

@@ -2,5 +2,4 @@ export * from './Bar'
 export * from './Particle'
 export * from './NightAmbiant'
 export * from './Joystick'
-export * from './Tilemap'
-export * from './DrawMap'
+export * from './Tilemap'

package/src/DrawMap/index.ts

@@ -1,60 +0,0 @@
-import { effect, signal, loop, h, Container, Sprite, useProps } from "canvasengine";
-
-interface TileData {
-  id: number;
-  rect: [number, number, number, number];
-  drawIn: [number, number];
-  layerIndex: number;
-}
-
-export function ImageMap(props) {
-  const { imageSource, tileData } = useProps(props);
-  const tiles = signal<TileData[]>([]);
-
-  effect(async () => {
-    const data = await fetch(tileData()).then((response) => response.json());
-    const objects = data;
-    if (props.objects) {
-      objects.push(...props.objects(data));
-    }
-    tiles.set(objects);
-  });
-
-  const createLayeredTiles = () => {
-    const layers = [createTileLayer(0), createTileLayer(1, true), createTileLayer(2)];
-
-    return h(Container, props, ...layers);
-  };
-
-  const createTileLayer = (layerIndex: number, sortableChildren = false) => {
-    return h(
-      Container,
-      {
-        sortableChildren,
-      },
-      // TODO: fix this (remove any)
-      loop(tiles, (object: any) => {
-        if (object.tag && layerIndex == 1) {
-            return object
-        }
-
-        object.layerIndex ||= 1;
-        if (object.layerIndex !== layerIndex) return null;
-
-        const [x, y, width, height] = object.rect;
-        const [drawX, drawY] = object.drawIn;
-
-        return h(Sprite, {
-          image: imageSource(),
-          x: drawX,
-          y: drawY,
-          rectangle: { x, y, width, height },
-          zIndex: drawY + height - 70,
-        // zIndex: 0
-        });
-      })
-    );
-  };
-
-  return createLayeredTiles();
-}