var Site = new Class({
	initialize: function(){
	}
});
var ImageSlider = new Class({
	Implements: Options,
	current_pos: null,
	div: null,
	html: null,
	timer: null,
	initialize: function(options){
		this.setOptions(options);
		this.current_pos = 0;
		this.html = {};
		this.setup();
	},
	setup: function()
	{
		// get main element
		if ((this.div = $(this.options.div)) == null) return;
		this.div.setStyles({'width': this.options.width, 'height': this.options.height});
		// check for items
		if (this.options.items.length <= 0) return;
		//make pager
		this.create_pager();
		// make item html
		this.create_html();
		// add first
		this.move();
		// start timer
		this.start();
	},
	start: function()
	{
		var duration = this.options.duration;
		this.timer = this.move.periodical(duration, this);
	},
	move: function()
	{
		if (this.current_pos >= this.options.items.length) this.current_pos = 0;
		var image = new Asset.image(this.options.items[this.current_pos].img, {onload: function(){
			this.html.img.set('src', image.src);
			this.html.a.set('href', this.options.items[this.current_pos].url);
			this.html.span.set('text', this.options.items[this.current_pos].name);
			this.current_pos++;
		}.bind(this)});
	},
	create_pager: function()
	{
		var p = new Element('div', {'id': 'pager'});
		var a = null;
		for (var i = 0; i < this.options.items.length; i++)
		{
			a = new Element('a', {'href': '#is-' + (i + 1), 'html': i + 1});
			this.add_pager_events(a, i);
			p.grab(a);
		}
		this.div.grab(p);
		p.position({'relativeTo': this.div, 'position': 'bottomLeft', 'edge': 'bottomLeft', 'offset': {'x': 0, 'y': -5}});
	},
	add_pager_events: function(a, i)
	{
		a.addEvent('mouseover', function(){
			this.current_pos = i;
			this.move();
			if (this.timer != null)
			{
				$clear(this.timer);
				this.timer = null;
			}
		}.bind(this));
		a.addEvent('mouseout', function(){
			if (this.timer == null) this.start();
		}.bind(this));
	},
	create_html: function()
	{
		this.html.div = new Element('div', {'class': 'is-box'});
		this.html.a = new Element('a');
		this.html.img = new Element('img');
		this.html.span = new Element('span', {'class': 'is-title'});
		this.html.a.grab(this.html.img);
		this.html.a.grab(new Element('span', {'class': 'is-bg'}));
		this.html.a.grab((new Element('span', {'class': 'is-data'})).grab(this.html.span));
		this.html.div.grab(this.html.a);
		this.div.grab(this.html.div);
	}
});
/*var site = null;
window.addEvent('domready', function(){site = new Site();});*/