$(function(){
	$('.pane-feat li').append($('<img/>').attr({'src':'assets/images/img-bullet-1.png'}).addClass('png'));
	
	$('.home-spotter').each(function(){
		var $img = $(this), $p = $img.parent(), $pane = $p.parent();
		var int_w = $img.width(), int_h = $img.height(), $div = $('<div/>').addClass('img-map').css({'width':int_w,'height':int_h});
		$img.remove();
		$p.replaceWith($div.append($img));
		$img.attr('src',$img.attr('longdesc'));
		var coords = [["1a",708,336],["1b",534,126],["1c",774,125],["2a",152,221],["2b",103,330],["2c",6,177],["2d",771,256],["3a",528,380],["3b",689,457],["3c",696,614],["3d",761,566],["3e",314,473],["4a",345,282],["5a",272,334],["6a",427,554],["6b",563,582]];
		var legend = {}, re = /^(\d\w)\. ([\w\W]*)/im;
		$pane.find('h2').each(function(i){
			//if (i < 4) alert($(this).text());
			var $h2 = $(this), str_t = $h2.text().replace(/^\s*/,''), $h3 = $h2.next();
			if ($h3.get(0).tagName.toLowerCase() == 'h3') str_t += '\n' + $h3.text().replace(/^\s*/,'');
			if (re.test(str_t)) {
				var a = re.exec(str_t); a[1] = a[1].toLowerCase()
				legend[a[1]] = a[2];
				$h2.wrapInner($('<a/>').attr({'name':'det_' + a[1]}));
			}
		});
		var fn_hover_over = function($cap) {
			$(this).fadeTo(100,.85,function(){ $cap.css({'display':'block'}); });
		};
		var fn_click = function($cap) {
			var ref = $(this).attr('rel');
			//if (legend[ref])
			//alert(legend[ref]);
			//return false;
		};
		var fn_hover_out = function($cap) {
			$cap.css({'display':'none'});
			$(this).fadeTo(100,.25);
		};
		$.each(coords,function(i,c){
			if (!legend[c[0]]) return true;
			c[0] = c[0].toLowerCase(); c[1] = Math.round(int_w / 1000 * c[1]); c[2] = Math.round(int_w / 1000 * c[2]);
			var $anc = $('<div/>').addClass('anchor').css({'left':c[1] + 'px','top':c[2] + 'px'});
			var $cap = $('<div/>').addClass('caption').attr('id','cap_' + c[0])
				.css({'left':(c[1] + 34) + 'px','top':(c[2] + 13) + 'px'})
				.html(legend[c[0].replace('\n','<br/>')]);
			var $a = $('<a/>').attr({'href':'#det_' + c[0],'rel':c[0]}).click(function(){ fn_click.call(this,$cap); });
			$a.text(c[0].toUpperCase());
			$anc.append($a).hover(function(){ fn_hover_over.call(this,$cap); },function(){ fn_hover_out.call(this,$cap); });
			$div.append($anc).append($cap);
			setTimeout(function(){ $anc.fadeTo(100,.25); },i * 90 + 50);
		});
	});
	
	$('.info-pane').each(function(){
		var $cpane = $(this), $lpane = $('#' + $cpane.attr('rel'));
		
		var fn_showtopic = function(str_top,str_sub){
			$show = $('#' + str_top);
			$show.parent().children().addClass('hidden').attr('style','');
			if (!str_sub) {
				var $a = $(this).parent().find('ul a:first');
				if ($a && $a.length) {
					fn_showsubtop.call($a.get(0),$a.attr('rel'));
					return false;
				}
			}
			$show.fadeIn('fast');
			return false;
		};
		var fn_showsubtop = function(str_sub){
			$show = $('#' + str_sub);
			$show.parent().children().addClass('hidden');
			$show.removeClass('hidden');
			$a = $(this).closest('ul').closest('li').find('a:first');
			fn_showtopic.call($a.get(0),$a.attr('rel'),str_sub)
			return false;
		};
		
		//PARSE TOPICS
		var topics = fn_parseEl($cpane.children(),'h2',fn_showtopic);
		$cpane.append(topics.remain);
		if (topics.items && topics.items.length) {
			$cpane.append($('<div/>').addClass('show-hide').append(topics.items));
			$lpane.append(topics.list.addClass('topics'));
		}
		//PARSE SUBTOPICS
		$lpane.find('li').each(function(){
			var str_rel = '#' + $(this).find('a').attr('rel'), $cpane = $(str_rel), $lpane = $(this);
			var subtop = fn_parseEl($cpane.children(),'h3',fn_showsubtop);
			$cpane.append(subtop.remain);
			if (subtop.items && subtop.items.length) {
				$cpane.append($('<div/>').append(subtop.items));
				$lpane.append(subtop.list.addClass('subtop'));
			}
		});
		var $a = $lpane.find('a:first');
		fn_showtopic.call($a.get(0),$a.attr('rel'));
	});
	
});

function fn_parseEl($items,str_tn,fn_click) {
	var $el, $rem = $('<div/>'), $arr = $('<div/>'), $ul = $('<ul/>');
	var fn_add_topic = function($el) {
		var str_id = 'el_' + Math.random().toString().replace('.','');
		var $a = $('<a/>').attr({'href':'#','rel':str_id}).text($el.attr('title')).click(function(){ return fn_click.call(this,str_id); });
		$ul.append($('<li/>').append($a));
		$arr.append($el.attr('id',str_id));
	}
	$items.each(function(){
		if (this.tagName.toLowerCase() == str_tn.toLowerCase()) {
			if ($el) fn_add_topic($el);
			$el = $('<div/>').attr({'class':'hidden','title':$(this).text()});
		}
		if ($el) $el.append($(this).remove());
		else $rem.append($(this).remove());
	});
	if ($el) fn_add_topic($el);
	return {remain:$rem.children(),items:$arr.children(),list:$ul};
}