JSFiddle - React, Tailwind, and code Playground

by Alvin Chen

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5.1/dat.gui.min.js"></script>

JavaScript

var scene, renderer, camera;
var controls;
var bodyToArmL,armToHandL;
var bodyToArm,armToHand;
var bodyToLeftLeg,bodyToRightLeg;;
var bodyToRightLid,bodyToLeftLid,bodyToBackwardLid, 	bodyToForwardLid;

init();
animate();

function init() {
	scene = new THREE.Scene();
  renderer = new THREE.WebGLRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setClearColor(0x888888);
  document.body.appendChild(renderer.domElement);

  camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
  camera.position.set(0,100,200);
  controls = new THREE.OrbitControls(camera, renderer.domElement);
	var light = new THREE.PointLight(0xffffff, 1);
  light.position.set(150, 150, 150);
  scene.add(light);
  var light = new THREE.PointLight(0xffffff, 1);
  light.position.set(-150, -150, -150);
  scene.add(light);
  var amblight = new THREE.AmbientLight(0x404040); // soft white light
  scene.add(amblight);
  var gridXZ = new THREE.GridHelper(100, 10);
  gridXZ.setColors(new THREE.Color(0xff0000), new THREE.Color(0xffffff));
  scene.add(gridXZ);
  
  THREE.ImageUtils.crossOrigin = '';
  meterial_colorwithbor = new THREE.MeshLambertMaterial({side:THREE.DoubleSide,map: THREE.ImageUtils.loadTexture('http://i.imgur.com/20rkTKY.png')});
	
  var all = new THREE.Object3D();
	var body = Body();
  body.position.set(-25,25,50);
  all.add(body);
  scene.add(all);

  var head = Head();
  bodyToHead = new THREE.Object3D();
  bodyToHead.position.set(0, 15, 0);
  body.add(bodyToHead);
  bodyToHead.add(head);
  
  var leftLeg = Leg();
  bodyToLeftLeg = new THREE.Object3D();
  bodyToLeftLeg.position.set(-3, -13.5, 0);
  leftLeg.position.set(0,-5,0);
  bodyToLeftLeg.add(leftLeg);
  body.add(bodyToLeftLeg);
  
  var rightLeg = Leg();
  bodyToRightLeg = new THREE.Object3D();
  bodyToRightLeg.position.set(3, -13.5, 0);
  rightLeg.position.set(0,-5,0);
  bodyToRightLeg.add(rightLeg);
  body.add(bodyToRightLeg);

  var lidForward = LidFB();
 ...