avocado-old/packages/topdown/layer-view.js

import {Container, Sprite} from '@avocado/graphics';
import {Layer, Tileset, TilesRenderer} from '@avocado/topdown';

export class LayerView extends Container {

  constructor(layer, renderer) {
    super();
    this.layer = layer;
    this.entityContainer = new Container();
    this.layerContainer = new Container();
    this._renderer = renderer;
    this._tileset = undefined;
    // Handle entity add/remove.
    this.onEntityAdded = this.onEntityAdded.bind(this);
    layer.on('entityAdded', this.onEntityAdded);
    this.onEntityRemoved = this.onEntityRemoved.bind(this);
    layer.on('entityRemoved', this.onEntityRemoved);
    for (const entity of layer.entityList) {
      this.onEntityAdded(entity);
    }
    // Watch tileset URI change.
    this.onTilesetUriChanged = this.onTilesetUriChanged.bind(this);
    layer.on('tilesetUriChanged', this.onTilesetUriChanged);
    this.onTilesetUriChanged();
    // Add to graphics.
    this.addChild(this.layerContainer);
    this.addChild(this.entityContainer);
  }

  destroy() {
    super.destroy();
    if (this._tileset) {
      this._tileset.destroy();
    }
  }

  onEntityAdded(entity) {
    if ('container' in entity) {
      this.entityContainer.addChild(entity.container);
    }
  }

  onEntityRemoved(entity) {
    if ('container' in entity) {
      this.entityContainer.removeChild(entity.container);
    }
  }

  onTilesetUriChanged() {
    if (!this.layer.tilesetUri) {
      return;
    }
    Tileset.load(this.layer.tilesetUri).then((tileset) => {
      this.tileset = tileset;
    });
  }

  set tileset(tileset) {
    this._tileset = tileset;
    const tilesRenderer = new TilesRenderer(this.layer.tiles, tileset);
    const chunk = tilesRenderer.renderChunk(this._renderer);
    const tilesSprite = new Sprite(chunk);
    this.layerContainer.removeAllChildren();
    this.layerContainer.addChild(tilesSprite);
  }

}