/* Edited to work with horizontal lists */

/*
Script: Sortables.js
	Contains <Sortables> Class.

License:
	MIT-style license.
*/

/*
Class: Sortables
	Creates an interface for <Drag.Base> and drop, resorting of a list.
	
Note:
	The Sortables require an XHTML doctype.

Arguments:
	list - required, the list that will become sortable.
	options - an Object, see options below.

Options:
	handles - a collection of elements to be used for drag handles. defaults to the elements.
	onStart - function executed when the item starts dragging
	onComplete - function executed when the item ends dragging
*/

var H_Sortables = new Class({

	options: {
		active: false,
		handles: false,
		onStart: Class.empty,
		onComplete: Class.empty,
		ghost: true,
		snap: 3,
		onDragStart: function(element, ghost){
			ghost.setStyle('opacity', 0.7);
			element.setStyle('opacity', 0.7);
		},
		onDragComplete: function(element, ghost){
			element.setStyle('opacity', 1);
			ghost.remove();
			this.trash.remove();
		}
	},

	initialize: function(list, options){
		this.setOptions(options);
		this.list = $(list);
		this.elements = this.list.getChildren();
		this.handles = (this.options.handles) ? $$(this.options.handles) : this.elements;
		this.bound = {
			'start': [],
			'moveGhost': this.moveGhost.bindWithEvent(this)
		};
		for (var i = 0, l = this.handles.length; i < l; i++){
			this.bound.start[i] = this.start.bindWithEvent(this, this.elements[i]);
		}
		this.attach();
		if (this.options.initialize) this.options.initialize.call(this);
		this.bound.move = this.move.bindWithEvent(this);
		this.bound.end = this.end.bind(this);
		this.active = this.options.active;
	},
	
	attach: function(){
		this.handles.each(function(handle, i){
			handle.addEvent('mousedown', this.bound.start[i]);
		}, this);
	},

	detach: function(){
		this.handles.each(function(handle, i){
			handle.removeEvent('mousedown', this.bound.start[i]);
		}, this);
	},

	start: function(event, el){
		// Only works if sortable is active
		if (this.active)
		{
			this.active = el;
			this.coordinates = this.list.getCoordinates();
			if (this.options.ghost){
				var position = el.getPosition();
				this.offset = event.page.x - position.x;
				this.trash = new Element('div').inject(document.body);
				var backString = el.style.backgroundImage;
				var background = "url(https://sanford.xostech.com/"+backString.substring(4, backString.length-1)+")";
				this.ghost = new Element('div', {
						'class' : 'shortcut ghost'
						}).inject(this.trash).setStyles({
							'position': 'absolute',
							'top': position.y + 1,
							'left': event.page.x - this.offset,
							'background-image' : background
				});
				/*
				this.ghost = el.clone().inject(this.trash).setStyles({
					'position': 'absolute',
					'top': position.y,
					'left': event.page.x - this.offset
				});
				*/
				document.addListener('mousemove', this.bound.moveGhost);
				this.fireEvent('onDragStart', [el, this.ghost]);
			}
			document.addListener('mousemove', this.bound.move);
			document.addListener('mouseup', this.bound.end);
			this.fireEvent('onStart', el);
			event.stop();
		}
	},
	
	moveGhost: function(event){
		var value = event.page.x - this.offset;
		value = value.limit(this.coordinates.left, this.coordinates.right - this.ghost.offsetWidth);
		this.ghost.setStyle('left', value);
		event.stop();
	},

	move: function(event){
		this.active.active = true;
		this.previous = this.previous || event.page.x;
		this.now = event.page.x;
		var direction = ((this.previous - this.now) <= 0) ? 'right' : 'left';
		var prev = this.active.getPrevious();
		var next = this.active.getNext();
		if (prev && direction == 'left'){
			var prevPos = prev.getCoordinates();
			if (event.page.x < prevPos.right) this.active.injectBefore(prev);
		}
		if (next && direction == 'right'){
			var nextPos = next.getCoordinates();
			if (event.page.x > nextPos.left) this.active.injectAfter(next);
		}
		this.previous = event.page.x;
	},

	serialize: function(){
		var serial = [];
		this.list.getChildren().each(function(el, i){
			serial[i] = this.elements.indexOf(el);
		}, this);
		return serial;
	},

	end: function(){
		this.previous = null;
		document.removeListener('mousemove', this.bound.move);
		document.removeListener('mouseup', this.bound.end);
		if (this.options.ghost){
			document.removeListener('mousemove', this.bound.moveGhost);
			this.fireEvent('onDragComplete', [this.active, this.ghost]);
		}
		this.fireEvent('onComplete', this.active);
	}

});

H_Sortables.implement(new Events, new Options);