Always on front test

by wilt

HTML

<script src="https://rawgit.com/mrdoob/three.js/master/build/three.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>
<script src="https://rawgit.com/Wilt/ThreeCSG/master/ThreeCSG.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/master/examples/js/controls/TrackballControls.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/master/examples/js/Octree.js"></script>

CSS

body {
  background-color: #000;
  margin: 0px;
  overflow: hidden;
}

JavaScript

THREE.Object3D.DefaultUp.set(0, 0, 1);

// three.js info box follows shape
var renderer, scene, camera, controls;
var angle = 0;
var arrow;
var rayCaster = new THREE.Raycaster();
var mouse2D = new THREE.Vector2();
var mouse3D = new THREE.Vector3();
var radius = 5;
var sphereHelper;
var octree;
var intersect;
var intersectMaterial = new THREE.MeshStandardMaterial({
  color: 'yellow'
});
var onTopMaterial = new THREE.MeshStandardMaterial({
  color: 'red',
  depthTest: false
});

init();
animate();

function init() {
  // info
  var info = document.createElement('div');
  info.style.position = 'absolute';
  info.style.top = '30px';
  info.style.width = '100%';
  info.style.textAlign = 'center';
  info.style.color = '#fff';
  info.style.fontWeight = 'bold';
  info.style.backgroundColor = 'transparent';
  info.style.zIndex = '1';
  info.style.fontFamily = 'Monospace';
  info.innerHTML = "three.js - Always on front test";
  document.body.appendChild(info);

  // renderer
  renderer = new THREE.WebGLRenderer({
    antialias: true
  });
  renderer.sortObjects = true;
  renderer.setPixelRatio(window.devicePixelRatio);
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);

  renderer.domElement.addEventListener("mousemove", onMouseMove);
  
  // scene
  scene = new THREE.Scene();

// ambient light
  var ambient = new THREE.AmbientLight(0x404040);
  scene.add(ambient);

  // directional light
  var directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
  directionalLight.position.set(-1, -0.5, 1);
  scene.add(directionalLight);

  // camera
  camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 5000);
  camera.position.set(-400, 400, 200);
  camera.up.set(0, 0, 1);

  // controls
  controls = new THREE.OrbitControls(camera, renderer.domElement);
  controls.target = new THREE.Vector3(0, 0, 0); 
  
  addMeshes();
}

function addMeshes(){
  // material
  var material = new...