(function()
 {
     var canvas = document.createElement('canvas');
     var height = 126;
     var width = 126;
     canvas.height = height;
     canvas.width = width;
     
     var ctx = canvas.getContext('2d');

     var frames = [];
     function animate()
     {
         requestAnimationFrame(animate);

         var frame = frames.shift();
         document.body.background = frame;
         frames.push(frame);
     }

     function generateFrames()
     {
         var step = redPosition + ',' + orangePosition + ',' + yellowPosition + ',' + greenPosition + ',' + bluePosition + ',' + indigoPosition + ',' + violetPosition;
         var steps = [];
         
         while(steps.indexOf(step) < 0)
         {
             steps.push(step);
             move();
             step = redPosition + ',' + orangePosition + ',' + yellowPosition + ',' + greenPosition + ',' + bluePosition + ',' + indigoPosition + ',' + violetPosition;
         }

         for(var i = 0; i < steps.length; i++)
         {
             step = steps[i];
             stepParts = step.split(',').map(function(s){return Number(s);});
             draw(stepParts);
             var frame = canvas.toDataURL();
             frames.push(frame);
         }
     }

     var mainRadius = 4;
     
     var redPosition = Math.floor(Math.random() * (width - 18)) + 9;
     var orangePosition = Math.floor(Math.random() * (width - 18)) + 9;
     var yellowPosition = Math.floor(Math.random() * (width - 18)) + 9;
     var greenPosition = Math.floor(Math.random() * (width - 18)) + 9;
     var bluePosition = Math.floor(Math.random() * (width - 18)) + 9;
     var indigoPosition = Math.floor(Math.random() * (width - 18)) + 9;
     var violetPosition = Math.floor(Math.random() * (width - 18)) + 9;

     var redSpeed = Math.floor(Math.random() * 7) + 1;
     var orangeSpeed = Math.floor(Math.random() * 7) + 1;
     var yellowSpeed = Math.floor(Math.random() * 7) + 1;
     var greenSpeed = Math.floor(Math.random() * 7) + 1;
     var blueSpeed = Math.floor(Math.random() * 7) + 1;
     var indigoSpeed = Math.floor(Math.random() * 7) + 1;
     var violetSpeed = Math.floor(Math.random() * 7) + 1;

     function move()
     {
         redPosition += redSpeed;
         orangePosition += orangeSpeed;
         yellowPosition += yellowSpeed;
         greenPosition += greenSpeed;
         bluePosition += blueSpeed;
         indigoPosition += indigoSpeed;
         violetPosition += violetSpeed;

         if(redPosition >= width + mainRadius)
         {
             redPosition -= width;
         }
         if(orangePosition >= width + mainRadius)
         {
             orangePosition -= width;
         }
         if(yellowPosition >= width + mainRadius)
         {
             yellowPosition -= width;
         }
         if(greenPosition >= width + mainRadius)
         {
             greenPosition -= width;
         }
         if(bluePosition >= width + mainRadius)
         {
             bluePosition -= width;
         }
         if(indigoPosition >= width + mainRadius)
         {
             indigoPosition -= width;
         }
         if(violetPosition >= width + mainRadius)
         {
             violetPosition -= width;
         }
     }
     
     function draw(xs)
     {
         var ys = [9, 27, 45, 63, 81, 99, 117];
         
         ctx.fillStyle = '#000000';
         ctx.fillRect(0, 0, width, height);

         var colours =
             [
                 'rgba(255, 0, 0, ', //red
                 'rgba(255, 128, 0, ', //orange
                 'rgba(255, 255, 0, ', //yellow
                 'rgba(0, 255, 0, ', //green
                 'rgba(0, 0, 255, ', //blue
                 'rgba(75, 0, 130, ', //indigo
                 'rgba(159, 0, 255, ' //violet
             ];
         
         for(var c = 0; c < colours.length; c++)
         {
             drawCircle(xs[c], ys[c], mainRadius, colours[c] + '1)');

             if(xs[c] + mainRadius >= width)
             {
                 drawCircle(xs[c] - width, ys[c], mainRadius, colours[c] + '1)');
             }
         }
         
         for(var i = 0; i < 7; i++)
         {
             var alpha = 1 - ((i + 1)*11)/100;
             var radius = 7 - i;
             for(var c = 0; c < colours.length; c++)
             {
                 var colour = colours[c] + alpha + ')';
                 var x = xs[c] - (i*7);
                 drawCircle(x, ys[c], radius, colour);
                 if((x - radius) < width)
                 {
                     drawCircle(width + x, ys[c], radius, colour);
                 }

                 if((x + radius) >= width)
                 {
                     drawCircle(x - width, ys[c], radius, colour);
                 }
             }
         }
     }

     function drawCircle(x, y, radius, colour)
     {
         ctx.fillStyle = colour;
         ctx.beginPath();
         ctx.arc(x, y, radius, 0, Math.PI*2, true);
         ctx.fill();
     }

     generateFrames();
     animate();
 })();