/* Squares
*  ------------------
*  iio.js version 1.4 
*/

// define a new iio app
function Squares( app, settings ){

  // set the app background to black
  app.set({ color: 'black' });

  // define the total number of squares
  var num = 120;

  // define a max speed
  var speed = 0.2;

  // if settings are passed and preview is active
  if( settings && settings.preview )
    // limit the total number of squares
    num = 40;

  // add new squares to the app
  for(var i=0; i<num; i++)
    app.add( new iio.Quad({
      // set random position within app view
      pos: [ 
        iio.random(0,app.width),
        iio.random(0,app.height)
      ],
      // set random width relative to num
      width: iio.random(num-20,num+20),
      // set color to white
      color: 'white',
      // set random velocity
      vel: [
        iio.random(-speed,speed),
        iio.random(-speed,speed)
      ],
      // set random transparency
      alpha: iio.random(.3,.6),
      // define fade animation with speed and callback
      fade: {
        speed: iio.random(.0001,.0006),
        callback: function(o){
          // make the square fully opaque
          o.alpha = 1;
        }
      },
      // define a function to be run on each update
      onUpdate: function(){
        // add a random value to the velocity
        this.vel.x += iio.random(-.01,.01);
        this.vel.y += iio.random(-.01,.01);
      }
    // include true to prevent automatic drawing after add()
    }), true);

  // define a function to be run when the app is resized
  this.onResize = function(){

    // set bounds on each object, relative to the new size
    // use callbacks to make squares bounce off app boundaries
    for(var i=0; i<app.objs.length; i++)
      app.objs[i].bounds = {
        bottom: {
          bound: app.height, 
          callback: function(o){ 
            // reverse y velocity 
            o.vel.y = -speed 
          }
        },
        top: {
          bound: 0, 
          callback: function(o){ 
            // reverse y velocity 
            o.vel.y = speed 
          }
        },
        left: {
          bound: 0, 
          callback: function(o){ 
            // reverse x velocity 
            o.vel.x = speed 
          }
        },
        right: {
          bound: app.width, 
          callback: function(o){ 
            // reverse x velocity 
            o.vel.x = -speed
          }
        }
      }
  }; 

  // set the initial bounds
  this.onResize();
}

// start the app fullscreen
iio.start( Squares );