import {Container} from '@avocado/graphics';

import {LayerView} from './layer-view';

export class LayersView extends Container {

  constructor(layers, renderer) {
    super();
    this.layers = layers;
    this.layerViews = [];
    this.renderer = renderer;
    this.layers.on('layerAdded', (layer) => {
      this.onLayerAdded(layer);
    });
    for (const layer of layers) {
      this.onLayerAdded(layer);
    }
  }

  onLayerAdded(layer) {
    const layerView = new LayerView(layer, this.renderer);
    this.layerViews.push(layerView);
    this.addChild(layerView);
  }

  onLayerRemoved(layer) {
    const layerView = this.layerViews.find((layerView) => {
      return layerView.layer === layer;
    });
    if (!layerView) {
      return;
    }
    this.removeChild(layerView);
  }

}