// Style
var debug = false;

// Regulation
var balls_waiting = []; // this is global in scope (i.e. for the draw() loop)
var balls = [];
let next_tx = 0;
let interval_tx = 500; // milliseconds between new balls

function setup() {
    // Color
    colorMode(HSB); // 360, 100, 100, 1

    // Canvas
    var myCanvas = createCanvas(windowWidth, windowHeight);
    myCanvas.parent('sketch'); // show the sketch in a specific div
    
    // Create lots of balls
    for (var i=0; i<100000; i++) {
    	var ball = new Ball();
    	balls_waiting.push(ball);
    }

}

function draw() {
    // Redraw background constantly
    background(0, 0, 22); // Single Color Hue website background = 46

    // Logo
    noStroke();
    fill(0, 0, 8);
    textSize(56);
    textAlign(CENTER);
    text("HSB", windowWidth/2, windowHeight/2);


    // Transactions

    // Regulate the interval of adding balls if the number of waiting balls starts to back up
    interval_tx = map(balls_waiting.length, 0, 100, 500, 50);

    if (millis() > next_tx) { // millis() = time since program started
        // Add a ball to live balls only if we have one
        if (balls_waiting.length > 0) {
            a = balls_waiting.shift(); // get the first one
            balls.push(a); // add it to end of live balls
        }
        // set the time the next ball can be added
        next_tx += interval_tx;
    }

	// Transactions
    if (balls.length > 0) { // Display and update live balls if there are any

        // Show
        for (i=0; i<balls.length; i++) {
            balls[i].show();
        }

        // Update
        for (i=0; i<balls.length; i++) {
            balls[i].update();

            // Remove ball from array if runs below bottom of window
            if (balls[i].y > windowHeight + (balls[i].r * 2) + 200) {
                balls.splice(i, 1); // Remove ball
            }

        }
    }


 
    // Debugging Info
    if (debug) {
      // fill(100);
      // textSize(16);
      // textAlign(LEFT);

      // text("Balls Waiting:  " + balls_waiting.length, 24, 40);
      // text("Balls Active:   " + balls.length, 24, 64);
      // text("Interval:       " + interval_tx, 24, 88);
      // text("Next Tx:        " + next_tx, 24, 112);

      textAlign(CENTER);
      // text("Millisconds:    " + millis(), windowWidth-24, 40);   // p5js time since program started
      // text("Frame Count:    " + frameCount, windowWidth-24, 80); // p5js frames since program started
      
      fill(0, 0, 100);
      if (frameRate() < 50) { fill(360, 100, 100); } // show frame count in red if it drops a lot
      text(frameRate().toFixed(0), windowWidth/2, windowHeight/2 + 80);
      fill(0, 0, 100);
    }
}

function touchStarted() { // touch for mobiles (will use mousePressed instead if this is not defined)
	debug = !debug;
}

function windowResized() {
  resizeCanvas(windowWidth, windowHeight);
}


function Ball() {

    // position
    this.y = 0;
    this.x = random(windowWidth); // randomly position 

	// diameter
    this.d = random(10, 40);

    // drop
    this.velocity = 0;
    this.gravity  = 0.25;

    // elasticity - this is a function of the amount moved to tx size (in bytes)    
    this.elasticity = 0.2 + randomGaussian(-0.05, 0.05);

    // bounces
    this.bounce = 0;     // bounce count
    this.bounce_max = 1; // maximum number of bounces to do

    // HSB Colors

    // Blue (Normal)
    this.h = random(360)// 195;
    this.s = 50;
    this.b = 100;
    this.color = color(this.h, this.s, this.b);


    this.show = function() {
        noStroke();
        fill(this.color);
        ellipse(this.x, this.y, this.d, this.d);
        // text(this.elasticity, this.x, this.y+40);
    }

    this.update = function() {

        // drop
        this.velocity += this.gravity;
        this.y += this.velocity;

        // bounce
        if (this.y >= windowHeight - (this.d/2)) {
            if (this.bounce < this.bounce_max) { // number of bounces to do
                this.y = windowHeight - (this.d/2);
                this.velocity = - (this.velocity * this.elasticity); // reduce return velocity due to elasticity

                this.bounce += 1; // add to bounce count
            }
        }

    }

}