Aligning object to the picked point normal

[Cromlech]

Hi people,

This is my first post on the forum though I have been around for a couple of months now. I've found some topics that relate to my question but so far I've been unable to modify the solutions to this situation.

So, here's the situation. On the PG you can see two cubes and a skull. The smaller cube can be found under the gray cube, and the gray cube is parented to this smaller cube with multicolor faces. Now, if you click on the red face of the small cube, and then any point on the skull, the red face of the cube will be aligned to the normal vector on the picked point of the skull. The idea is to make it look like the gray cube is positioned along the skulls surface. However, this only works on the first time. The same problem occurs if line 70, "clickBox.rotation.x = Math.PI / 2;" is uncommented, so the cube is rotated already when the scene is loaded. So my question is, how do I calculate the effect of the change in rotation to the multicolor cube face's normal? I'm assuming this is the problem, but I'm known to be wrong sometimes . Oh, and let's assume I may have neglected my linear algebra and matrices studies, say, for the past ten years. Please be gentle on the maths.

Here's the Playground:

http://www.babylonjs-playground.com/#25B8RK#12

[Wingnut]

Hi @Cromlech, welcome aboard.

   Here is a strange playground...  found in some thread, where @RaananW was doing some quaternion playing.  I found this thread by searching the forum for the word "orthogonal".

http://www.babylonjs-playground.com/#2C8LVE#8

Drag-around out on the canvas, watch Susie the chimp rotate-around to match the faces of the mesh.  Not sure if this helps, but heck, I thought you should have it in your pocket, just in case.   

Another thread... also looked interesting.  Jerome produced an interesting playground or two... along the way.    Hope this helps.

[Cromlech]

Hi @Wingnut, thanks for the quick reply . I believe you may have found the exact thing I was looking for despite all my hours of googling. The first playground provides the answer, the other two look interesting as well, I'm going to have a better look at those.

I've been trying to learn to do stuff with Babylon for the whole summer but when I hit this wall I was already starting to lose hope, so thanks, now my life has a purpose again .

[GameMonetize]

@Wingnut is a hope giver

[Cromlech]

So, here's my updated version. It still has some unnecessary code, but now it functions the way its supposed to. The cube gets added on the spot by clicking.

http://www.babylonjs-playground.com/#25B8RK#13

Next I'm probably going to make some kind of an interface to rotate the object along its new local y axis.