var ArtBoard = new VSC.SVG("svg-banner-container", 950, 95);
var counter = 0;
var colors = ['#8EE810', '#f80', '#05B1EB', '#ED09A6'];

// var color = colors[colorIndex];
var color;
var opacity;

function newCircle(circleNum){
    
    var colorIndex = ArtBoard.toolkit.getRandomBetween(0, 59);
    
    switch(colorIndex){
        case 56:
        case 46:
        color = '#8EE810';
        opacity = ArtBoard.toolkit.getRandomBetween(35, 45);
        break;
        case 57:
        case 47:
        color = '#f80';
        opacity = ArtBoard.toolkit.getRandomBetween(35, 45);
        break;
        case 58:
        case 48:
        opacity = ArtBoard.toolkit.getRandomBetween(35, 45);
        color = '#05B1EB';
        break;
        case 59:
        case 49:
        color = '#ED09A6';
        opacity = ArtBoard.toolkit.getRandomBetween(35, 45);
        break;
        default:
        color = '#fff';
        opacity = ArtBoard.toolkit.getRandomBetween(5, 15);
        break;
    }
    
    var size = ArtBoard.toolkit.getRandomBetween(14, 30);
    var rate = size/25*20;
    rate = Math.ceil(rate);
    
    var x = ArtBoard.toolkit.getRandomBetween(0, 940);
    var y = 110;
    
    var c = ArtBoard.addRectangle('circle'+circleNum, x, y, size, size, 1);
    c.defaultTransitionTime = ArtBoard.toolkit.getRandomBetween(500, 800);
    c.setColor(color, false);
    c.setOpacity(opacity);
    var duration = 120000/rate;
    c.raphael.animate({y: -14, opacity: 0, color: color}, duration, "linear");
    setTimeout(function(){c.fadeOutAndDestroy()}, duration);
  
}

if(!Prototype.Browser.IE){

    var p1 = new PeriodicalExecuter(function(p1){
        newCircle(counter);
        counter++;
    }, 0.2);

}

/* var p2 = new PeriodicalExecuter(function(p1){
    if(colorIndex == 3){
        colorIndex = 0;
    }else{
        colorIndex++;
    }
    color = colors[colorIndex];
}, 2.5); */