How to do hit detection of mouse in Three.js using PointerLockControls?

Question

I made an open source project. It is a data visualizer for your books in 3D using Three.js. (https://github.com/AlinCiocan/BooksIn3D). And now I want to do detect if a user is in front of a book if pressed a key. Something like this:

For example, in the above image, the cursor hand it is not hitting any books.

I tried my best to actually make a function to work, but I am stuck. I searched if there any question on SO on how to do hit detection using PointerLockControls, but I found nothing. I must say that my cursor hand it is not moving, it is always on the center of the screen.

function hitDetection(targets, callback) {
    var projector = new THREE.Projector();
    var raycaster = new THREE.Raycaster();

    var mouse = {};
    // it is always the center of the screen
    mouse.x = 0;
    mouse.y = 0;

    var vector = new THREE.Vector3(mouse.x, mouse.y, 1);
    var cameraDirection = controls.getDirection(vector).clone();
    projector.unprojectVector(cameraDirection,camera );

    var ray = new THREE.Raycaster(controls.getObject().position, cameraDirection.sub(controls.getObject().position).normalize());

    var intersects = ray.intersectObjects(targets);

    // if there is one (or more) intersections
    if (intersects.length > 0) {

        var hitObject = intersects[0].object;
        console.log("hit object: ", hitObject);
        callback(hitObject);

    }
}