var $alpha = true, $first = true,
allClients = new Array,
sectorHeadings = new Array,
sectorTotals = new Array;

function charSort(a,b) {
	return ((a.li.text() < b.li.text()) ? -1 : ((a.li.text() > b.li.text()) ? 1 : 0));
}

function resetPositions(event) {
	if ($alpha) {
		var $li = $(this).parents('li:first');
		$li.siblings().removeClass('active');
		$li.addClass('active');
		
		var headingHieght = 60;
		var lineHeight = 20;
		var ln = headingHieght;
		var rn = headingHieght;
		var sectorStartPos = new Array;
		
		var $cols = $('div.column').slice(0, 2);
		
		if ($first == false) {
			$cols.each(function(){
				var $col = $(this);
				$col.find('h2:first').slideUp('slow', function(){
					$col.find('h2:first').remove();
				});
			});
			
		} else 
			$first = false;
		
		t = 0;
		l = 0;
		for (i = 0; i < sectorHeadings.length; i++) {
			if (i == Math.ceil(sectorHeadings.length/2)) {
				l = 316;
				t = 0;
			}
			sectorStartPos[i] = t + headingHieght - lineHeight;
			//console.log(sectorHeadings[i].text());
			sectorHeadings[i].slideDown('slow');
			sectorHeadings[i].css({
				top: t,
				left: l
			})
			t += (sectorTotals[i] * lineHeight + headingHieght);
		//sectorStartPos[i] = t;
		}
		
		for (i = 0; i < allClients.length; i++) {
			sectorStartPos[allClients[i].sector] += lineHeight;
			t = sectorStartPos[allClients[i].sector];
			
			if (allClients[i].sector < Math.ceil(sectorHeadings.length/2)) 
				l = 0;
			else 
				l = 316;
			
			allClients[i].li.animate({
				top: t,
				left: l
			}, 'slow');
			ln += lineHeight;
		}
		$alpha=false;
	}
}

function alphabetical(event) {
	if (!$alpha) {
		var $li = $(this).parents('li:first');
		$li.siblings().removeClass('active');
		$li.addClass('active');
		
		var $cols = $('div.column').slice(0, 2);
		$cols.find('h2').slideUp('slow');
		$('<h2>A-M</h2><ul></ul>').prependTo($cols.slice(0, 1)).hide().slideDown('slow');
		$('<h2>N-Z</h2><ul></ul>').prependTo($cols.slice(1, 2)).hide().slideDown('slow');
		
		ln = 60;
		rn = 60;
		
		for (i = 0; i < allClients.length; i++) {
			var l = 0;
			if (allClients[i].letter == 'A') {
				allClients[i].li.animate({
					top: ln,
					left: l
				}, 'slow');
				ln += 20;
			}
			else {
				allClients[i].li.animate({
					top: rn,
					left: 316
				}, 'slow');
				rn += 20;
			}
			
		//console.log(allClients[i].li.letter);
		}
		$alpha = true;
	}
}

client = function () {
	this.li = null;
	this.sector = '';
	this.letter = '';
	this.text = '';
}

$(document).ready(function() {
				
	var $menu = $('.page36 .menu');
	$menu.html('<ul><li class="active"><a href="#">View by sector</a></li><li class="last"><a href="#">View alphabetically</a></li></ul>');
	var $sub = $('.page36 .menu li a');
	$sub.slice(0,1).bind('click',resetPositions);
	$sub.slice(1,2).bind('click',alphabetical);
	/**
	columns = $('.columns');
	columns.hide();
	
	columns.oneTime(500, function () {
		$(this).fadeIn('slow');
		checkContentHeight();
	});
	**/
	var $cols = $('div.column').slice(0,2);
	
	sectorCount = 0; 
	$cols.find('ul').each(function() {
		sectorTotals[sectorCount] = 0;
		$(this).find('li').each(function() {
			cl = new client();
			cl.li = $(this);
			cl.sector = sectorCount;
			cl.text = cl.li.text().replace(/^\s+|\s+$/g,"");
			if (cl.text < 'N') {
				cl.letter = 'A'
			} else {
				cl.letter = 'N'
			};
			allClients.push(cl);
			sectorTotals[sectorCount]++;
		});
		sectorCount++;
	})
	allClients.sort(charSort);
	$cols.find('li').css({	position:'absolute',
							top:0,
							left:0
	})
	$cols.find('h2').css({	position:'absolute',
							top:0,
							left:0
	})
	$cols.find('h2').each(function() {
		sectorHeadings.push($(this));
	})
	resetPositions();
});