//---- normal P5 code -------------------------------------------------------

// constants for player and opponent paddles
let playerPaddle;
let aiPaddle;
let ball;
let playerScore;
let aiScore;

const POP_SOUND = '/uploads/mrprice/mixkit-game-ball-tap-2073.wav';
const maxScore = 10;

AB.socketStart();


// function called before game runs 
function setup()       
{
    createCanvas(624, 351);
    playerPaddle = new Paddle(26);
    aiPaddle = new Paddle(width - 48);
    ball = new Ball();
    playerScore = new Score(width / 2 - 40);
    aiScore = new Score(width / 2 + 40);
    let popSound = new Audio ( POP_SOUND );
}


function draw()             
{
    sendData();
    background(0);
    playerPaddle.display();
    aiPaddle.display();
    
    playerPaddle.update();
    aiPaddle.update();
    
    processAI();
    
    ball.update(playerScore, aiScore);
    ball.display();
    // sendData(ball);
    
    ball.hasHitPlayer(playerPaddle);

    ball.hasHitAi(aiPaddle);
    
    stroke(255);
    line(width/2, 0, width/2, height);
    
    playerScore.display();
    aiScore.display();
}

function keyPressed() {
    if (keyCode == UP_ARROW){
        playerPaddle.isUp = true;
    }
    else if (keyCode == DOWN_ARROW){
        playerPaddle.isDown = true;
    }
}

function keyReleased() {
    if (keyCode == UP_ARROW){
        playerPaddle.isUp = false;
    }
    else if (keyCode == DOWN_ARROW){
        playerPaddle.isDown = false;
    }
}

function audioHandler(instance){
    if (instance == "pop"){
        var a = new Audio( POP_SOUND );		
        a.play();
    }
}

class Paddle {
    constructor(x) {
        this.x = x;
        this.y = height / 2;
        this.height = 80;
        this.width = 20;
        
        this.isUp = false;
        this.isDown = false;
    }
    
    display() {
        fill(236, 89, 59);
        rect(this.x, this.y, this.width, this.height);
    }
    
    // move paddle up
    up() {
        if (this.y > 0){
            this.y -= 2;
        }
    }
    
    // move paddle down
    down() {
        if (this.y < height - this.height){
            this.y += 2;
        }   
    }
    
    update() {
        if (this.isUp){
            this.up();
        }
        else if (this.isDown){
            this.down();
        }
    }
    
}

class Ball {
    constructor(){
        this.r = 10;
        this.reset();
    }
    
    update(playerScore, aiScore) {
        // if the ball hits the top or bottom of the screen, change its direction
        if (this.y < this.r || this.y > height - this.r){
            // sendData(-this.ySpeed);
            this.ySpeed = -this.ySpeed;
        }
        
        // if the ball goes to the ends of the screen, restart the game
        if (this.x < this.r) {
            aiScore.increase();
            this.reset();
        } else if (this.x > width + this.r) {
            playerScore.increase();
            this.reset();
        }
        
        this.x += this.xSpeed;
        this.y += this.ySpeed;
    }
    
    reset() {
        this.x = width / 2;
        this.y = height / 2;
        
        this.xSpeed = random(3, 4);
        // sendData(Ball)
        
        let isLeft = random(1) > .5;
        if (isLeft){
            this.xSpeed = -this.xSpeed;
        }
        this.ySpeed = random(-3, 3);
    }
    
    display() {
        ellipse(this.x, this.y, this.r * 2, this.r * 2);
    }
    
    hasHitPlayer(player) {
        if (this.x - this.r <= player.x + player.width && this.x > player.x){
            if (this.isSameHeight(player)){
                this.xSpeed = -this.xSpeed;
                audioHandler("pop");

            }
        }
    }
    
    
    hasHitAi(ai) {
        if (this.x + this.r >= ai.x && this.x <= ai.x + ai.width) {
            if (this.isSameHeight(ai)){
                this.xSpeed = -this.xSpeed;
                audioHandler("pop");
            }
        }
    }
    
    isSameHeight(player){
        return this.y >= player.y && this.y <= player.y + player.height;
    }
}

class Score {
    constructor(n) {
        this.n = n;
        this.score = 0;
    }
    
    display() {
        textSize(50);
        textAlign(CENTER);
        text(this.score, this.n, 60);
    }
    
    increase() {
        this.score++;
    }
}

function processAI() {
    let middleOfPaddle = aiPaddle.y + aiPaddle.height / 2;
    
    if (middleOfPaddle > ball.y){
        aiPaddle.isUp = true;
        aiPaddle.isDown = false;
    }
    else{
        aiPaddle.isDown = true;
        aiPaddle.isUp = false;
    }
}


// function sendData(playerScore, aiScore)
// {
//   var data = 
//   {
//     aiScore: aiScore,
//     playerScore: playerScore
//   };
  
//   AB.socketOut ( data );        // server gets this, and sends the data to all clients running this World
// }

// AB.socketIn = function(data)
// {
//     console.log(data);
//     // ball.update(data.score1, data.score2)
// };