Bug control

[DigitalHilsone]

When an unidentified specific sequence somehow the ship suddenly starts to climb up, but it should not be. The bug occurs when you click on the left side of the scene.

 

Tell me, please, what is it? 

 

Link to the project.

	var clientX = 0;

	var clientY = 0;

	window.addEventListener("mousedown", function (e) {

		if (e.target.id == 'renderCanvas') {

			clientX = e.clientX;

			clientY = e.clientY;

		}

	});

	window.addEventListener("mouseup", function (e) {

		if (e.target.id == 'renderCanvas'

			&& Math.abs(clientX - e.clientX) < 10

			&& Math.abs(clientY - e.clientY) < 10) {

			var pickResult = scene.pick(scene.pointerX, scene.pointerY);

			if (pickResult.pickedPoint) {

				facePoint(newMeshes[0], pickResult.pickedPoint, scene, function () {

					moveObjectToPoint(newMeshes[0], pickResult.pickedPoint, scene);

				});

			}

		}

	});

	function facePoint(rotatingObject, pointToRotateTo, scene, callback) {

		var direction = pointToRotateTo.subtract(rotatingObject.position);	

		var v1 = new BABYLON.Vector3(0,0,1);

		var v2 = direction;

		var angle = Math.acos(BABYLON.Vector3.Dot(v1, v2.normalize()));

		console.log(angle);

		if (direction.x < 0) angle = angle * -1;

		var rotationAnimation = new BABYLON.Animation("rotationAnimation", "rotation.y", 10, BABYLON.Animation.ANIMATIONTYPE_FLOAT, BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT);

		var keys = [

			{

		        frame: 0,

		        value: rotatingObject.rotation.y

		    },

			{

		        frame: 10,

		        value: angle

			}

		];

		rotationAnimation.setKeys(keys);

		rotatingObject.animations.push(rotationAnimation);

		scene.beginDirectAnimation(rotatingObject, [rotationAnimation], 0, 10, false, 1, function () {

			if (callback) {

				callback();

			}

		});

	}

	function moveObjectToPoint(objectToMove, pointToMoveTo, scene) {

		var moveAnimation = new BABYLON.Animation("moveAnimation", "position", 10, BABYLON.Animation.ANIMATIONTYPE_VECTOR3, BABYLON.Animation.ANIMATIONLOOPMODE_CONSTANT);

		var keys = [

			{

		        frame: 0,

		        value: objectToMove.position

		    },

			{

		        frame: 30,

		        value: pointToMoveTo

			}

		];

		moveAnimation.setKeys(keys);

		objectToMove.animations.push(moveAnimation);

		scene.beginDirectAnimation(objectToMove, [moveAnimation], 0, 30, false, 1);

	}

});

[Dad72]

I understood nothing. I do not see of problem on your scene.

[Wingnut]

Hi guys.  Yeah, I see it.  The ship rises (comes close to the camera) when a click is done WHILE the background is scrolling.  Dad72 might not have moused against the edges of the screen to make it start scrolling, so he might not have seen the problem.  He also might not have clicked while the scrolling was happening.

 

I also see some quick "flashes" of the ship... momentarily being in a different position (x and z) and then back again.  We'll save that problem for another day. 

 

DH... notice that the ship animates (or moves-with-collisions) to the "high" position.  Before every animation starts (just after a click), console.log all the target information for the animation or moveWithCollisions that is about to happen.  Watch the values of the animation targets (by printing them to console BEFORE the animation begins).  You can print the ship locations DURING the animation, too, but that will give you a "busy" console. 

 

One of the targets will be different, odd, wrong.  It will be animating Y to 0... and you don't want Y to change.  You want Y to stay at ship.position.y, yes?  nod.

 

Look at your background scroller.  Something in the background scroller is messing-up the ship animations, I suspect.  The "rising ship" problem only seems to happen when a click is done while the background is scrolling.  That is a big hint for finding the problem area, right? 

 

It is very possible that you are re-using a variable name.  When the screen starts scrolling, you set and animate some variables.  Make sure NONE of those variables have the same names as the variables used for the SHIP animation.  There is a VERY good chance that your scroller and your ship animator... are having a variable name conflict (both are using the same variable name... within the same scope)  (avoid global variables). 

 

Remember, it is ANIMATING to the problem location, so if you print the "data" for every animation, I think you will see ONE of the animations having and ending target with Y = 0,  or a moveWithCollisions that has its direction vector affecting Y.  Either of those situations... will cause the ship to animate/move up to the camera position (it will rise).  You must make sure that your animation targets and your moveWithCollision directions... ALWAYS keep Y == ship.position.y.  (sorry if I am over-explaining)

 

Finding a bug... sucks, but doing careful symptom analysis can help quite a lot.

 

First step... disable the scrolling and see if the problem is gone.  I bet it will be.  Keep us posted, we'll TRY to help, but your project is at a point where maybe only YOU can find the problems.  And in my experience, printing lots of things to console.log... will help you watch what is happening. 

 

I guess moveWithCollisions doesn't HAVE a target... it has a direction and velocity.  But if you determine that it IS a moveWithCollisions that is causing the problem, then its "direction" is messed up. The direction is somehow pointing upward... when it should only point sideways.  (Caused by a mis-calculated direction).

 

Good luck, keep us posted.

[Wingnut]

http://playground.babylonjs.com/#P5Q9Y

A playground version... using a flying rabbit!    Also using replacement textures... but... no big deal.

The main thing... we can see the rising ship bug (click while scrolling)... AND we can see the other "ship blip" bug.  I don't have time to troubleshoot the problem today, but LOTS of other people can help with it, now, and test stuff.  YAY!!!  Talk soon.

Another:  http://playground.babylonjs.com/#P5Q9Y#1

Notice that clicking on the sun... also raises the height of the ship.  But maybe that's normal.

[Dad72]

Yeah. I struggle to think with this heat. I am on pause ...

[iiceman]

@Wingy: good job making a playground out of it... I like that rabbit idea

@DH:

window.addEventListener("mouseup", function (e) {  if (e.target.id == 'renderCanvas'      && Math.abs(clientX - e.clientX) < 10      && Math.abs(clientY - e.clientY) < 10)  {    var pickResult = scene.pick(scene.pointerX, scene.pointerY);    if (pickResult.pickedMesh == splane && pickResult.pickedPoint) {      facePoint(newMeshes[0], pickResult.pickedPoint, scene, function () {        moveObjectToPoint(newMeshes[0], pickResult.pickedPoint, scene);      });    }  }});

adding "pickResult.pickedMesh == splane" seems to help. That limits the clicks to only those on a certain plane and not the scrolling areas or the sun or planets. Hope that helps

http://playground.babylonjs.com/#P5Q9Y#3

[DigitalHilsone]

@iiceman, thank you very much. Everything works) 

[iiceman]

Cool, keep us up to date how it is going, I am curious how the game turns out in the end

[DigitalHilsone]

Cool, keep us up to date how it is going, I am curious how the game turns out in the end

Of course) in September already all I tell and show what this project and that it will be.

 

ps .: there is an opportunity I would like to ask for more help to cope with a bit unrealistic path of rotation of the ship - imagine so cruiser say will unfold)

[dbawel]

Hey Wingnut,

 

It's amazing that you simply post a flying bunny on the playground, and I can't help but to spend over an hour playing with the math just to watch the bunny fly around different paths.  It's almost as fun as the 5+ hours I spent playing Call of Duty Advanced Warfare last night - almost.   

 

@DigitalHilsone - I'm trying to modify the rotation function as it relates to the translation function - to try and apply the shortest rotation delta which will make the rotation appear more natural. But it's also the relationship to the frame #s Wingnut set in his script.  I haven't yet applied a more direct orientation transform, but still looking at this.  If anyone else comes up with this first, please post.  Otherwise, I should just re-write a bit of the process, as I'm just wasting time trying to modify Wingnut's function - but that's how lazy I am today.

 

Cheers.

[Wingnut]

  Actually, Iceman worked-on the ship turning, but I watched.    And it was Deltakosh that was nice enough to include dude and rabbit models in the Scenes/ folder... so I could make a playground version of our bones/skeleton demo from the main website.  Thanks dk!  When in doubt, use a rabbit.  They have lucky feet.

 

Then somebody made this... http://www.babylonjs-playground.com/#11BH6Z#12

 

I can't remember who... but they were beginning a bones animating lab or transforming lab... for josh and I ... some wild idea we once had.  There's a toolbar hider and other good gui techniques...  it's cool.  I am totally honored.  It is a very interesting bone-tracker thing, so far. 

 

How embarrassing that I don't remember who made it.  sigh.  Whomever it was... THANKS!

[Dad72]

Hi,

 

Wingunt: On the demo of your link, now a best practice to attach an object to a bone is a new attachToBone() function integrated in babylon now. The mount() function that I had made is therefore no longer useful and not sufficiently effective. 

 

http://www.babylonjs-playground.com/#11BH6Z#19

[Wingnut]

Cool.  Dad72, did you code that entire #11BH6Z -series demo?  Hey...thanks! 

 

(thx to co-authors, too, if there were some)

[Dad72]

I must be one of those who had made at the beginning.

[iiceman]

I already posted it in the other thread but since it seems connected to this one here, I'll post it here as well: here is a demo for the move with collision + rotate before move http://playground.babylonjs.com/#Z3UOX#10

Would be cool if anybody integrates it in the fancy flying rabbit demo I don't have time (well, actually it's more like I don't have mood) at the moment

[Wingnut]

haha  (I ran out of LIKE-vote quota for the day, believe it or not. Friggin' like-rationing forum software.)

Flying rabbits.  Boy, did WE ever start something with THAT, huh?  hehe. 

Someday, we might be able to add a playground /Scenes/Users/ path... with a bunch of .babylon files in it... probably low rez...  maybe call it our "advanced shapes" library.  Put DH's spaceship in it, if he'll allow it.  Start our own playground models repository... a little one... with little-but-handy models in it... like an arrow... and a simple model of a camera... and a rabbit... maybe a cow...  ok... ALL of the basic farm animals. 

Actually, I haven't tested it, but I think Jerome's tube'n'ribbon system can make a low-rez arrow quite easily.  Someday I'll try it...  with his cool CustomRadiusFunction. (function that users can use to deliver radius values for each step along a tube path). Fun!

 

"I don't have mood"  hehe.  Been there. 

Ice, are you thinking about DH's slight targeting inaccuracy thing?  I don't see much inaccuracy in your demo... but his has SOME mis-targeting.  I was wondering if you have pondered WHY, yet, or ever will.  Party on!