var pe;
var countFlipper = 0;

window.onload = function() {
pe = new PeriodicalExecuter(flipper, 8);


}

function flipper() {
var divs = $$('div.module').length;

if(countFlipper==24) {
pe.stop();

var clearflipper = Effect.Queues.get('flipperscope');
clearflipper.each(function(e) { e.cancel() });
var clearhighlight = Effect.Queues.get('highlightscope');
clearhighlight.each(function(e) { e.cancel()});

for (var i=1; i <= divs; i++) {

if(i==1){
new Effect.Appear('module_1', {duration: 0.0, to: 1.0, from: 0.0});
new Effect.Highlight('moduleNavbar_1', {duration: 0.0, startcolor:'#f1f1f1', endcolor:'#ffffff', restorecolor: '#ffffff'});
} else {
new Effect.Fade('module_'+i, {duration: 0.0, to: 0.0, from: 1.0}); 
new Effect.Highlight('moduleNavbar_'+i, {duration: 0.0, startcolor:'#f1f1f1', endcolor:'#f1f1f1', restorecolor: '#f1f1f1'});
}
}
} else {

for (var i=1; i <= divs; i++) {
if(document.getElementById('module_'+i) && document.getElementById('moduleNavbar_'+i)) {

if(countFlipper==0 && i==1) {

new Effect.Fade('module_'+i, { duration: 0.0, to: 0.0, from: 1.0, delay: 8.0, queue: {position:'end', scope: 'flipperscope'} });
new Effect.Highlight('moduleNavbar_'+i, { duration: 0.0, delay: 8.0, startcolor:'#ffffff', endcolor:'#f1f1f1', restorecolor: '#f1f1f1', queue: {position:'end', scope: 'highlightscope'}  });

} else {


new Effect.Appear('module_'+i, { duration: 0.0, to: 1.0, from: 0.0, queue: {position:'end', scope: 'flipperscope'} });
new Effect.Highlight('moduleNavbar_'+i, { duration: 0.0, startcolor:'#f1f1f1', endcolor:'#ffffff', restorecolor: '#ffffff', queue: {position:'end', scope: 'highlightscope'}  });

//new Effect.Fade('module_'+i, { duration: 4.0, to: 0.0, from: 1.0, queue: {position:'end', scope: 'flipperscope'} });
//new Effect.Highlight('moduleNavbar_'+i, { duration: 4.0, startcolor:'#ffffff', endcolor:'#f1f1f1', restorecolor: '#f1f1f1', queue: {position:'end', scope: 'highlightscope'}  });

//added delay here 
new Effect.Fade('module_'+i, { duration: 0.0, to: 0.0, from: 1.0, delay: 8.0, queue: {position:'end', scope: 'flipperscope'} });
new Effect.Highlight('moduleNavbar_'+i, { duration: 0.0, delay: 8.0, startcolor:'#11265D', endcolor:'#f1f1f1', restorecolor: '#f1f1f1', queue: {position:'end', scope: 'highlightscope'}  });




}
}
}
countFlipper++;
document.getElementById('text').innerHTML = countFlipper;
}
}


function stopAutomate(layerId) {

var clearflipper = Effect.Queues.get('flipperscope');
clearflipper.each(function(e) { e.cancel() });
var clearhighlight = Effect.Queues.get('highlightscope');
clearhighlight.each(function(e) { e.cancel()});
var clearglobal = Effect.Queues.get('global');
clearglobal.each(function(e) { e.cancel()});

pe.stop();

var lis = document.getElementsByTagName('li').length;

for (var j=1; j <= lis; j++) {
if(document.getElementById('moduleNavbar_'+j)) {
if(layerId == j){
new Effect.Appear('module_'+j, {duration: 0.0, to: 1.0, from: 0.0});
new Effect.Highlight('moduleNavbar_'+j, {duration: 0.0, startcolor:'#f1f1f1', endcolor:'#ffffff', restorecolor: '#ffffff'});
} else {
new Effect.Fade('module_'+j, {duration: 0.0, to: 0.0, from: 1.0}); 
new Effect.Highlight('moduleNavbar_'+j, {duration: 0.0, startcolor:'#f1f1f1', endcolor:'#f1f1f1', restorecolor: '#f1f1f1'});
}
}
};

}