game1
by Millieyan
HTML
<div id="info">Game Programming HW4<br></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/96/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js">
</script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js">
</script>
<script src="https://rawgit.com/jyunming-chen/tutsplus/master/js/KeyboardState.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js">
</script>
CSS
body {
overflow: hidden;
}
JavaScript
var renderer, scene, camera, controls;
var angle = 0;
var triangle, building;
var keyboard = new KeyboardState();
var stats;
window.addEventListener('resize', onWindowResize, false);
function initHUD() {
// sceneHUD: a simple line boundary
sceneHUD = new THREE.Scene();
cameraHUD1 = new THREE.OrthographicCamera(-10.5, 10.5, 10.5, -10.5, -50, 50);
cameraHUD1.position.z = 20; // for border
cameraHUD2 = new THREE.OrthographicCamera(-300, 300, 300, -300, -300, 300);
cameraHUD2.position.set(0, 30, 0)
cameraHUD2.up.set(0, 0, -1) // for top view
cameraHUD2.lookAt(new THREE.Vector3())
var lineGeometry = new THREE.Geometry();
lineGeometry.vertices.push(new THREE.Vector3(-10, -10, 0),
new THREE.Vector3(10, -10, 0),
new THREE.Vector3(10, 10, 0),
new THREE.Vector3(-10, 10, 0),
new THREE.Vector3(-10, -10, 0));
var line = new THREE.Line(lineGeometry,
new THREE.LineBasicMaterial({
color: 0xffffff
}));
sceneHUD.add(line);
}
init();
animate();
function CreateDoor() {
var met = new THREE.MeshNormalMaterial();
var boxGeometry = new THREE.BoxGeometry(10, 10, 65);
var box = new THREE.Mesh(boxGeometry, new THREE.MeshBasicMaterial({
color: 0x704214
}));
var boxGeometry2 = new THREE.BoxGeometry(10, 15, 50);
var box2 = new THREE.Mesh(boxGeometry2, new THREE.MeshBasicMaterial({
color: 0x704214
}));
var boxGeometry3 = new THREE.BoxGeometry(10, 15, 50);
var box3 = new THREE.Mesh(boxGeometry3, new THREE.MeshBasicMaterial({
color: 0x704214
}));
box.position.y = 50;
box.rotation.y = Math.PI / 2;
box.position.z = 250;
box2.rotation.x = Math.PI / 2;
box2.rotation.z = Math.PI / 2;
box2.position.y = 25;
box2.position.z = 250;
box2.position.x = 25;
box3.rotation.x = Math.PI / 2;
box3.rotation.z = Math.PI / 2;
box3.position.y = 25;
box3.position.z = 250;
box3.position.x = -25;
var door = new THREE.Object3D();
door.add(box, box2, box3);
return door;
}
function CreateTree() {
...