// Cloned by Mathias Bazin on 20 Jun 2018 from World "First Person Night" by Mathias Bazin
// Please leave this clone trail here.
// Cloned by Mathias Bazin on 19 Jun 2018 from World "First Person Controls" by Mathias Bazin
// Please leave this clone trail here.
// Customise AB run parameters (optional).
// The following parameters can be customised. (They have default values.)
AB.clockTick = 20;
// Speed of run: Step every n milliseconds. Default 100.
AB.maxSteps = 65545;
// Length of run: Maximum length of run in steps. Default 1000.
AB.screenshotStep = 300;
// For automatic generation of World images.
// Take screenshot on this step. (All resources should have finished loading.) Default 50.
AB.drawRunControls = false;
threeworld.drawCameraControls = false;
const MOVESPEED = 3;
const boxtexturefile = "/uploads/mathias/wood.png"
const floorTextureFile = "/uploads/mathias/grassLowPoly1.png"
const skytexturefile = "/uploads/mathias/nightSky2.jpg"
const SKYDISTANCE = 10000;
const NBSTARS = 100;
//==============================================================================
// Define the THREE.PointerLockControls class, source at https://threejs.org/
//==============================================================================
THREE.PointerLockControls = function ( camera ) {
var scope = this;
camera.rotation.set( 0, 0, 0 );
var pitchObject = new THREE.Object3D();
pitchObject.add( camera );
var yawObject = new THREE.Object3D();
yawObject.position.y = 10;
yawObject.add( pitchObject );
var PI_2 = Math.PI / 2;
var onMouseMove = function ( event ) {
if ( scope.enabled === false ) return;
var movementX = event.movementX || event.mozMovementX || event.webkitMovementX || 0;
var movementY = event.movementY || event.mozMovementY || event.webkitMovementY || 0;
yawObject.rotation.y -= movementX * 0.002;
pitchObject.rotation.x -= movementY * 0.002;
pitchObject.rotation.x = Math.max( - PI_2, Math.min( PI_2, pitchObject.rotation.x ) );
};
this.dispose = function () {
document.removeEventListener( 'mousemove', onMouseMove, false );
};
document.addEventListener( 'mousemove', onMouseMove, false );
this.enabled = false;
this.getObject = function () {
return yawObject;
};
this.getDirection = function () {
// assumes the camera itself is not rotated
var direction = new THREE.Vector3( 0, 0, - 1 );
var rotation = new THREE.Euler( 0, 0, 0, 'YXZ' );
return function ( v ) {
rotation.set( pitchObject.rotation.x, yawObject.rotation.y, 0 );
v.copy( direction ).applyEuler( rotation );
return v;
};
}();
};
//=====================================================================
// --- some useful random functions -------------------------------------------
function randomfloatAtoB ( A, B )
{
return ( A + ( Math.random() * (B-A) ) );
}
function randomintAtoB ( A, B )
{
return ( Math.round ( randomfloatAtoB ( A, B ) ) );
}
function randomBoolean()
{
if ( Math.random() < 0.5 ) { return false; }
else { return true; }
}
function randomPick ( a, b )
{
if ( randomBoolean() )
return a;
else
return b;
}
/**
* A linear interpolator for hexadecimal colors
* @param {Int} a
* @param {Int} b
* @param {Number} amount
* @example
* // returns 0x7F7F7F
* lerpColor(0x000000, 0xffffff, 0.5)
* @returns {Int}
*/
function lerpColor(a, b, amount) {
var ah = a;
ar = ah >> 16, ag = ah >> 8 & 0xff, ab = ah & 0xff,
bh = b;
br = bh >> 16, bg = bh >> 8 & 0xff, bb = bh & 0xff,
rr = ar + amount * (br - ar),
rg = ag + amount * (bg - ag),
rb = ab + amount * (bb - ab);
return ((1 << 24) + (rr << 16) + (rg << 8) + rb | 0);
}
/**/
function map(n, start1, stop1, start2, stop2)
{
return ((n-start1)/(stop1-start1))*(stop2-start2)+start2;
}
function World() {
var camera, controls;
var objects = [];
var raycaster;
var controlsEnabled = true;
var moveForward = false;
var moveBackward = false;
var moveLeft = false;
var moveRight = false;
var canJump = false;
var prevTime = performance.now();
var velocity = new THREE.Vector3();
var direction = new THREE.Vector3();
var vertex = new THREE.Vector3();
var color = new THREE.Color();
var sun;
var Sun = function()
{
this.angle = 0;
this.object = new THREE.DirectionalLight(0xffffff, 2);
this.object.position.set(0, Math.cos(this.angle)*SKYDISTANCE, Math.sin(this.angle)*SKYDISTANCE);
this.object.castShadow = true;
this.stars = [];
this.starMaterial = new THREE.MeshBasicMaterial({color : "white"}) ;
this.starMaterial.transparent = true;
this.starMaterial.opacity = 0;
threeworld.scene.add(this.object);
// let pointLightHelper = new THREE.PointLightHelper( this.object, 1000 );
// threeworld.scene.add( pointLightHelper );
let sunball = new THREE.Mesh( new THREE.SphereGeometry(1000,32,32), new THREE.MeshBasicMaterial({color : "yellow"}) );
this.object.add( sunball );
for (let i = 0; i<NBSTARS; i++)
{
let radius = randomfloatAtoB ( 40, 60 );
let star = new THREE.Mesh( new THREE.SphereGeometry(radius,8,8), this.starMaterial);
let s = randomfloatAtoB ( 0, Math.PI*2 );
let t = randomfloatAtoB ( 0, Math.PI/2 );
star.position.set(SKYDISTANCE*Math.cos(s)*Math.sin(t), SKYDISTANCE*Math.cos(t), SKYDISTANCE*Math.sin(s)*Math.sin(t));
this.stars.push(star);
threeworld.scene.add(star);
}
this.animate = function()
{
this.angle+=0.005;
//normalize angle between -PI and PI
while (this.angle <= -Math.PI) this.angle += Math.PI*2;
while (this.angle > Math.PI) this.angle -= Math.PI*2;
this.object.position.set(0, Math.cos(this.angle)*SKYDISTANCE, Math.sin(this.angle)*SKYDISTANCE);
this.object.intensity = this.getSunIntensity();
threeworld.scene.background = new THREE.Color(this.getSkyColor());
this.setStarsOpacity();
}
this.setStarsOpacity = function()
{
if (this.angle > Math.PI/2 && this.angle < Math.PI*3/4)
{
this.starMaterial.opacity = map(this.angle, Math.PI/2, Math.PI*3/4, 0, 0.8);
}
else if (this.angle > -Math.PI*3/4 && this.angle < -Math.PI/2)
{
this.starMaterial.opacity = map(this.angle, -Math.PI*3/4, -Math.PI/2, 0.8, 0);
}
}
this.getSkyColor = function()
{
if (this.angle > -Math.PI*3/8 && this.angle < Math.PI*3/8)
{
// console.log("day");
return 0x7ec0ee;
}
else if (this.angle > Math.PI*3/8 && this.angle < Math.PI/2)
{
// console.log("Sunset 1");
return lerpColor(0x7ec0ee, 0xfd5e53, map(this.angle, Math.PI*3/8,Math.PI/2,0,1));
}
else if (this.angle > Math.PI/2 && this.angle < Math.PI*3/4)
{
// console.log("Sunset 2");
return lerpColor(0xfd5e53, 0x0c3166, map(this.angle, Math.PI/2,Math.PI*3/4,0,1));
}
else if (this.angle > Math.PI*3/4 || this.angle < -Math.PI*3/4)
{
// console.log("night");
return 0x0c3166;
}
else if (this.angle > -Math.PI*3/4 && this.angle < -Math.PI/2)
{
// console.log("Sunrise 1");
return lerpColor(0x0c3166, 0xfd5e53, map(this.angle, -Math.PI*3/4,-Math.PI/2,0,1));
}
else if (this.angle > -Math.PI/2 && this.angle < -Math.PI*3/8)
{
// console.log("Sunrise 2");
return lerpColor(0xfd5e53, 0x7ec0ee, map(this.angle, -Math.PI/2, -Math.PI*3/8, 0, 1));
}
}
this.getSunIntensity = function()
{
if (this.angle > -Math.PI*3/8 && this.angle < Math.PI*3/8)
{
return 2;
}
else if (this.angle > Math.PI*3/8 && this.angle < Math.PI/2)
{
return map(this.angle, Math.PI*3/8,Math.PI/2,2,1);
}
else if (this.angle > Math.PI/2 && this.angle < Math.PI*3/4)
{
return map(this.angle, Math.PI/2,Math.PI*3/4,1,0);
}
else if (this.angle > Math.PI*3/4 || this.angle < -Math.PI*3/4)
{
return 0;
}
else if (this.angle > -Math.PI*3/4 && this.angle < -Math.PI/2)
{
return map(this.angle, -Math.PI*3/4,-Math.PI/2,0,1);
}
else if (this.angle > -Math.PI/2 && this.angle < -Math.PI*3/8)
{
return map(this.angle, -Math.PI/2, -Math.PI*3/8, 1, 2);
}
}
}
var Bird = function(x,y,z)
{
this.object = models[0].clone();
this.height = randomintAtoB(0,50);
this.isRising = randomBoolean();
this.object.position.x = x;
this.object.position.y = y;
this.object.position.z = z;
threeworld.scene.add(this.object);
this.animate = function()
{
// console.log("height : ", this.height);
if(this.height > 50) this.isRising = false;
else if (this.height < 0) this.isRising = true;
if (this.isRising)
{
this.height += 2;
this.object.position.y += 2;
}
else
{
this.height -= 0.2;
this.object.position.y -= 0.2;
}
}
}
this.newRun = function()
{
camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 100000 );
threeworld.camera = camera;
threeworld.init3d ( 0,0, 0x7ec0ee );
threeworld.renderer.shadowMap.enabled = true;
threeworld.renderer.shadowMap.type = THREE.PCFSoftShadowMap;
var light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 0.2 );
threeworld.scene.add( light );
controls = new THREE.PointerLockControls( camera );
threeworld.scene.add( controls.getObject() );
var onKeyDown = function ( event ) {
switch ( event.keyCode ) {
case 38: // up
case 87: // w
moveForward = true;
break;
case 37: // left
case 65: // a
moveLeft = true; break;
case 40: // down
case 83: // s
moveBackward = true;
break;
case 39: // right
case 68: // d
moveRight = true;
break;
case 32: // space
if ( canJump === true ) velocity.y += 350;
canJump = false;
break;
}
};
var onKeyUp = function ( event ) {
switch( event.keyCode ) {
case 38: // up
case 87: // w
moveForward = false;
break;
case 37: // left
case 65: // a
moveLeft = false;
break;
case 40: // down
case 83: // s
moveBackward = false;
break;
case 39: // right
case 68: // d
moveRight = false;
break;
}
};
document.addEventListener( 'keydown', onKeyDown, false );
document.addEventListener( 'keyup', onKeyUp, false );
raycaster = new THREE.Raycaster( new THREE.Vector3(), new THREE.Vector3( 0, - 1, 0 ), 0, 10 );
//Scene
//floor
var floorGeometry = new THREE.PlaneBufferGeometry( 6000, 6000, 200, 200 );
floorGeometry.rotateX( - Math.PI / 2 );
var floorTexture = new THREE.ImageUtils.loadTexture ( floorTextureFile );
floorTexture.minFilter = THREE.LinearFilter;
floorTexture.wrapS = floorTexture.wrapT = THREE.RepeatWrapping;
floorTexture.offset.set( 0, 0 );
floorTexture.repeat.set( 100, 100 );
var floor = new THREE.Mesh(floorGeometry, new THREE.MeshLambertMaterial({map : floorTexture}));
floor.position.set(0,-20,0);
floor.receiveShadow = true;
floor.castShadow = true;
threeworld.scene.add(floor);
//Background (sky)
// var loader = new THREE.TextureLoader();
// loader.load( skytexturefile, function ( texture ) {
// var geometry = new THREE.SphereGeometry( 30000, 32, 32 );
// var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
// var mesh = new THREE.Mesh( geometry, material );
// mesh.material.side = THREE.BackSide;
// threeworld.scene.add( mesh );
// } );
//Objects
//box
var boxGeometry = new THREE.BoxBufferGeometry( 20, 60, 20 );
var boxTexture = new THREE.ImageUtils.loadTexture ( boxtexturefile );
var boxMaterial = new THREE.MeshLambertMaterial ( { map: boxTexture } );
var box = new THREE.Mesh ( boxGeometry, boxMaterial);
box.castShadow = true;
box.receiveShadow = true;
box.metalness = 0.0;
box.position.set(-60,0,-150);
box.name = "Box";
threeworld.scene.add(box);
objects.push(box);
//Sun
sun = new Sun();
$("#user_span1").html(" Use WASD or Arrows to move, mouse to look around and space to jump.");
var blocker = $("#user_span2");
blocker.html("<p><b>Click screen to enable mouse controls</b></p>");
//lock pointer
var havePointerLock = 'pointerLockElement' in document || 'mozPointerLockElement' in document || 'webkitPointerLockElement' in document;
console.log(havePointerLock);
if ( havePointerLock ) {
var element = document.body;
var pointerlockchange = function ( event ) {
if ( document.pointerLockElement === element || document.mozPointerLockElement === element || document.webkitPointerLockElement === element ) {
controlsEnabled = true;
controls.enabled = true;
blocker.html("");
} else
{
controls.enabled = false;
blocker.html("<p><b>Click screen to enable mouse controls</b></p>");
}
};
var pointerlockerror = function ( event ) {
console.error("pointerlockerror");
};
// Hook pointer lock state change events
document.addEventListener( 'pointerlockchange', pointerlockchange, false );
document.addEventListener( 'mozpointerlockchange', pointerlockchange, false );
document.addEventListener( 'webkitpointerlockchange', pointerlockchange, false );
document.addEventListener( 'pointerlockerror', pointerlockerror, false );
document.addEventListener( 'mozpointerlockerror', pointerlockerror, false );
document.addEventListener( 'webkitpointerlockerror', pointerlockerror, false );
document.addEventListener( 'click', function ( event ) {
// Ask the browser to lock the pointer
element.requestPointerLock = element.requestPointerLock || element.mozRequestPointerLock || element.webkitRequestPointerLock;
element.requestPointerLock();
}, false );
} else {
$("#user_span1").html('<p>Your browser doesn\'t seem to support Pointer Lock API</p>');
}
};
this.nextStep = function()
{
// console.log("camera pos : ", camera.getWorldPosition().x, camera.getWorldPosition().y, camera.getWorldPosition().z);
// for (let o of objects)
// {
// console.log(o.name, " pos :", o.getWorldPosition().x,o.getWorldPosition().y,o.getWorldPosition().z);
// }
sun.animate();
previousPosition = controls.getObject().position;
if ( controlsEnabled === true ) {
raycaster.ray.origin.copy( controls.getObject().position );
raycaster.ray.origin.y -= 10;
var intersections = raycaster.intersectObjects( objects );
var onObject = intersections.length > 0;
var time = performance.now();
var delta = ( time - prevTime ) / 1000;
velocity.x -= velocity.x * 10.0 * delta;
velocity.z -= velocity.z * 10.0 * delta;
velocity.y -= 9.8 * 100.0 * delta; // 100.0 = mass
direction.z = Number( moveForward ) - Number( moveBackward );
direction.x = Number( moveLeft ) - Number( moveRight );
direction.normalize(); // this ensures consistent movements in all directions
if ( moveForward || moveBackward ) velocity.z -= direction.z * 400.0 * MOVESPEED * delta;
if ( moveLeft || moveRight ) velocity.x -= direction.x * 400.0 * MOVESPEED * delta;
if ( onObject === true ) {
velocity.y = Math.max( 0, velocity.y );
canJump = true;
}
// console.log("velocity ", velocity.x, " ", velocity.z)
controls.getObject().translateX( velocity.x * delta );
controls.getObject().translateY( velocity.y * delta );
controls.getObject().translateZ( velocity.z * delta );
if ( controls.getObject().position.y < 10 ) {
velocity.y = 0;
controls.getObject().position.y = 10;
canJump = true;
}
prevTime = time;
if (previousPosition.distanceTo(controls.getObject().position) > 30)
{
console.error("Teleport occured");
}
}
};
this.endRun = function()
{
};
}