mapBehavior

class mapBehavior extends Sup.Behavior {
  content = this.actor.getChild("content");
  terrainCamera                               // camera for rendering islands
  mapSurface: THREE.Mesh;                     // plane to draw on
  mapContentTexture: THREE.WebGLRenderTarget; // render target to draw with
  mapContentRenderer: THREE.WebGLRenderer;    // renderer to render with
  mapContentScene: THREE.Scene;               // scene to render in
  mapContentSurface;                          // material to set the render to

  // this part is for incoming island data, it works and it's not part of the issue
  recievedIsland = (mesh) => {
    let content: any = this.actor.getChild("content");
    //content.__inner.threeObject.add(mesh.clone());
    this.mapContentScene.add(mesh.clone());
    this.mapContentScene.updateMatrixWorld(true);
  }

  awake() {
    let map: any = this.actor;
    let content: any = this.actor.getChild("content");
    //let terrainCamera: any = this.actor.getParent().getChild("terrainCamera");
    let alphaMapSprite: any = Sup.get("ui/map/mapAlphaMap");  // sprite with an alpha map
    let alphaMap = alphaMapSprite.__inner.textures.map;       // alpha map (will be used later)
    let mapShader: any = Sup.get("ui/map/mapShader");         // shader for the plane

    // make the new camera
    let terrainCamera = new THREE.OrthographicCamera(-100, 100, -100, 100, 0.1, 1000);
    terrainCamera.position.z = 100;
    terrainCamera.updateMatrixWorld(true);

    // make other stuff
    this.mapContentTexture = new THREE.WebGLRenderTarget(400, 280, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter, format: THREE.RGBFormat });
    this.mapContentRenderer = new THREE.WebGLRenderer();
    this.mapContentScene = new THREE.Scene();
    this.mapContentSurface = new THREE.ShaderMaterial({
      uniforms: {
        tDiffuse: {type: "t", value: this.mapContentTexture}
      },
      vertexShader: "varying vec2 vUv; void main() { vUv = uv; gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );}",//mapShader.__inner.vertexShader.text,
      fragmentShader: "uniform sampler2D tDiffuse; varying vec2 vUv; void main() { gl_FragColor = texture2D(tDiffuse, vUv);}",//mapShader.__inner.vertexShader.text
      depthWrite: false
    })

    this.mapContentRenderer.setClearColor(0xffff00); //debug purposes (in case the camera is facing nothing)

    // create the mesh
    this.mapSurface = new THREE.Mesh(
      new THREE.PlaneGeometry(400, 280),
      //new THREE.MeshBasicMaterial({transparent: true, alphaMap: alphaMap})
      this.mapContentSurface
    );
    content.__inner.threeObject.add(this.mapSurface);
    this.terrainCamera = terrainCamera;

    //this.mapContentScene.add(this.terrainCamera);

    // add a sphere for debug purposes (in case the islands didn't get added or something)
    this.mapContentScene.add(
      new THREE.Mesh (
        new THREE.SphereGeometry(5),
        new THREE.MeshBasicMaterial()
      )
    );

    Sup.log(this.mapContentScene); // make sure all is well

    createdIsland.on("island", (mesh) => {this.recievedIsland(mesh)}); // unimportant for this
  }

  update() {
    this.terrainCamera.lookAt(0, 0, 0); // look at the center of the scene
    this.mapContentRenderer.clear();    // clear the render target
    this.mapContentRenderer.render(this.mapContentScene, this.terrainCamera, this.mapContentTexture, true); // RENDER EVERYTHING
  }
}
Sup.registerBehavior(mapBehavior);