import * as THREE from 'https://esm.sh/three';
import { ThreeRendererElement } from './ThreeRendererElement.js';

export class SceneElement extends HTMLElement {
  constructor() {
    super();

  }

  rendererConnected() {
    console.log('fjlkjsdflksjdf');
  }

  findRenderer() {
    var p = this;
    while((p = p.parentElement) !== undefined)
      if(p instanceof ThreeRendererElement) return p;
  }

  connectedCallback() {
    this.scene = new THREE.Scene();
    this.scene.background = new THREE.Color(this.getAttribute('background-color') || 0xababab);
    if(!(this.parentElement instanceof ThreeRendererElement)) {
      throw Error("Parent not ThreeRendererElement");
    }

    this.parentElement.addEventListener("connected", this.rendererConnected.bind(this));

    this.dispatchEvent(new CustomEvent('ready'));
    this.ready = true;
  }
}

customElements.define('three-scene', SceneElement);