Jump to content

Predefined path for a character (roam mode)


Batzi
 Share

Recommended Posts

So I have this demo below before I explain what I am trying to do

 

http://jsfiddle.net/Batzi/abs191e5/19/

 

So I am using the function 'moveToXY()' to move my character. Every 5 seconds it's moving towards a different direction. I am using SetTimeout() as you can see in the code. All animations are applied so everything is working as intended. In the update(), I am specifying when the character should stop (ex: if it reaches a specific x & y).

 

However, I want to declare a predefined path such as this one

var path = [[1700, 800], [1600, 800], [2300, 800]];

and have my character roam around but I don't want to duplicate the setTimeout.

 

How would you approach this problem?

 

PS: Ignore the coordinates in path. They're out of proportions.

Link to comment
Share on other sites

Why not use Phaser.Timer.loop()?

 

Doc : http://phaser.io/docs/2.4.4/Phaser.Timer.html#loop

How would you control when the character stops?

 

So far I am doing something like the code below in the update()

if(flag)  player.body.velocity.set(0);if(player.x==100)  flag = true;

and before firing up a moveToXY(), it is setting the flag to false to enable velocity.

 

If I have a predefined path, will I have to do several ifs or a switch in this case? Is there a more efficient way to do it?

Link to comment
Share on other sites

You can do a bit of math and see how long it'll take the character to get where it's going to go. Since you know the current point, the destination, and the velocity that'll give you the time. If you have the time you can set a timer to a value bigger than that.

 

If you want the route to really be a loop then you could move to the first position in the array, then send that position to the end of the array... so the next time the timer runs, your NEW position will be at the head of the list. Repeat forever or until killed by player. ( =

Link to comment
Share on other sites

You can do a bit of math and see how long it'll take the character to get where it's going to go. Since you know the current point, the destination, and the velocity that'll give you the time. If you have the time you can set a timer to a value bigger than that.

 

If you want the route to really be a loop then you could move to the first position in the array, then send that position to the end of the array... so the next time the timer runs, your NEW position will be at the head of the list. Repeat forever or until killed by player. ( =

Good idea! I will try that and come back after testing! :) Thanks!

Link to comment
Share on other sites

Shouldn't you also move when you reset the count to 0? Because as of now you don't.

 

So this should work better : 

function callMe(x,y){    console.log(player.x+'\n'+player.y);            if(count >= path.length) count = 0;    flag = false;    var x = path[count][0];    var y = path[count][1];                game.physics.arcade.moveToXY(player,x,y,60);    count++;}
Link to comment
Share on other sites

Oh, just read that in the doc (which might explain your issue) : 

 

moveToXY(displayObject, x, y, speed, maxTime) → {number}
 
Move the given display object towards the x/y coordinates at a steady velocity. If you specify a maxTime then it will adjust the speed (over-writing what you set) so it arrives at the destination in that number of seconds. Timings are approximate due to the way browser timers work. Allow for a variance of +- 50ms. Note: The display object does not continuously track the target. If the target changes location during transit the display object will not modify its course. Note: The display object doesn't stop moving once it reaches the destination coordinates. Note: Doesn't take into account acceleration, maxVelocity or drag (if you've set drag or acceleration too high this object may not move at all)
 
So what you need is this : http://jsfiddle.net/abs191e5/62/
 
Just set the maxTime so that it matches the loop interval. With this fix, your character will arrive exactly at his destination when ordered to move to a new one. I think you could even set maxTime to a lower value if you want the char to wait before changing his destination.
Link to comment
Share on other sites

 

Oh, just read that in the doc (which might explain your issue) : 

 

moveToXY(displayObject, x, y, speed, maxTime) → {number}
 
Move the given display object towards the x/y coordinates at a steady velocity. If you specify a maxTime then it will adjust the speed (over-writing what you set) so it arrives at the destination in that number of seconds. Timings are approximate due to the way browser timers work. Allow for a variance of +- 50ms. Note: The display object does not continuously track the target. If the target changes location during transit the display object will not modify its course. Note: The display object doesn't stop moving once it reaches the destination coordinates. Note: Doesn't take into account acceleration, maxVelocity or drag (if you've set drag or acceleration too high this object may not move at all)
 
So what you need is this : http://jsfiddle.net/abs191e5/62/
 
Just set the maxTime so that it matches the loop interval. With this fix, your character will arrive exactly at his destination when ordered to move to a new one. I think you could even set maxTime to a lower value if you want the char to wait before changing his destination.

 

Thank you so much! That helps me a lot!

 

Quick question though. So if I don't set a velocity like you did in the code, using the maxTime parameter, it will set the velocity depending on how long it takes the object to reach its destination?

Link to comment
Share on other sites

From the code, yes it does : https://github.com/photonstorm/phaser/blob/v2.4.4/src/physics/arcade/World.js#L1422

 

Do not hesitate to have a look at the code. In the doc for each method/property the corresponding code is always referenced. It's usually very readable and understandable!

Thanks! :)

 

One more thing, let's say I want to make him stop when he reaches a specific [x,y]. Do I have to stop using the loop in this case? Cause it will keep on going and the character won't stop since the flag is always set to false because of the callback function that the loop calls.

 

The ideal scenario is to have him stop for let's say a minute then move on to the next [x,y], stop for another min and so on and so forth.

Link to comment
Share on other sites

Why don't you set the loop interval to a big number (like a minute) and the maxTime to a small value (like 10s)? This way the char would walk 10s, wait 50s, walk 10s etc.

I tried that but it keeps walking until the loop calls the next [x,y].

 

EDIT: So apparently, if you tell it to go to x=100, it never actually stops at exactly x=100. Sometimes it's 101 and sometimes it's 100.XXXXX.

 

so in the Update(), if I do something like

if(player.x==100) flag=true;

It won't work since it's never 100. Depending on the current x value, sometimes it works if you do a toFixed() but it doesn't always work since the problem is not always the decimal part.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...