JSFiddle - React, Tailwind, and code Playground

by Millieyan

HTML

<!doctype html>
<html>
	<head>
	<style>
	#title {
    position: absolute;
    top: 0px;
    width: 100%;
    padding: 10px;
    text-align: center;
    color: #ffff00
}

body {
    overflow: hidden
}
	</style>
	</head>
	<body>
	<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://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js"></script>

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

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

init();
animate();

function buildBox() {
  var met = new THREE.MeshNormalMaterial();

  let loader = new THREE.TextureLoader()
  loader.crossOrigin = '';

  let texture = loader.load('https://i.imgur.com/bv24XBd.jpg?1');
  let sidetexture = loader.load('https://i.imgur.com/bv24XBd.jpg?1');
  sidetexture.repeat.set(1, 0.75);

  let matArray = [];
  matArray.push(new THREE.MeshPhongMaterial({
    map: sidetexture
  }));
  matArray.push(new THREE.MeshPhongMaterial({
    map: sidetexture
  }));
  matArray.push(new THREE.MeshPhongMaterial({
    map: texture,
  }));
  matArray.push(new THREE.MeshPhongMaterial({
    map: texture
  }));
  matArray.push(new THREE.MeshPhongMaterial({
    map: sidetexture
  }));
  matArray.push(new THREE.MeshPhongMaterial({
    map: sidetexture
  }));
  let allMaterial = new THREE.MultiMaterial(matArray);
  let box = new THREE.Mesh(new THREE.BoxGeometry(40, 30, 40), allMaterial);
  return box;
}

function buildslant() {
  let loader = new THREE.TextureLoader()
  loader.crossOrigin = '';
  let texture = loader.load('https://i.imgur.com/bv24XBd.jpg?1');
  texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
  var geometry = new THREE.Geometry();
  geometry.vertices.push(
    new THREE.Vector3(0, 0, 10),
    new THREE.Vector3(40, 0, 10),
    new THREE.Vector3(40, 0, -10),
    new THREE.Vector3(0, 0, -10),
    new...