function setupStencilsAndOverlay() {
      // Get a cameraInfo (a view and projection matrix)
      // using our javascript library function
      var cameraInfo = o3djs.camera.getViewAndProjectionFromCameras(
          g_stencilRoot,
          g_o3dWidth,
          g_o3dHeight);
  
      var backDrawContext = g_stencilPack.createObject('DrawContext');
      backDrawContext.view = cameraInfo.view;
      backDrawContext.projection = cameraInfo.projection;
  
      // create 2 DrawPasses that uses this context to draw things as in the
      // stencil_frame.tgz file which I already setup with an orthographic
      // projection matrix. Each one needs a draw list as well.  Also create a
      // StateSet to set the stencil render states for everything drawn
      // by the back DrawPass.
  
      // first one to draw the 3 circles into the stencil.
      var backDrawList = g_stencilPack.createObject('DrawList');
      var backDrawPass = g_stencilPack.createObject('DrawPass');
      var backStateSet = g_stencilPack.createObject('StateSet');
      var backState = g_stencilPack.createObject('State');
      backDrawPass.parent = backStateSet;
      backDrawPass.drawList = backDrawList;
      // after tree_traversal, before opaque
      backStateSet.priority = g_viewInfo.treeTraversal.priority + 0.5;
      backStateSet.parent = g_viewInfo.viewport;
      backStateSet.state = backState;
      g_treeTraversal.registerDrawList(backDrawList, backDrawContext, true);
      backState.getStateParam('StencilEnable').value = true;
      backState.getStateParam('StencilPassOperation').value =
          g_o3d.State.STENCIL_REPLACE;
      backState.getStateParam('StencilComparisonFunction').value =
          g_o3d.State.CMP_ALWAYS;
      backState.getStateParam('ZEnable').value = false;
      backState.getStateParam('ZWriteEnable').value = false;
      backState.getStateParam('ColorWriteEnable').value = 0;
  
      // Next one to draw the 3 rings in front of everything
      var frontDrawList = g_stencilPack.createObject('DrawList');
      var frontDrawPass = g_stencilPack.createObject('DrawPass');
      frontDrawPass.drawList = frontDrawList;
      frontDrawPass.priority = 9001;  // after our special clear.
      frontDrawPass.parent = g_viewInfo.viewport;
      g_treeTraversal.registerDrawList(frontDrawList, backDrawContext, true);
  
      // find all the pCylinder1 Transforms (the stencil discs)
      var stencils = g_stencilRoot.getTransformsByNameInTree('pCylinder1');
  
      // put each stencils at the beginning of the render graph
      for (var ss = 0; ss < stencils.length; ss++) {
        // there should be only one shape under each pCylinder1
        var shape = stencils[ss].shapes[0];
  
        // make a new material.
        var material = g_stencilPack.createObject('Material');
  
        // copy the old material's params.
        material.copyParams(shape.elements[0].material);
  
        // tell things drawn with this material to get drawn in the back draw
        // list.
        material.drawList = backDrawList;
  
        // create DrawElements using this material.
        shape.createDrawElements(g_stencilPack, material);
  
        o3djs.material.attachStandardEffect(g_stencilPack,
                                            material,
                                            g_viewInfo,
                                            'phong');
  
        // make state that renders into the stencil only
        var state = g_stencilPack.createObject('State');
        material.state = state;
        state.getStateParam('StencilReference').value = ss + 1;
      }
  
      // clear the zbuffer before drawing the circles
      var clearBuffer = g_stencilPack.createObject('ClearBuffer');
      clearBuffer.clearColorFlag = false;
      clearBuffer.clearStencilFlag = false;
      clearBuffer.priority = 9000;
      clearBuffer.parent = g_viewInfo.viewport;
  
      // put each circle at the end of the render graph
  
      // find all the pPipe? Transforms
      var circles = o3djs.util.getTransformsInTreeByPrefix(g_stencilRoot,
                                                           'pPipe');
      for (var cc = 0; cc < circles.length; cc++) {
        var transform = circles[cc];
        // there should be only one shape under each pPipe
        var shape = transform.shapes[0];
        // there should be only one element in each shape.
        var primitive = shape.elements[0];
        // set it's material to draw in the front draw list.
        primitive.material.drawList = frontDrawList;
        o3djs.material.attachStandardEffect(g_stencilPack,
                                            primitive.material,
                                            g_viewInfo,
                                            'phong');
  
        // generate draw elements for it.
        shape.createDrawElements(g_stencilPack,
                                 null);
      }
  
      loadScene(g_scenePack[0], 'assets/teapot.tgz', mySceneRoot[0],
                setupScene0);
    }
  
    function setupScene0() {
      loadScene(g_scenePack[0], 'assets/dome1.tgz', mySceneRoot[0],
                setupDome0);
    }
  
    function setupDome0() {
      // Stencil 0 is the center.
      setupScene(g_scenePack[0], mySceneRoot[0], 0);
      loadScene(g_scenePack[1], 'assets/part1.tgz', mySceneRoot[1],
                setupScene1);
    }
  
    function setupScene1() {
      loadScene(g_scenePack[1], 'assets/dome2.tgz', mySceneRoot[1],
                setupDome1);
    }
  
    function setupDome1() {
      // stencil 3 is the top left.
      setupScene(g_scenePack[1], mySceneRoot[1], 3);
      loadScene(g_scenePack[2], 'assets/part2.tgz', mySceneRoot[2],
                setupScene2);
    }
  
    function setupScene2() {
      loadScene(g_scenePack[2], 'assets/dome3.tgz', mySceneRoot[2],
                setupDome2);
    }
  
    function setupDome2() {
      // stencil 2 is the top right.
      setupScene(g_scenePack[2], mySceneRoot[2], 2);
      loadScene(g_scenePack[3], 'assets/part3.tgz', mySceneRoot[3],
                setupScene3);
    }
  
    function setupScene3() {
      loadScene(g_scenePack[3], 'assets/dome4.tgz', mySceneRoot[3],
                setupDome3);
    }
  
    function setupDome3() {
      // stencil 1 is the bottom.
      setupScene(g_scenePack[3], mySceneRoot[3], 1);
  
      g_client.setRenderCallback(onrender);
      g_finished = true;  // for selenium testing.
    }
  
    function setupScene(pack, root, stencil_id) {
      // Get a cameraInfo (a Transform with a view and projection matrix)
      // using our javascript library function
      var cameraInfo = o3djs.camera.getViewAndProjectionFromCameras(
          root,
          g_o3dWidth,
          g_o3dHeight);
  
      // Create a new draw context and set it to use the camera from the scene
      // we just loaded.
      var sceneContext = pack.createObject('DrawContext');
      sceneContext.view = cameraInfo.view;
      sceneContext.projection = cameraInfo.projection;
  
      g_treeTraversal.registerDrawList(myLocalDrawPass[stencil_id].drawList,
                                       sceneContext,
                                       true);
  
      // save off the locators. Our shapes are parented to the so we can rotate
      // them for animation
      var locators = o3djs.util.getTransformsInTreeByPrefix(root,
                                                            'locator');
      g_locators[g_locators.length] = root;
  
      // get all the shapes in the pack we just loaded.
      var shapes = pack.getObjectsByClassName('o3d.Shape');
      for (var ss = 0; ss < shapes.length; ss++) {
        var shape = shapes[ss];
        var elements = shape.elements;
        for (var ee = 0; ee < elements.length; ++ee) {
          var element = elements[ee];
          element.material.drawList = myLocalDrawPass[stencil_id].drawList;
          o3djs.material.attachStandardEffect(g_stencilPack,
                                              element.material,
                                              g_viewInfo,
                                              'phong');
        }
      }
  
      root.createDrawElements(pack, null);
    }
  }