Drive

by 蔡 育曄

HTML

<div id="info">press Enter to change Viewport</div>

<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>

<script src="https://jyunming-chen.github.io/tutsplus/js/KeyboardState.js"></script>

CSS

body {
  overflow: hidden;
}
#info {
  position: absolute;
  top: 0px;
  width: 100%;
  padding: 10px;
  text-align: center;  
  color: #ffff00
}

JavaScript

var randerer, camera, camera3rd, controls, scene;
var car,loader;
var keyboard = new KeyboardState();
var clock;
var pos = new THREE.Vector3();
var speed, angle, vel;
var start = false;
var trees = [];
var sitck, sitck2;
let check = false;
(function() {
  Math.clamp = function(val,min,max){
    return Math.min(Math.max(val,min),max);
    
  }})();

init();
animate();

function checkIntersect (R, C, Rad){ //(Rectangle, Center, Radius)
	var max =R.max;
  var min =R.min;
	if(max.x<0){
  	if(max.z<0) {
    	return (max.x*max.x+max.z*max.z<Rad*Rad);   
    }
    else if(min.z>0) {
    	return (max.x*max.x+min.z*min.z<Rad*Rad);
    }
    else{
    	return (Math.abs(max.x)<Rad);
    } 
  }
  else if(min.x>0){
    if(min.z>0) {
        return (min.x*min.x+min.z*min.z<Rad*Rad);   
      }
      else if(max.z<0) {
        return (min.x*min.x+max.z*max.z<Rad*Rad);
      }
      else{
      	return (Math.abs(min.x)<Rad);
      }  
  }
  else {
  	return (Math.abs(min.z)<Rad||Math.abs(max.z)<Rad);
  }
}

function buildPyramid() {
	var geometry = new THREE.Geometry();
  geometry.vertices.push(
    new THREE.Vector3(0, 0, 13),
    new THREE.Vector3(50, 0, 0),
    new THREE.Vector3(0, 13, 0),
    new THREE.Vector3(0, 0, -13)
  );

  var face;
  face = new THREE.Face3(0, 1, 2);
  face.materialIndex = 0;
  geometry.faces.push(face);
  face = new THREE.Face3(0, 2, 3);
  face.materialIndex = 1;
  geometry.faces.push(face);
  face = new THREE.Face3(1,3, 2);
  face.materialIndex = 2;
  geometry.faces.push(face);
  face = new THREE.Face3(3, 1, 0);
  face.materialIndex = 3;
  geometry.faces.push(face);
  geometry.computeBoundingSphere();
  geometry.computeFaceNormals();
  geometry.computeVertexNormals();

  var materialArray = [];
  loader.setCrossOrigin ('');
  let right = loader.load( "https://i.imgur.com/0zjuhMo.png");
  let  left= loader.load( "https://i.imgur.com/93BrYHO.png");
  let orther = loader.load( "https://i.imgur.com/uGsYRnc.png");
  
  var t0 = new...