painted-world/painted_world.js

'use strict';

var ctxSettings = {};
ctxSettings.alpha = true;
ctxSettings.preserveDrawingBuffer = true;
var app = new v3d.App('container', ctxSettings, null);
app.clearBkgOnLoad = true;
app.renderer.setClearColor(0x000000, 0);
app.renderCallbacks.push(renderCb);
app.compileCallbacks.push(compileCb);
var pause = false, loading = false;

function compileCb(){
  dof(0.0,200, 0.025, 1);
  bloom(7.5, 0.2, 0.4);
}

var controllerMatrix;

app.loadScene('PlayerCharacter.gltf', function() {
  app.run();

  //app.enableControls();
  controllerCam = app.scene.children.find(controllerCam => controllerCam.name == 'ControllerCam');
  playerCharacter = app.scene.children.find(playerCharacter => playerCharacter.name == "PlayerRig");


  switchField('s1', 'f1', 'sp1');
  mainMenu = false;
});

$('document').ready(function(){
  //  switchField('s1', 'f1', 'sp1');
  //  mainMenu = false;
});


//var movingLeft, movingRight, movingUp, movingDown;
let mainMenu = true;
var playerCharacter;
var controllerCam;
var upDirector;
var groundPlane;
var fieldScene, fieldCollider, fieldPortals, fieldCamera;
var movementSpeed = 0.05;
let PI = 3.1416;
//var finishedLoading = false;

var playerPosition = new v3d.Vector3();
var nextPosition = new v3d.Vector3();

var colliderBoxes = [];
var portalBoxes = [];

function collides(vector){
  /*
  for(var i = 0; i < portalBoxes.length; i++){
  if(portalBoxes[i].containsPoint(vector)){
  var target = fieldPortals[i].userData.v3d.customProps.target.split(/[$-/:-?{-~!"^_`\[\]]/gi);
  console.log(target[0] + " " + target[1] + " " + target[2]);
  if(!loading){
  switchField(target[0], target[1], target[2]);
  return false;
}
}
}
*/
var collides = false;
colliderBoxes.forEach(function(box){
  if(box.containsPoint(vector)){
    collides = true;
  }
});
return collides;
}

function renderCb(){
  if(playerCharacter != undefined){
    playerPosition.set(playerCharacter.position.x, playerCharacter.position.y-1.75, playerCharacter.position.z);
    //if(finishedLoading){
    for(var i = 0; i < portalBoxes.length; i++){
      if(portalBoxes[i].containsPoint(playerPosition) && !loading){
        loading = true;
        var target = fieldPortals[i].userData.v3d.customProps.target.split(/[$-/:-?{-~!"^_`\[\]]/gi);
        console.log(target[0] + " " + target[1] + " " + target[2]);
        switchField(target[0], target[1], target[2]);
        //finishedLoading = false;
        //return false;
      }
    }
  }
}

function switchField(scene, field, spawnpoint) {
  //pause = true;


  if(app.controls != undefined){
    app.controls.dispose();
    //app.unload(app.camera);
  }

  //controllerCam.position.set(0,1.75,0);
  //controllerCam.applyMatrix4(controllerMatrix);
  //playerCharacter

  var fieldName = scene + field;
  var fieldURI = "scenes/" + fieldName + "/" + fieldName + ".gltf";
  var bgimageURI = "scenes/" + fieldName + "/" + fieldName + "_bg.png";

  if(fieldScene != undefined){
    app.setCamera(controllerCam);
    app.unload(fieldScene);
  }

  app.appendScene(fieldURI, function(){
    $("#container").css("background-image", "url(" + bgimageURI + ")");
    $('#overlay').hide();

    fieldScene = app.scene.children.find(fieldScene => fieldScene.name == 'Scene');

    groundPlane = fieldScene.children.find(groundPlane => groundPlane.name == 'Ground');

    console.log(fieldScene);

    fieldCollider = fieldScene.children.filter(fieldCollider => fieldCollider.groupNames.includes('Collider'));
    colliderBoxes = [];
    for (let i = 0; i < fieldCollider.length; i++) {
      colliderBoxes.push(new v3d.Box3());
      colliderBoxes[i].copy(fieldCollider[i].geometry.boundingBox).applyMatrix4(fieldCollider[i].matrixWorld);
    }

    fieldPortals = fieldScene.children.filter(fieldPortals => fieldPortals.groupNames.includes('Portals'));
    portalBoxes = [];
    for (let i = 0; i < fieldPortals.length; i++) {
      portalBoxes.push(new v3d.Box3());
      portalBoxes[i].copy(fieldPortals[i].geometry.boundingBox).applyMatrix4(fieldPortals[i].matrixWorld);
    }


    fieldCamera = fieldScene.children.find(fieldCamera => fieldCamera.name == 'Camera');
    app.setCamera(fieldCamera);

    let spawnPoint = fieldScene.children.find(spawnPoint => spawnPoint.name == scene + "_" + field + "_" + spawnpoint);
    //alles superkacke hier :D
    controllerCam.position.set(0,1.75,0);
    controllerCam.setRotationFromMatrix(spawnPoint.matrix);
    playerCharacter.setRotationFromMatrix(spawnPoint.matrix);
    controllerCam.applyMatrix4(spawnPoint.matrix);

    app.enableControls();
    app.controls.object = controllerCam;
    loading = false;

  }, fieldLoadProgress, fieldLoadError, true, true);
}

function fieldLoadProgress(progress){
  //console.log(progress);
  $('#overlay').show().css('background-color', 'rgba(0,0,0,' + progress / 100 + ')');
}
function fieldLoadError(error){
  console.log("Error loading Field, dumping: " + error);
}


var cube;

document.addEventListener('keydown', function(event){

  if(mainMenu){
      /*
    if(event.key == 'Enter'){
      switchField('s1', 'f1', 'sp1');
      mainMenu = false;
    }
    */
  } else {
    /*
    if(event.key == 'Enter'){
      switchField('s1', 'f1', 'sp1');
    }
    if(event.key == 'p'){
      pause = !pause;
    }

    if(event.key == '1'){
      switchField('s1', 'f1', 'sp1');
    }
    if(event.key == '2'){
      switchField('s1', 'f2', 'sp1');
    }
    if(event.key == '3'){
      switchField('s1', 'f3', 'sp1');
    }
    if(event.key == '4'){
      switchField('s1', 'f4', 'sp1');
    }
    if(event.key == '5'){
      switchField('s1', 'f5', 'sp1');
    }
    */

    if(event.key == 'ArrowUp'){
      playerCharacter.rotation.y = PI * 2;
    }
    if(event.key == 'ArrowDown'){
      playerCharacter.rotation.y = PI;
    }
    if(event.key == 'ArrowLeft'){
      playerCharacter.rotation.y = PI / 2;
    }
    if(event.key == 'ArrowRight'){
      playerCharacter.rotation.y = PI + PI / 2;
    }

  }
});

document.addEventListener('keyup', function(event){

});

function dof(focus, aperture, maxblur, depthLeakThreshold) {
  app.enablePostprocessing([{
    type: 'dof',
    focus: focus,
    aperture: aperture,
    maxblur: maxblur,
    depthLeakThreshold: depthLeakThreshold
  }]);
}
function bloom(threshold, strength, radius) {
  app.enablePostprocessing([{
    type: 'bloom',
    threshold: threshold,
    strength: strength,
    radius: radius
  }]);
}