homework9

by Millieyan

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/107/three.min.js"></script>
<script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js"></script>

JavaScript

var camera, scene, renderer, stats, loader;
var angle = 0.0, box, woodPlank;

window.addEventListener('resize',onWindowResize,false);

init();
animate();

function buildBox(){
	let texture = loader.load("https://i.imgur.com/DrvlmNW.jpg");
  let sideTexture = loader.load("https://i.imgur.com/DrvlmNW.jpg");
  sideTexture.repeat.set(1,1.0/3.0);
  let alpha = loader.load("https://i.imgur.com/pYpcBHY.png");

	let matArray = [];
    matArray.push(new THREE.MeshPhongMaterial({
    	map: texture
    }));

    matArray.push(new THREE.MeshPhongMaterial({
    	map:  texture
    }));
    matArray.push(new THREE.MeshPhongMaterial({
    	map:  texture
    }));
 
    let allMaterial = new THREE.MultiMaterial(matArray);
    let box = new THREE.Mesh(new THREE.CylinderBufferGeometry(29,29,10,32),allMaterial);
    return box;
}

function buildCylinder(){
	let texture = loader.load("https://i.imgur.com/DrvlmNW.jpg");
    
    let cylinder = new THREE.Mesh(new THREE.CylinderGeometry(8,8,17,32),new THREE.MeshPhongMaterial({
    	map: texture,
      side: THREE.BackSide
    }));
    
    return cylinder;
}

function init() {
    scene = new THREE.Scene();
    stats = new Stats();
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.top = '0px';
    stats.domElement.style.zIndex = 100;
    document.body.appendChild(stats.domElement);

    camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 1000);
    camera.position.set(0,0,140);
    camera.lookAt(new THREE.Vector3());
    scene.add(camera);


    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setClearColor(0x888888);

    controls = new THREE.OrbitControls(camera, renderer.domElement);

    controls.enableKeys = false;
    document.body.appendChild(renderer.domElement);
   
    let light = new THREE.SpotLight( 0xffffff );
    light.position.set(0,100,0);
    scene.add(light);
    
	  loader = new...