JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://threejs.org/build/three.min.js"></script>
<script src="http://threejs.org/examples/js/controls/OrbitControls.js"></script>
<img style="display:none" id="front" alt=""...

CSS

body {
       font-family: Monospace;
       color: #fff;
       background-color: #000;
       margin: 0px;
       overflow: hidden;
   }

JavaScript

function draw_texture() {
    var canvas = document.createElement('canvas');
    canvas.width = canvas.height = 256;
    var ctx = canvas.getContext('2d');
    ctx.drawImage(document.getElementById('front'), 0, 0);
    var texture = new THREE.Texture(canvas);
    texture.needsUpdate = true;
    return texture;
}

var container,
info,
camera,
scene,
light,
geometry,
mesh,
projector,
renderer,
controls;

// dom
container = document.createElement('div');
document.body.appendChild(container);

// info
info = document.createElement('div');
info.style.position = 'absolute';
info.style.top = '10px';
info.style.width = '100%';
info.style.textAlign = 'center';
info.innerHTML = "drag to rotate camera";
container.appendChild(info);

// renderer
renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
container.appendChild(renderer.domElement);

// scene
scene = new THREE.Scene();

// camera
camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.set(0, 300, 500);
scene.add(camera);

// controls
controls = new THREE.OrbitControls(camera);

// light
scene.add(new THREE.AmbientLight(0x222222));

// light
light = new THREE.PointLight(0xaaaaaa);
camera.add(light);

var shape1 = new THREE.Shape();

shape1.moveTo(307.94, 275.49);
shape1.lineTo(296.26, 275.23);
shape1.lineTo(286.64, 272.99);
shape1.lineTo(279.78, 269.31);
shape1.lineTo(274.14, 263.55);
shape1.lineTo(271.65, 260.21);
shape1.lineTo(269.2, 261.06);
shape1.lineTo(254.83, 268.51);
shape1.lineTo(242.11, 272.97);
shape1.lineTo(227.59, 275.23);
shape1.lineTo(209.91, 275.48);
shape1.lineTo(197.47, 273.63);
shape1.lineTo(187.91, 270.13);
shape1.lineTo(180.48, 265.09);
shape1.lineTo(175.32, 258.88);
shape1.lineTo(172.2, 251.44);
shape1.lineTo(171.1, 242.23);
shape1.lineTo(172.24, 233.63);
shape1.lineTo(175.49, 226.24);
shape1.lineTo(181, 219.54);
shape1.lineTo(189.42, 213.3);
shape1.lineTo(201.36, 207.73);
shape1.lineTo(217.23,...