Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I'm making a Pong game to get started with game-developement but I've run into a problem that i can't figure out.

When trying to change the balls direction it doesn't change. This is the relevant code:

function moveBall(){
    this.speed = 2.5;
    this.direction = 2;
    if(this.direction == 1){
        ball.X +=this.speed;
    }
    else if(this.direction == 2){
        ball.X -=this.speed;
    }
}

function collision(){
    if(ball.X == 500){
        moveBall.direction = 2;
    }
    if(ball.X == 300){
        moveBall.direction = 1;
    }
}

Why doesn't it work? I've tried many different ways, and none of them seem to work. The moveBall.direction changes though, since it alerts the new direction once it reaches the defined ball.X position.

If someone could help me I would deeply appreciate it. I've included a JSFiddle link.

http://jsfiddle.net/hustlerinc/y4wp3/

share|improve this question
add comment

3 Answers

up vote 4 down vote accepted

1) I would remove your direction variable because it can be included as part of the speed variable: negative speed values move left and positive speed values move right. This allows you to remove the if statements in the moveBall function and reduce it to a line or two

2) direction (if you keep it) and speed should be set outside of the move function, this will fix your problem. Every time you go to move your ball, it's resetting the speed and the direction back to their original values.

3) Using == to compare the position against an exact point can be dangerous, it is better to always use >= or <= depending on the case. But I won't be too hard on you because I'm pretty sure that's just for testing.

I don't really want to give you the codez, even though I did fix it, because learning how to fix these things is all part of the learning process :)

share|improve this answer
    
Excellent! The ball now bounces back and forth and with so much less code. Thank you very much. And yes, the == signs were just for testing, real collisions will require more complex code. :) Thanks for helping. :) –  hustlerinc Mar 16 '12 at 22:14
add comment

why did you put this.direction = 2; in second line of moveBall function? just remove it!

share|improve this answer
    
read the lines directly below and it will become clear. it is to define right or left. but removed it since previous poster came with a much better solution –  hustlerinc Mar 18 '12 at 11:36
1  
I know about that, but just read your code! every time ball move first you set direction to 2 which means the ball will move left, and then you check if value of direction is 2 move it toward left. that's why I'm asking you put such an statement there. –  Ali.S Mar 18 '12 at 18:30
add comment

A very simple way to handle this would be to omit the direction variable and just deal with xspeed and yspeed. This is how I handle reversing directions.

Ball = {
    pos: {x: 2, y: 2},
    size: {x: 8, y: 8},
    speed: {x: 2, y: 2},
    update: function() {
        if (this.pos.x < 0 || (this.pos.x + this.size.x) > canvas.width) this.speed.x *= -1;
        if (this.pos.y < 0 || (this.pos.y + this.size.y) > canvas.height) this.speed.y *= -1;
        this.pos.x += this.speed.x * deltaTime;
        this.pos.y += this.speed.y * deltaTime;
    }
}

If you require the direction variable, you can keep track of the previous x and y position and do a trace from that to the new position.

Edit: Keep in mind the code assumes the Ball is 8px by 8px and is drawn from top-left rather than the center. It would be easy to add an offset and have this handled for you.

share|improve this answer
    
This is a rather old question, allthough I like the way you handle the updating, and will try to implement it into my code (right now the game is playable but the code isn't that good looking). I might go back and update it. –  hustlerinc Jul 6 '12 at 4:40
    
It's important to deal with axis separately. There was a thread about it recently. –  Andrew Bennett Jul 7 '12 at 22:09
    
I don't know what "deal with axis" means, but the code I posted here has been changed long time ago. –  hustlerinc Jul 8 '12 at 21:59
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.