function addRealms(j) {
	var $r = $("#realmlist");

	var sel;
	for (var portal in j) {
		var pdata = j[portal];

		$r.append("<option disabled=\"1\" class=\"portal\">"+portal+" <?=_T('tabrealmname')?>:</option>");
		for (var realmid in pdata) {
			var realm = pdata[realmid];
			if (realmid == "<?=$r?>") sel = " selected=\"1\""; else sel = "";
			$r.append("<option value=\""+realmid+"\""+sel+" class=\"realm\">"+realm+" - "+portal+"</option>");
		}
	}
}

function backClick() {
	var $this = $(this);
	if ($this.is("#resultsSearch"))
		animate('search', true);
	else if ($this.is("#pricesSearch"))
		animate('search', true);
	else if ($this.is("#pricesResults"))
		animate('results', true);
}

function getSelected(name) {
	var selected = $("selectbox[name="+name+"]:selected").val();
	if (selected) return selected;
	return "";
}

function gsc(amount) {
	var $gsc = $('<span></span>').addClass("gsc");

	var g = 0;
	var s = 0;
	var c = 0;
	c = Math.floor(amount%100);
	s = Math.floor((amount%10000)/100);
	g = Math.floor(amount/10000);

	if (amount >= 100 && c < 10) c = "0"+c;
	if (amount >= 10000 && s < 10) s = "0"+s;

	$gsc.append($('<span></span>').addClass("c").text(c));
	if (amount >= 100) {
		$gsc.append($('<span></span>').addClass("s").text(s));
	}
	if (amount >= 10000) {
		$gsc.append($('<span></span>').addClass("g").text(g));
	}
	return $gsc;
}

function itemDetail(j) {
	var $detail = $("#prices .list");
	$detail.empty();

	$detail
		.append($('<li id="itemname"></li>').text(j.name).addClass("qual"+j.qual))	
		.append($('<li id="stats"></li>')
			.append($('<b>Average: </b>')).append(gsc(j.statistics.mean)).append($('<br/>'))
			.append($('<b>Median: </b>')).append(gsc(j.statistics.median)).append($('<br/>'))
			.append($('<b>Mode: </b>')).append(gsc(j.statistics.mode)).append($('<br/>'))
			.append($('<b>IQR Mean: </b>')).append(gsc(j.statistics.interquartilemean)).append($('<br/>'))
		)	
	;
}

function showItem() {
	var $this = $(this);

	var itemid = $this.data("itemid");
	animate("prices", false);
	$("#prices .list")
		.empty()
		.append($('<li>Loading...</li>'))
	;

	$.getJSON("api", { id: itemid, r: getSelected("r"), f: getSelected("f"), t: getSelected("t") }, itemDetail);
	return false;
}

function populateSearch(j) {
	var $list = $("#results .list");
	$list.empty();
	for (var pos in j) {
		var item = j[pos];
		$list.append(
			$('<li></li>').addClass("qual"+item.quality).append(
				$("<a></a>").attr("href","#").text(item.name).click(showItem).data("itemid", item.id)
			)
		);
	}
}

function searchResults() {
	animate("results", false);
	$("#results .list")
		.empty()
		.append($('<li>Searching...</li>'))
	;
	$.getJSON("api", { search: $("input[name=q]").val() }, populateSearch);
}

var animateState, animateHide, shouldRemove;
function animate(state, out) {
	removeanimate();
	if (animateState)
		$("#"+animateState).addClass("viewinst show");

	animateState = state;
	animateHide = out?"in":"out";
	var animateShow = out?"out":"in";
	$("#"+animateState).show().addClass("viewinst " + animateShow);
	setTimeout(beginanimate,0);
}
function beginanimate() {
	$(".view").not("#"+animateState).removeClass("viewinst show").addClass("viewinit "+animateHide);
	$("#"+animateState).removeClass("in out viewinst").addClass("viewinit show");
	shouldRemove = true;
	
}
function removeanimate(e) {
	if (!e) return;

	var $target = $(e.target);
	$target.removeClass("viewinit viewinst show in out");

	if (!$target.is("#"+animateState)) {
		$target.hide();
		shouldRemove = null;
	}
}

function init() {
	$.getJSON("js/realmlist.js", addRealms);
	$(".back").click(backClick);
	$("#container").bind('webkitTransitionEnd', removeanimate);
	animate("search", false);
}

$(function() {
	$(".view").hide();
	$(window).load(init);
});