AB.world.newRun = function() {
    AB.socketStart();
    AB.runReady = false;
    console.log("======>SOCKET CONNECTED<=====");
};
const MUSIC_BACK  = '/uploads/xiaoyul2/videoplayback.mp3' ;

let x, y, bg
var num_fire_p1=0
var num_fire_p2=0

AB.backgroundMusic ( MUSIC_BACK );
particles = []

function setup() {
    
    createCanvas(windowWidth, windowHeight,WEBGL);
    bg = createGraphics(width, height);
    bg.background('red');
    for (let y = 0; y < height; y += 20) {
    for (let x = 0; x < width; x += 20) {
      if ((x / 20 + y / 20) % 2 === 0) {
        bg.fill('black');
      } else {
        bg.fill(
          map(x + y, 0, width + height, 0, 360),
          map(y, 0, height, 50, 100),
          map(x, 0, width, 50, 100)
        );
      }

      bg.square(x, y, 20)
    }
  }
}


function draw() {

    let x = mouseX-width/2, y = mouseY-height/2
    
    image(bg, -width / 2, -height / 2, width, height);
    
    directionalLight([255], createVector(0,0,-1));
    if (random(1)>0.90){
        for(var i = 0; i <10; i++){
          //color
          var r = map(sin(frameCount), -1, 1, 0, 255)
          var g = map(sin(frameCount/2), -1 , 1, 255, 0)
          var b = map(cos(frameCount /4 ), -1, 1, 0, 255)
          var c = color(r, g, b)
          
          var p = new Particle(c, x, y)
            particles.push(p)
        }
    }
    for (var j = particles.length -1; j >= 0; j--){
      if (dist(particles[j].pos.x, particles[j].pos.y, particles[j].pos.z, x,y,10)<800){
        particles[j].update()
        particles[j].show()
      }
      else{
        particles.splice(j,1)
      }
  }
    num_fire_p1 += 1;
    if(AB.socket){
	        if(AB.socket.connected){
	            AB.socketOut(num_fire_p1)
	            AB.msg("P1 Score = " + num_fire_p1 + " P2 score = " + num_fire_p2 + "\n Time remaining: " );     // Display player scores
	        }
	    }

  
}
class Particle {
    constructor(c, x, y){
        
        //start position of the fireworks
        //this.pos = createVector(0,0,0)
        this.pos = createVector(x, y , 0)
        this.vel = p5.Vector.random3D().normalize().mult(random(4,6))
        this.c = c
    }
    update(){
        this.pos.add(this.vel)
    }
    show(){
        push()
        
        noStroke()
        fill(this.c)
        translate(this.pos.x, this.pos.y, this.pos.z)
        //translate(1, 2, 2)
        sphere(10)
        
        pop()
    }
}


AB.socketIN = function(num_fire_p1){
    num_fire_p2 = num_fire_p1;
    }