<script src="https://rawgit.com/mrdoob/three.js/dev/build/three.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/dev/examples/js/controls/OrbitControls.js"></script>

body{
  margin:0px;
}

// Simple three.js example

var renderer, sceneA,sceneB, camera, controls, alpha, boxMesh, curve, startTime;

init();
animate();

function init() {

    // renderer
  renderer = new THREE.WebGLRenderer();
  renderer.setSize( window.innerWidth, window.innerHeight );
  document.body.appendChild( renderer.domElement );
  console.log(renderer)
    // scene
  sceneA = new THREE.Scene();


    // camera
  camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 10000 );
  camera.position.set(0, 0, 40);

    // controls
  controls = new THREE.OrbitControls( camera );
    
  const sphere = new THREE.Mesh(new THREE.SphereGeometry(5,10,10));
  const boxMat = new THREE.MeshBasicMaterial({color:0xff0000,side:THREE.BackSide});
  const box = new THREE.Mesh(new THREE.BoxGeometry(12,12,12), boxMat);
  sceneA.add(sphere,box);

}
function animate() {

		
  requestAnimationFrame( animate );
  renderer.render( sceneA, camera );


}