var Sorter = Class.create();

Sorter.prototype =
{
	labels: [
		[
			'Click to sort by property name',
			'Click to sort A-Z by property name',
			'Click to sort Z-A by property name'		
		],
		[
			'Click to sort number of bedrooms',
			'Click to sort by properties that have the lowest number of bedrooms',
			'Click to sort by properties that have the most number of bedrooms'
		],
		[
			'Click to sort by whether or not the property has a pool',
			'Click to sort by properties that have no pool',
			'Click to sort by properties that have a pool'
		],
		[
			'Click to sort by the number people the property accommodates',
			'Click to sort by properties that accommodate the least number of people',
			'Click to sort by properties that accommodate the most number of people'		
		],
		[
			'Click to sort by property price',
			'Click to sort by the lowest priced properties',
			'Click to sort by the highest priced properties'
		]	
	],	
	initialize: function (div)
	{
		div.style.display = 'block';
		this.div = div;
		this.parent = div.parentNode;
		
		// preload accommodations	
		
		this.accommodations = new Array();
		
		var divs = div.parentNode.getElementsByTagName('div');
		for (i = 0; i < divs.length; i ++)
		{
			if (divs[i].className == 'listing accommodation-view' || divs[i].className == 'listing clearfix location-view')
			{
				var div = divs[i];
				var name = divs[i].getElementsByTagName('h3')[0].getElementsByTagName('a')[0].innerHTML;
				var pool = divs[i].getElementsByTagName('table')[0].getElementsByTagName('td')[1].getElementsByTagName('span')[0].innerHTML;
				var bedrooms = divs[i].getElementsByTagName('table')[0].getElementsByTagName('td')[0].getElementsByTagName('span')[0].innerHTML;
				var accommodation = divs[i].getElementsByTagName('table')[0].getElementsByTagName('td')[2].getElementsByTagName('span')[0].innerHTML.replace('Sleeps ', '').replace(' adults', '');	
				if (divs[i].getElementsByTagName('table')[0].getElementsByTagName('td')[3].innerHTML.indexOf('There are no prices') != -1)
				{
					var price = '0';
				}
				else
				{
					var price = divs[i].getElementsByTagName('table')[0].getElementsByTagName('td')[3].getElementsByTagName('span')[6].innerHTML;				
				}
				this.accommodations[this.accommodations.length] = 
					new Array(
						div, 
						new Array(
							name.replace(/^\s+/, '').replace(/\s+$/, ''),
							parseInt(bedrooms.replace(/^\s+/, '').replace(/\s+$/, '')),
							pool.replace(/^\s+/, '').replace(/\s+$/, ''),
							parseInt(accommodation.replace(/^\s+/, '').replace(/\s+$/, '')),
							parseInt(price.replace(/^\s+/, '').replace(/\s+$/, ''))
						)
					);
			}
		}
		
		// set the handlers		
		
		var tds = this.div.getElementsByTagName('table')[0].getElementsByTagName('td');
		this.tds = new Array();		
		for (i = 0; i < tds.length; i ++)
		{
			var td = tds[i];
			this.tds[this.tds.length] = td;
			var h4 = td.getElementsByTagName('h4')[0];
			if (td.className == 'active')
			{
				this.index = i;				
				this.direction = h4.className == 'active-down' ? 1 : 0;
				this.doSort(this.index, this.direction);				
			}			
			Event.observe(td, 'click', this.handleClick.bind(this));
			Event.observe(h4, 'mouseover', this.h4Mouseover.bind(this));
			Event.observe(h4, 'mouseout', this.h4Mouseout.bind(this));
		}
	},
	handleClick: function (event)
	{
		var el = Event.element(event);
		while (el.tagName != 'TD')
		{
			el = el.parentNode;
		}
		var tds = this.div.getElementsByTagName('table')[0].getElementsByTagName('td');
		for (i = 0; i < tds.length; i ++)
		{
			if (tds[i] == el)
			{
				tds[i].className = 'active';
				this.index = i;
				var h4 = tds[i].getElementsByTagName('h4')[0];
				this.direction = h4.className == 'active-down' || h4.className == '' ? 0 : 1;
				h4.className = h4.className == 'active-down' || h4.className == '' ? 'active-up' : 'active-down';
				h4.title = h4.className == 'active-up' || h4.className == '' ? this.labels[i][2] : this.labels[i][1];
				this.doSort(this.index, this.direction);
				var today = new Date();
				var expire = new Date();
				expire.setTime(today.getTime() + 365 * 24 * 60 * 60);
				document.cookie = 'SORT='+this.index+'_'+this.direction+'; expires='+expire.toGMTString();
			}
			else
			{
				tds[i].className = '';
				var h4 = tds[i].getElementsByTagName('h4')[0];
				h4.className = '';
				h4.title = this.labels[i][0];
			}
		}
	},
	doSort: function (index, direction)
	{		
		for (var i = 0; i < this.accommodations.length; i ++)
		{
			for (var j = i; j < this.accommodations.length; j ++)
			{
				if (
					(direction == 0 && this.accommodations[i][1][index] >= this.accommodations[j][1][index]) ||
					(direction == 1 && this.accommodations[i][1][index] < this.accommodations[j][1][index])
				)
				{
					var ar = this.accommodations[i];
					this.accommodations[i] = this.accommodations[j];
					this.accommodations[j] = ar;
					
				}
			}
		}
		for (var j = this.accommodations.length - 2; j >= 0; j --)
		{			
			var div1 = this.accommodations[j][0];
			var div2 = this.accommodations[j + 1][0];							
			this.parent.insertBefore(div1, div2);
		}
	},
	h4Mouseover: function (event)
	{
		var h4 = Event.element(event);
		h4.style.color = '#55433b';
	},
	h4Mouseout: function (event)
	{
		var h4 = Event.element(event);
		h4.style.color = '#937b75';
	}
}

Event.observe(
	window,
	'load',
	function ()
	{
		if ($('f-sort-div'))
		{
			new Sorter($('f-sort-div'));
		}
	}
);