
var Jp_Slider = new Class({
	Implements: [Options, Events],
	container: null,
	innerContainer: null,
	triggers: [],
	targets: [],
	slideFx: null,
	currentTarget: null,
	initialState: true, //set to true until the state (the target) changes (any call to goTo())
	options: {
		duration: 150,
		property: 'top',
		link: 'cancel',
		transition: Fx.Transitions.Expo.easeOut,
		goToFirstOnEmpty: true //If there's no hash in the url, or if the target is empty, go to the first target
		/*
		onTargetChange: $empty
		onEmptyTarget: $empty
		*/
	},
	initialize: function(triggers, container, options) {
		this.setOptions(options);
		this.triggers = triggers;
		this.container = $(container);
		
		if (!this.container || !this.triggers || !this.triggers.length) return;
		
		this.prepare();
	},
	prepare: function() {
		this.container.addClass('jp-slider');
		
		if (!this.innerContainer) {
			this.innerContainer = new Element('div', {'class': 'jp-slider-inner-container'});
			this.container.getChildren().each(function(e) {
				e.injectInside(this.innerContainer);
			}, this);
			this.innerContainer.injectInside(this.container);
			
			this.slideFx = new Fx.Tween(this.innerContainer, {
				duration: this.options.duration,
				property: this.options.property,
				link: this.options.link,
				transition: this.options.transition
			});
		}
		
		this.triggers.each(function(e) {
			var href = e.get('href');
			if (href.indexOf('#') == 0 && href.length > 1) {
				var targetId = href.replace(/^#/, '');
				var target = $(targetId);
				
				if (target) {
					e.addEvent('click', function(evt, targetId) {
//						evt.stop();
						this.goTo(targetId);
					}.bindWithEvent(this, [targetId]));
					
					target.set('id', 'jp-slider-' + target.get('id'));
					this.targets.push(target);
				}
			}
		}, this);
		
		this.checkLocation(true);
		this.checkLocation.periodical(250, this);
	},
	goTo: function(target, noAnimation) {
		if (typeof target == 'string' && target.indexOf('jp-slider-') != 0) {
			target = 'jp-slider-' + target;
		}
		target = $(target);
		if (target) {
			this.fireEvent('targetChange', this);
			this.currentTarget = target.get('id');
			var top = 0;
			for (var targetIndex = 0; targetIndex < this.targets.length; targetIndex++) {
				if (this.targets[targetIndex] == target) {
					break;
				}
				top -= parseInt(this.targets[targetIndex].getSize().y);
				top -= parseInt(this.targets[targetIndex].getStyle('margin-bottom'));
			}
			if (!noAnimation && !this.initialState) {
				this.slideFx.start(top + 'px');
			}
			else {
				this.slideFx.set(top + 'px');
			}
			this.initialState = false;
		}
	},
	checkLocation: function(noAnimation) {
		var location = window.location.toString();
		if (location.indexOf('#') >= 0) {
			var target = location.replace(/[^#]+#/, '');
			if (target && 'jp-slider-' + target != this.currentTarget) {
				this.goTo(target, noAnimation);
			}
		}
		else {
			var gotTarget = false;
			if (this.currentTarget && (this.currentTarget != this.targets[0].get('id') || !this.options.goToFirstOnEmpty)) {
				this.fireEvent('emptyTarget', this);
				if (this.options.goToFirstOnEmpty) {
					this.goTo(this.targets[0], noAnimation);
					gotTarget = true;
				}
			}
			if (!gotTarget) {
				this.currentTarget = null;
			}
		}
	}
});
