Mouse and camera controls

[Mezzorio]

I wanted to know how to recreate the mouse movement effect I have found in an online example I am trying to recreate, the example is found here: https://www.g-star.com/en_gb/raw

Currently I get Jerky movements and fast rotation, I'm looking for infinite gradual scrolling effect which increases depending on mouse position, this is what im using for my mouse movement are there any alternatives or changes I can make to fix this? 

 var mouse = {x:0,y:0};
            var cameraMoves = {x:0,y:0,z:-0.1,move:false,speed:0.03};

            function mouseMove(e){

                 mouse.x = e.clientX;
                 mouse.y = e.clientY;

            camera.rotation.x += Math.max(Math.min((e.clientX - mouse.x) * 0.01, cameraMoves.speed), -cameraMoves.speed);
            camera.rotation.y += Math.max(Math.min((e.clientY - mouse.x) * 0.01, cameraMoves.speed), -cameraMoves.speed);
 

[jerome]

maybe by adding camera.getViewMatrix(true) to force the camera matrix recomputation earlier

no that easy to tell without a PG

[Mezzorio]

here is a playground https://www.babylonjs-playground.com/#A8TKYS

[GameMonetize]

You should add inertia.

Something along these lines:

https://www.babylonjs-playground.com/#A8TKYS#1

[Mezzorio]

Hey @Deltakosh, that hasn't made any changes to the functionality I have working. I need it too;

Have a constant rotating speed reflecting the mouse distance from center.

Move based off mouse movement left/right side of the screen

It currently moves in the inverse direction,, needs to not do that

Need a way of making movement smoother

[Mezzorio]

17 hours ago, Deltakosh said:

You should add inertia.

Something along these lines:

https://www.babylonjs-playground.com/#A8TKYS#1

Help

[GameMonetize]

Done:

https://www.babylonjs-playground.com/#A8TKYS#2

 

[Mezzorio]

YOU SIR, ARE A HERO.

[Mezzorio]

12 hours ago, Deltakosh said:

Done:

https://www.babylonjs-playground.com/#A8TKYS#2

 

Do you know of any ways to make the motion smoother? or a way to animate the images so they suffer less for the camera rotation? 

Also i need to enable a tiny bit of movement along the y axis and am struggling with how to do that it just enables full to sky and floor whatever i try and set

[GameMonetize]

You can make it smoother by adding a bit of inertia

[adam]

I set a max speed on these:

https://www.babylonjs-playground.com/#A8TKYS#4

This one translates the camera position:

https://www.babylonjs-playground.com/#A8TKYS#3

edit: I also changed the cell sizes from 4300 to 256.

[Mezzorio]

On 10/08/2017 at 6:49 PM, adam said:

I set a max speed on these:

https://www.babylonjs-playground.com/#A8TKYS#4

This one translates the camera position:

https://www.babylonjs-playground.com/#A8TKYS#3

edit: I also changed the cell sizes from 4300 to 256.

I'm not too sure i understand the cell sizes side of things, what exactly does it mean? also do you know how to enable movement along the y but only but a small amount?

Edit: I went back and changed the cell size and my images now won't work?

[Mezzorio]

On 10/08/2017 at 6:27 PM, Deltakosh said:

You can make it smoother by adding a bit of inertia

How is Inertia used? or could you link me to the docs? I follow through the different docs but cannot find anywhere, the description of how it is used or works just mention of the word nothing on how to call it or what it does.

 

Edit: Also how do I invent camera rotation, so it moves the same way as the mouse is going rather than the opposite way which makes no sense as a default anyway.