var clunk = {
	
	runner: ".run",
	
	delay:  1000, //    1 second
	speed1: 1600, // 1600 pixels per second
	speed2:  400, //  400 pixels per second
	
	interval: 7500, // 5 seconds
	sleep:   120000, //  2 minutes
	
	currentBox: 0,
	
	delayTimer: -1,
	autoTimer: -1,
	
	nextbox: function()
	{
		this.change(this.currentBox+1);
		
		var t=this;
		this.autoTimer = timer.start(function(){t.nextbox();}, null, this.interval);
	},
	
	change: function (newBox)
	{
		var a = this.currentBox;
		var b = this.currentBox = (newBox % this.boxes.length);
		
		if (a!=b)
			this.animate(this.boxes[a], this.boxes[b]);
	},
	
	b: function(o)
	{
		this.change(o.box);
		this.delayTimer = -1;
	},
	
	over: function(box)
	{
		this.stopAuto();
		this.out(true);
		var t = this;
		this.delayTimer = timer.start(function(a){t.b(a);}, {box:box}, this.delay);
	},
	
	out: function(x)
	{
		if (this.delayTimer!=-1)
		{
			timer.clear(this.delayTimer);
			this.delayTimer = -1;
		}
		
		if (x==null)
			this.startAuto();
	},
	
	startAuto: function()
	{
		if (this.autoTimer!=-1)
			timer.clear(this.autoTimer);
		
		var t = this;
		this.autoTimer = timer.start(function(){t.nextbox()}, null, this.interval);
	},
	
	stopAuto: function(disableSleep)
	{
		if (this.autoTimer!=-1)
		{
			timer.clear(this.autoTimer);
			this.autoTimer = -1;
		}
		
		if (disableSleep==null)
		{
			var t = this;
			this.autoTimer = timer.start(function(){t.nextbox()}, null, this.sleep);
		}
	},
	
	box: function(b)
	{
		return new function(o,r)
			{
				var w = $(r).width();
				this.e = $(o);
				this.w = this.e.width();
				
				this.el = -this.w;
				this.cl = (w-this.w)/2;
				this.cr = this.cl+this.w;
				this.er = w;
			}(b, this.runner);
	},

	boxes: [
		".box1",
		".box2",
		".box3",
		".box4",
		".box5",
		".box6"
	],

	init: function()
	{
		var r = $(this.runner);
		r.css(
			{
				left: -r.offset().left + "px", 
				width: $("body").width() + "px"
			}
		);
		
		var b = null;
		for (var i=0; i<this.boxes.length; i++)
		{
			var a = this.box(this.boxes[i]);
			a.e.css({left: a.el + "px"});
			
			if (b==null)
				b = a;
		}
		
		b.e.css({left: a.cl + "px"});
		
		this.startAuto();
		
	},

	animate: function(A, B)
	{
		var r = {
			e: $(this.runner)
		};
		
		var a = this.box(A);
		var b = this.box(B);
		
		var d = {
			a: (b.er-a.cr),
			b: (a.w+b.w)/2,
			c: (a.cl-a.el)
		}
		
		var c = {
			a: { p: a.cr, t: 1000/(this.speed1/d.a) },
			b: { p: b.cl, t: 1000/(this.speed2/d.b) },
			c: { p: a.el, t: 1000/(this.speed1/d.c) }
		};
		
		if (a.e.position().left>b.e.position().left)
		{
			d = {
				a: a.cl,
				b: b.cl-a.cl+b.w,
				c: a.er-a.cl
			}
			
			c = {
				a: { p: a.cl-b.w, t: 1000/(this.speed1/d.a) },
				b: { p: b.cl, t: 1000/(this.speed2/d.b) },
				c: { p: a.er, t: 1000/(this.speed1/d.c) }
			};
		}
		
		b.e.animate(
			{
				left: c.a.p + "px"
			},
			c.a.t,
			"linear",
			
			function ()
			{
				b.e.animate(
					{
						left: c.b.p + "px"
					},
					c.b.t,
					"linear"
				);
				a.e.animate(
					{
						left: c.c.p + "px"
					},
					c.c.t,
					"linear"
				);
			}
		);
	}
};
$(document).ready(function(){clunk.init()});