Three.js recover camera values

Question

When I start the script, camera has starting values. When I will move it and click button to set up startign values it is never same. What values I missed?

The best way, I suppose, it is to look at the example: http://jsfiddle.net/VsWb9/6652/

I used console.log for debbuging camera values.

HTML:

<button id="buttonTest">
TEST
</button>
 Please, move cube before click!
<div id="wrapper">

</div>

JS:

var camera, scene, renderer, geometry, material, mesh;

init();
animate();

function init() {
        window.wrapper = document.getElementById('wrapper');
    var buttonTest = document.getElementById('buttonTest');
    buttonTest.addEventListener('click', function() {
        test();
    });

    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 500;
    scene.add(camera);

    geometry = new THREE.CubeGeometry(200, 200, 200);
    material = new THREE.MeshNormalMaterial();

    mesh = new THREE.Mesh(geometry, material);
    scene.add(mesh);

    renderer = new THREE.WebGLRenderer({
        preserveDrawingBuffer: true 
    });
    renderer.setPixelRatio(window.devicePixelRatio);
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setClearColor(new THREE.Color("hsl(193, 50%, 57%)"));

    wrapper.appendChild(renderer.domElement);

        controls = new THREE.TrackballControls(camera, renderer.domElement);
    controls.rotateSpeed = 4.0;
    controls.zoomSpeed = 1.2;
    controls.panSpeed = 0.1;
    controls.noZoom = false;
    controls.noPan = false;
    controls.staticMoving = true;
    controls.dynamicDampingFactor = 0.3;
    controls.keys = [ 65, 83, 68 ];
    controls.addEventListener( 'change', render );

     console.log('camera_default: '+camera.position.x+', '+camera.position.y+', '+camera.position.z);
    console.log('quaternion_default: '+camera.quaternion.x+', '+
            camera.quaternion.y+', '+camera.quaternion.z+', '+camera.quaternion.w);
}

function animate() {

    requestAnimationFrame(animate);
    controls.update();
    render();

}

function render() {
        camera.lookAt(scene.position);
    renderer.render(scene, camera);
}

function test() {
        // lines below shows actual settings
    console.log('camera_now: '+camera.position.x+', '+camera.position.y+', '+camera.position.z);
    console.log('quaternion_now: '+camera.quaternion.x+', '+
            camera.quaternion.y+', '+camera.quaternion.z+', '+camera.quaternion.w);

    window.setTimeout(function() {
        // this is recovering camera values like
        // it was on the sart of script
        // it is not enought, what I missed?
        camera.position.x = 0;
        camera.position.y = 0;
        camera.position.z = 500;
        camera.quaternion.x = 0.0;
            camera.quaternion.y = 0.0;
            camera.quaternion.z = 0.0;
            camera.quaternion.w = 1.0;

        console.log('camera_recover_default: '+camera.position.x+', '+camera.position.y+', '+camera.position.z);
        console.log('quaternion_recover_default: '+camera.quaternion.x+', '+
            camera.quaternion.y+', '+camera.quaternion.z+', '+camera.quaternion.w);
        },1500);
}

Answer 1

Example solution using reset(), updateProjectionMatrix() and update() methods:

controls.reset();
camera.position.x = 13.5;
camera.position.y = 0;
camera.position.z = -165;
camera.updateProjectionMatrix();
controls.update();