Camera Dreaming

[Noyogi]

Hello there,

I have been around and around trying to come up with a camera to use. After looking at the work around's to make a camera work for my purpose I then decide another camera would be better, but then as I am looking at the work around's for this other camera, I either come back to the first or on to a third. So I need to take a break cause I am getting dizzy. I thought maybe I would make a post where I just share some of my camera dreams, please feel free to share any dreams of your own. Or if you have a recommendation, you are welcome to share.

This Playground is representetive of the environment that I am using:

http://www.babylonjs-playground.com/#WFLKH#25

Snaps: Like the click of the mouse wheel, if an arc rotate camera had rotational snaps, when you swipe on a touch device the camera would only go to the next snap or if you swipe more aggressively the camera would settle 2 or 3 snaps away, maybe a phone vibrates when it settles on the snap. Or maybe you could enter an array of vector3's that were the only possible camera targets, with a bezier between

Arc Rotate origin and target: An interesting addition to the arc rotate camera might be a camera origin at the point where the camera rotates around and a target where you want the camera to look which could be on the other side of the origin.

Free Camera Up and Down with arrow keys and touch swipe: I am sure this is pretty simple with the input manager I just don't yet understand the API and too get caught up with the arc rotate camera. Rather than move forward and backward with up down arrow and swipe i want to move up and down.

Does the new setpivotpoint work for cameras cause that would help me lean towards the freecam.

 

[Wingnut]

Hi again, Noyogi.  Good thinkin'.  You have the traits of an inventor, for certain. 

You need the Babylon.FulcrumTouchTargetCamera. 

What's that?  "No such thing", you say?   Darn!

There is one thing that camera experimenters sometimes forget.  Cameras can have a parent that is a mesh, and that mesh can be set invisible, later.

http://www.babylonjs-playground.com/#WFLKH#27

I did a few things.    Made a little "ringMaker" func... to make life a little easier, there. 

I also turned-on camera 2 and camera monitor 2 (mon2)... and placed cam2 near the end of a "fulcrum" beam long-box (positioned a tiny bit ABOVE the beam, too). 

Then I used a renderTargetTexture (sometimes called an RTT) to put cam2 view... on a plane (mon2) and parented mon2 to cam1... so it would stay in-view all the time.

Then I put a slow Y-rotation on the fulcrum... just to prove it was all working (particularly cam 2 and mon 2)

Don't worry about the layerMask crap.  We can talk about that stuff... another day. 

I don't know why the RTT is so dark.  I'll need to think about that.  I also don't know why camera 1 .beta angle (drag up/down) is affecting the view of camera 2.  Maybe I need to adjust the layerMask for lights, too.  Not sure how that all works.  I'm a noob in too many ways.    I have another 4-RTT demo with no darkness problems.  hmm.  *scratch scratch*

Eventually, you will make cam 2 be your primary camera.  But for now, we'll use cam 1 to watch the fulcrum that has cam 2 parented near-to one end of it. 

I think you KNOW what your challenge here, is, right?  Attaching "swipe" values... to the fulcrum beam rotation.

Mesh have an interesting helper...  mesh.lookAt().  But you won't know WHAT direction the fulcrum beam will aim, after some swipe, right?  In a way, you need a snap-to-lookAt(), right?  In fact, you still need to figure HOW to attach swipe values... to the fulcrum's rotation/aiming. 

So, you see, I have no real solution, here, and I have zero experience with touchscreen swipes.  I have probably made your issue MORE complicated, eh?  Sorry. 

But, I think I have shown you another approach.  The fulcrum beam will likely be set .visibility = 0, in the end.  My whole idea... might suck... as a solution... but I thought I should remind you about parenting cams to mesh, and show you RTT's and remote camera monitoring.  This is similar to setPivotMatrix for cameras, right?  And you can setPivotMatrix on mesh that have cameras parented to that mesh.  You have options. 

sphere.position.y = 10000; ... will get that center master-sphere... away from cam2 view, as needed.

Hopefully, smarter people than I... will comment soon.  Perhaps... you will want/need to "hack" the touchCamera instead, possibly adding an animateCamTargetToNearestMeshTarget() function... which is called after each swipe.  Who knows?  I'm here... simply to add more dream-space to your dreams.    We'll talk more, and you stay in touch and let us know what you invent/discover, eh?  This is an interesting challenge!  The solution will be useful to many other users, I suspect.

[Noyogi]

Hey Nutter aka @Wingnut ,

In this case the fulcrum's length is irrelevant, as in changing the size of the fulcrum does not effect the placement of the camera, the fulcrum might as well be a 1x1x1 box, no?

I tried animating a box as the target it works to just play the animation but it doesn't work to use key down and up to play and stop the animation

scene.actionManager.registerAction(new BABYLON.PlayAnimationAction(BABYLON.ActionManager.OnKeyDownTrigger, anibox, 0, 30, false));

thanks for your inputs and consideration

[Wingnut]

Yeah, size of fulcrum doesn't matter.  Making the fulcrum point-at/aim-at the desired target, is the challenge... possibly involving fulcrum.lookAt().

Clicking-on wanted target, not too much problem.  fulcrum.lookAt(clickedObject).  But... swipes and keypresses... erf. 

Swipes... really... would just rotate the fulcrum (and its cam) in the direction of the swipe-motion.  AFTER the swipe happens, something "smart" would need to finish aiming the fulcrum to the nearest legal target. (like a snap-to-target).   Hopefully, it is the target that the user wanted to choose... with the swipe.  Ow.  My brain hurts, for this one. 

With keypresses... hmm... a user might use an UP cursor (or perhaps 'w'), but there might not be a new target that is directly above the current target.  SO, even there... a smart-targeter would need to determine which new target... the user intended... and then rotate the fulcrum to aim directly at it.  Targeting correction.

Am I on-topic at all?    i can't tell anymore. 

[Noyogi]

oops i pasted the wrong thing, I meant to paste this playground:

http://www.babylonjs-playground.com/#WFLKH#30

@Wingnut

[Noyogi]

you are on a topic, for sure, at the moment I am just trying to get an arc rotate camera to do an elevator movement with up and down keys, baby steps.

i will attempt some kind of snap once, i get something as simple as a key press to work ; )

[Wingnut]

http://www.babylonjs-playground.com/#WFLKH#31

In lines 100 and 101, you needed to use 'box' and not 'anibox'. 

You'll need to re-activate line 104 as wanted.

[Noyogi]

thank you @Wingnut, and i see that it works now, but i don't understand, if the action is to play an animation wouldn't the target be the animation?

[Wingnut]

My pleasure.

24 minutes ago, Noyogi said:

if the action is to play an animation wouldn't the target be the animation?

Apparently not.    I visited the docs, too.  Checking docs for confusing things... is one of my self-appointed duties around here.

Generally speaking, throughout BJS, target means... a mesh.  Sometimes target can also be a vector3, I suppose. 

Hmm... I guess I won't do any edits to the actionManager docs for that one.  But you're right, in a way.  The subject of THAT action... is "playing an animation".  Target could easily mean "WHICH animation", eh?  I can understand that.  I could probably add a line about target being a mesh. 

Maybe I will.  Or you can do it, too, if you're comfortable doing docs editing.  It's open to all users.  Good point, though.  Definitely some potential confusion is possible, there.

I won't rule-out the possibility of the ActionManager author... adjusting the code.  Or even YOU adjusting the code.  But, I think the big dogs will say that "target" consistently means a mesh. 

[Noyogi]

so

@Wingnut

one can have multiple animations attached to a single mesh and the animations can have different names and you can call an individual animation on a mesh or meshes, outside of this action, but there is no declaring which animation to play when using this action so the action:

new BABYLON.PlayAnimationAction

is limited to playing all animations that are pushed to which ever mesh you choose, so it's like an AnimateMeshAction, am i on the right track

within:

scene.actionManager.registerAction(new BABYLON.PlayAnimationAction(BABYLON.ActionManager.OnKeyDownTrigger, box, 0, 30, true));

from http://www.babylonjs-playground.com/#WFLKH#32

there is no reference to the animation, only to the mesh

Also the keydown trigger must not be like the clickdown trigger where it is only called once, the keydown trigger seems to keep triggering

 

[Wingnut]

Oh, I knew you were going to ask about targeting individual animations that might be stacked into mesh.animations array.  To be frank, I don't have an answer to that.  I have only done basic experiments with animations. But again, you're right.  PlayAnimation action would have much more power... if it could be more selective.  Another good point, or seemingly so.   I hope I'm not disappointing you by not having those answers.  I'm still quite noob.    I'm what folks call a simpleton.  More drug addict than programmer.  hehe

Keys... repeat... if you hold them down for some time, right?  There might be a way to disable keypresses until an animation has stopped.  I KNOW there is an onAnimationEnd callback or similar.

You could create your own startAnimation() function... and one of its early lines could be to disable further keypresses.  Then when animation ends, use that onAnimationEnd callback to turn-on the keypress listener, again.  Instead of a playAnimationAction, you might use a executeCodeAction that would call your own animation player func.  In there, you COULD possibly select the exact animation to start playing... such as scene.playDirectAnimation(mesh.animations[2]) or something similar.

Next, I bet you will ask how to disable keypress listening at the actionManager... when using OnKeyDownTrigger.  And, guess what?  Again, I don't know how.    It might not be possible.  Or, maybe just un-register the keyDown trigger... and re-register after animation ends.  But you'll still need to do that inside a function, so... again, need to change to executeCodeAction and call your own function that does the action un-register and anim playing.

If you do turn-on an executeCodeAction, take careful notice of the special BJS actionEvent object that arrives at your function (as its only parameter).  In other words... make your function like this...   var myAnimPlayer = function(actionEvent) { blah blah foo }.  That actionEvent object (choose any name you wish, of course)... has some useful things on it.  It is sent to your function automatically... by the actionManager's executeCodeAction.

There's the option of NOT using actionManager at all.  Add canvas.addEventListener(onKeyDown, myFunction) (something like that) or perhaps use jQuery keypress events.  jQuery is installed in the playground by default, but you will need to bring it into your project with a <script> element... for home use.

Doing that... you'll have a little more power to ignore keypresses until animation finishes.  You can remove the keyDown eventListener until the animation onEnd call, and then re-add the event listener there.  *shrug*  Now stop asking such difficult questions!  heh.  (just kidding.  there's smarter people than I... nearby, and they might comment soon)

Now that I look, there was not one question mark in your last post.  heh.  Dummy me. 

[Noyogi]

Update: this sort of works for right arrow rotating free camera around y axis in one direction

http://www.babylonjs-playground.com/#WFLKH#45

[Wingnut]

Hi Noyogi.  I have some console errors with that PG.  I think you need to change lines 84 and 91 to ... 

var key = evt.sourceEvent.keyCode;

*shrug*.    The "evt" object that arrives in the executeCodeAction function... is not a DOM event.  It is a special BJS event, but if there was a standard DOM event involved (like a keypress event), it stores that DOM event object... in its .sourceEvent property... and you can get a .keyCode value from that.

[Noyogi]

Thanks Wingnut. I hadn't noticed this post till just now. I corrected the Playground.

http://www.babylonjs-playground.com/#WFLKH#46