Throwing ball on touchEnd and Mouseup

Help & Support
#1

Hello guys, i hope that you have wonderfull day again, but I need help again with coding. If you have some time for that, i will be thankfull.

I have simple basketball game, where ball will throw on some direction on mouse up or touch end. Now its working like when it mouse is pressed, and Ball is clicked ,where Im using do Ray cast function, after som Y height it will automaticaly throw to basket hoop on some X direction. But that apply impulse is fixed to power Y and Z. But i want set up some power, where Y and Z applyimpulse depends on where was touchend or mouse up fired. Like if Touchend or Mouse up was in some Y height, than Y and Z power will be some number. If these events was higher, power will be higher too. But its not working because i dont know how can i put in my code Mouse up event. Because now is shooting this ball when its just mouse down klicked, so this ball is throwing on first. lowest Y height… But how can i set up ,that after if its was mouse down and also mouse up , than just throw with that power in area, where I left my finger or mouse.
Like here is some code:

BallMovement.prototype.onMouseMove = function(event){
  
    
    // console.log("Y: ",event.y, "X: ", event.x);
    if(this.isMousePressed ) {
  if(event.y <= window.innerHeight/1.4 && event.y > window.innerHeight/1.5 && this.canShot && this.isBallClicked ) {
               
            
                    this.app.fire('camera::followBall');
               
                    this.shotBallPC();

                    //throwing apply impulse power
                    this.entity.rigidbody.applyImpulse(this.pos.x*2.2, 5.8, - 3.4);
     
           }else if(event.y <= window.innerHeight/1.5 && event.y > window.innerHeight/1.7 && this.canShot && this.isBallClicked ) {
                
                  
                    this.app.fire('camera::followBall');
               
                    this.shotBallPC();
                    
                     // throwing apply impulse power
                    this.entity.rigidbody.applyImpulse(this.pos.x*2.2, pc.math.random (5.6, 5.8), - 3.4); 

            }else if(event.y <= window.innerHeight/1.7 && event.y > window.innerHeight/1.9 && this.canShot && this.isBallClicked ) {
                
            
                    this.app.fire('camera::followBall');
               
                    this.shotBallPC();
                    
                     // throwing apply impulse power
                    this.entity.rigidbody.applyImpulse(this.pos.x*2.2, pc.math.random (6, 6.2), - 3.4); 
         }
    }
};

How can I do that? I hope that jou could understand my miserable English.
If you have some solution, please share with me your knowledge.
Thanks.

#2

Hi @RogerDat,

If I understand correctly, instead of applying your impulses on mouse move, move them on mouse up. So you apply a final impulse at the end of the mouse swipe.

To do that start some accumulators on mouse down, reset them (set them to 0), and on each mouse move add their delta (event.dx/event.dy).

At the end on mouse up, calculate and apply the final impulse.

1 Like
#3

Hello,

Okej, i understand little bit. But i am not sure, cause i have this code at the beggining of MouseMove function.

BallMovement.prototype.onMouseMove = function(event){
  
    
    // console.log("Y: ",event.y, "X: ", event.x);
    if(this.isMousePressed ) {
    var context = this;
    var canTeleport = true;
    var depth = 3.8;
    var cameraEntity = this.app.root.findByName('Camera');
    cameraEntity.camera.screenToWorld(event.x + 10, event.y + 10, depth, this.pos);
    
         if(this.isBallClicked && canTeleport){
       
        //cameraEntity.camera.screenToWorld(event.x+100, event.y + 100, 5, this.pos);
        this.ball.setLocalPosition(this.pos.x, this.pos.y, this.ball.getLocalPosition().z);
        if(this.ball.getLocalPosition().y < 0.712) this.ball.setLocalPosition(0, 0.712, this.ball.getLocalPosition().z);
        
       if(this.ball.getLocalPosition().x < -0.5  ) this.ball.setLocalPosition(-0.5, this.ball.getLocalPosition().y, this.ball.getLocalPosition().z);
        if(this.ball.getLocalPosition().x > 0.5) this.ball.setLocalPosition(0.5, this.ball.getLocalPosition().y, this.ball.getLocalPosition().z);
         }

It means, that Ball is body type Kinematic so it can also move in some area before it is throw to hoop in some direction. So i can move with ball when I clicked on ball little bit, in little area. After throw, ball will set up body type Dynamic. But if I put my code on Mouse up function, i am not sure that the ball wll shoot in direction X. Cause it is recorded in Mouse move function. Maybe I should some code let in Mouse move, or everything copy to my Mouse Up function?