add TransformControls into areaLight example

[dongho-shin]

previous version (0.0.20) areaLight example has TransformControls and it helps how to draw overlay at PathTracedScene, After interface changed, TransformControls removed. so i try to restore it related : https://github.com/gkjohnson/three-gpu-pathtracer/issues/639

[gkjohnson]

Thanks @dongho-shin! Sorry if I was unclear but I was imagining a new example that demonstrated depth integration like our discussion in #639.

const depthMat = new MeshBasicMaterial( { colorWrite: false } );

// ...

renderer.autoClear = false;

// render depth of the scene
scene.overrideMaterial = depthMat;
renderer.clearDepth();
renderer.render( scene, activeCamera );
scene.overrideMaterial = null;

// render the gizmos / real time interactive objects
renderer.render( testMesh, activeCamera );

renderer.autoClear = true;

I had specifically removed the controls in the spotlight demo because I thought they made the example code a bit more complicated. I think adding a simple example that displays a real-time animating object that overlaps with the depth of the pathtraced scene would show a nice use case and help show how this can be done.

[dongho-shin]

Oh I didn't know why you remove control in spotlight demo. I thought it's enough for draw overlay and its a nice use case. ok i will add a new example that we discussed

[dongho-shin]

https://github.com/gkjohnson/three-gpu-pathtracer/assets/108255990/046f267e-5675-439f-925b-c5582c84fde0

hi @gkjohnson I add very simple example it contains rendering depth.

[dongho-shin]

is it ok to merge sample? if you have an idea always welcome

[gkjohnson]

Thanks! Lets merge this and may make some changes to add a few new features later.