Three.Js Raycasting not working when changing camera transformations whiich is a child of an Object3D

Question

So I have created a "camera controller" that create an Object3D and make it as parent for the camera . The translations and the rotation of the Y axis are applyed to the Object3D, and the rotation of the X axis is applyed to the camera . This is the code :

function cameracontroll(cam,scene){

this.cam=cam;
this.scene=scene;
this.baseobject=new THREE.Object3D();
//a vector3 that hold the rotations to be applyed
this.rot=new point(0,0,0);
//rotation speed
this.rspeed=0.002;
//move speed
this.mspeed=0.2;
//last mouse X position
this.lx=0;
//last mouse Y position
this.ly=0;
//direction indicators
this.go_up=false;
this.go_down=false;
this.go_left=false;
this.go_right=false;
this.go_forward=false;
this.go_backward=false;
//to correctly initialize mouse position
this.counthelper=0;

//init function
this.init=function(){
    this.baseobject.position=this.cam.position;
    this.baseobject.add(cam);
    this.scene.add(this.baseobject);

}

//rotation updating
this.updaterotation = function(e){
    if(this.counthelper==0){this.lx=e.clientX;this.ly=e.clientY;this.counthelper++;}
    this.rot.x= ((e.clientX-this.lx)*this.rspeed)*-1;
    this.rot.z= ((e.clientY-this.ly)*this.rspeed)*-1;
    cam.rotateX(this.rot.z);
    this.baseobject.rotateY(this.rot.x);
    this.lx=e.clientX;
    this.ly=e.clientY;
}

//position updating
this.updateposition = function(){
    if(this.goup){
        this.baseobject.translateY(this.mspeed);
    }
    if(this.godown){
        this.baseobject.translateY(-this.mspeed);
    }
    if(this.goleft){
        this.baseobject.translateX(this.mspeed);
    }
    if(this.goright){
        this.baseobject.translateX(-this.mspeed);
    }
    if(this.goforward){
        this.baseobject.translateZ(this.mspeed);
    }
    if(this.gobackward){
        this.baseobject.translateZ(-this.mspeed);
    }
    this.cam.updateMatrix();
}

};

The problem is when I use this controller to move the camera and his parent the raycasting not detect meshes anymore.

This is the raycasting function

document.addEventListener('click',function(event){
    event.preventDefault();
    mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;
    raycaster.setFromCamera( mouse, camera );
    var intersects = raycaster.intersectObjects(scene.children);
    if (intersects.length > 0) {
        console.log("Intersects!");

    }
},false);

I have tried "cam.updateMatrix()" and "cam.updateProjectionMatrix" but nothing changes .Even after the camera become child of the Object3D the positions that I have initialize it with still the same (0,10,-4). Anyone have an idea why the raycasting do not work when I change the camera positions with this controller.

Answer 1

So just if this may help someone having this problem ,I have tried a solution for that not the best but it works. In the begining of the click event I have stored the world and the relative positions of the camera, then I have removed the camera from its parent ,set its position to the world position and then add it to the scene. After checking the raycasting ,I have removed the camera from the scene and reset its position to the prevviously stored local position ,and finally add it to the baseobject.

document.addEventListener('click',function(event){
    var px = camera.getWorldPosition().x;
    var py = camera.getWorldPosition().y;
    var pz = camera.getWorldPosition().z;
    var pxx = camera.position.x;
    var pyy = camera.position.y;
    var pzz = camera.position.z;
    camcont.baseobject.remove(camera);
    camera.position.set(px,py,pz);
    scene.add(camera);
    event.preventDefault();
    mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;
    raycaster.setFromCamera( mouse, camera );
    var intersects = raycaster.intersectObjects(scene.children);
    if (intersects.length > 0) {
        console.log("intersects !!");

    }
    scene.remove(camera);
    camera.position.set(pxx,pyy,pzz);
    camcont.baseobject.add(camera);
},false);