/* ColorLines * ------------------ * iio.js version 1.4 */ // define a new iio app function ColorLines( app, settings ){ // initialize settings settings = settings || {}; var lineWidth = settings.lineWidth || 60; // add enough lines to fill the screen var offset = -app.width-lineWidth; for( offset; offset < app.width; offset += lineWidth ){ app.add( new iio.Line({ color: iio.Color.random(), width: lineWidth, // set line vertices vs:[ // start coordinates [ 0+offset, 0-lineWidth ], // end coordinates [ app.width+lineWidth, app.height-offset ] ], // animate the color with changing cycles cycle: 0, onUpdate: function(){ switch(this.cycle){ case 1: if( this.color.g > 100 ) this.color.g--; else if( this.color.r > 100 ) this.color.r--; else this.cycle = iio.randomInt(1,3); break; case 2: if( this.color.b < 200 ) this.color.b++; else if( this.color.r < 200 ) this.color.r++; else this.cycle = iio.randomInt(1,3); break; case 3: if( this.color.g > 0 ) this.color.g--; else if( this.color.r >0 ) this.color.r--; else this.cycle = iio.randomInt(1,3); break; default: if( this.color.r < 255 ) this.color.r++; else if( this.color.b < 255 ) this.color.b++; else this.cycle = iio.randomInt(1,3); } } // pass true to suppress app redraw }), true); } } // start the app fullscreen iio.start( ColorLines );