﻿var hiddenLink = null;
var speed = 200;
var rbrowse = false;
$(function(){
	$("table.rsltsmry").attr("page",1).attr("count",10);
	$("table.rsltsmry").find("a.TextBtn").each(function(){
		var parts = $(this).attr("href").split("?sm=");
		if(parts.length > 1){
			$(this).attr("data",parts[1]);
			$(this).attr("href", "#");
		}
		$(this).attr("page",1);
	});
});
function ViewResponses(link,max,browse){
	if(browse)rbrowse=true;
	$(link).attr("max",max);
	var tr = $(link).parents("tr");
	tr.find("a.TextBtn").each(function(){
		var img = $(this).children("img");
		$(this).unbind("click").bind("click",function(){ViewResponses(this,$(this).attr("max"));return false;});
		$(this).empty().append(img).append("view");
	});
	if(tr.next().find("div.openSummary").length > 0){
		tr.next().remove();
	}
	tr.after("<tr><td colspan=\""+tr.parents("table").find("thead tr th").attr("colspan")+"\" style=\"padding:0px;\"><div class=\"openSummary\"></div></td></tr>");
	tr.next().find("td").css("background-color",$(link).parents("td").css("background-color"));
	tr.next().find("div.openSummary")[0].btn = $(link);
	tr.next().find("div.openSummary").animate({height:100},speed,function(){
		var count = parseInt($(link).parents("table.rsltsmry").attr("count"),10);
		var page = parseInt($(link).attr("page"),10);
		var img = $(link).children("img");
		$(link).empty().append(img).append("hide");
		$(link)[0].onclick=null;
		$(link).unbind("click").bind("click",function(){HideResponses(this);return false;});
		updateView(tr.next().find("div.openSummary"),page,count);
	});
}
function HideResponses(link){
	var tr = $(link).parents("tr").next();
	tr.find("div.openSummary").slideUp(speed,function(){
		tr.remove();
		var img = $(link).children("img");
		$(link).unbind("click").bind("click",function(){ViewResponses(link,$(link).attr("max"));return false;});
		$(link).empty().append(img).append("view");
	});
}
function toggleCount(ddl){
	ddl.disabled = true;
	$(ddl).parent().prepend("<img src=\"/img/indicator2.gif\" alt=\"loading...\" />");
	var q = $(ddl).parents("table.rsltsmry");
	q.attr("count", parseInt(ddl.options[ddl.selectedIndex].value));
	var div = $(ddl).parents("div.openSummary");
	var link = div[0].btn;
	link.attr("page",1);
	updateView(div,1,parseInt(q.attr("count"),10));
}
function updateView(container,page,count){
	var table = container.parents("table.rsltsmry").attr("count",count);
	var link = container[0].btn.attr("page",page);
	var max = parseInt(link.attr("max"),10);
	var h=0;
	if(container.find("table").length > 0){
		h=container.height();
		container.css("height",h);
	}
	container.find("table").fadeOut(speed);
	container.empty().append("<img src=\"/img/indicator2.gif\" alt=\"loading...\" />").addClass("loading");
	async("MySurvey_Responses.aspx","GetOpenEndedResponses","{'id':'"+link.attr("data")+"','count':"+count+",'page':"+page+",'browse':"+rbrowse+"}",function(d){
		container.children("img").fadeOut(speed);
		container.removeClass("loading").empty().html(getHTML(link,d,count,page,max));		
		initSlider(container.find(".slider"),page,count,max);
		container.find("table").fadeIn(speed,function(){container.css("height","auto");});
		container.animate({height:container.find("table").height()},speed,function(){
			if(h > 0){
				var ws = $(window).scrollTop();
				$("html,body").animate({scrollTop:ws + (container.height()-h)},speed);
			}
		});
	});
}
function initSlider(div,page,count,max){
	if(count < max){
		div.slider({
			range:"min",
			value:page,
			min:1,
			max:Math.ceil(max / count),
			step:1,
			startValue:page,
			slide:function(e,ui){
				if(ui.value<1){
					$(this).slider("value",1);
					ui.value=1;
				}else if(ui.value>$(this).data("max.slider")){
					$(this).slider("value",$(this).data("max.slider"));
					ui.value=$(this).data("max.slider");
				}
				$(this).find(".ui-slider-handle").html(Math.round(ui.value));
			},
			stop:function(e,ui){
				var val = Math.round(ui.value);
				$(this).find(".ui-slider-handle").html(val);
				if(val != page) updateView($(this).parents("div.openSummary"),val,count);
			}
		});
		div.find(".ui-slider-handle").html(Math.round(div.slider("value")));
		div.parent().find(".prev").click(function(){
			var val = Math.round(div.slider("value"));
			if(val > 1){
				div.slider("value",val-1);
				updateView(div.parents("div.openSummary"),(val-1),count);
			}
			return false;
		});
		div.parent().find(".next").click(function(){
			var val = Math.round(div.slider("value"));
			if(val < div.data("max.slider")){
				div.slider("value",val+1);
				updateView(div.parents("div.openSummary"),(val+1),count);
			}
			return false;
		});
	}
}
function getHTML(link,msg,count,page,max){
	var html = "<table cellspacing=\"0\" cellpadding=\"0\">";
	html += "<thead><th colspan=\"2\">&nbsp;</th><th>Text</th><th>Response Date</th></thead>";
	if(max > 10 || count < max){
		html += "<tfoot><td colspan=\"4\">";
		if(max > 10){
			html += "<div style=\"float:right;\">";
			html += "<select onchange=\"toggleCount(this);\">";
			html += "<option value=\"10\"" + ((count == 10) ? " selected=\"selected\"" : "") + ">10 responses per page</option>";
			html += "<option value=\"25\"" + ((count == 25) ? " selected=\"selected\"" : "") + ">25 responses per page</option>";
			if(max >= 25) html += "<option value=\"50\"" + ((count == 50) ? " selected=\"selected\"" : "") + ">50 responses per page</option>";
			if(max >= 50) html += "<option value=\"100\"" + ((count == 100) ? " selected=\"selected\"" : "") + ">100 responses per page</option>";
			if(max >= 100) html += "<option value=\"250\"" + ((count == 250) ? " selected=\"selected\"" : "") + ">250 responses per page</option>";
			html += "</select>";
			html += "</div>";
		}
		if(count < max){
			var start = 0;
			var checker = 1;
			do{
				start = ((page - checker) * count) + 1;
				checker++;
			}while(start > max);
			var end = start + count - 1;
			if(max < end) end = max;
			html += "<div style=\"float:left;\">";
			html += "<a href=\"#\" class=\"prev\"><</a>";
			html += "<div class=\"slider\"></div>";
			html += "<a href=\"#\" class=\"next\">></a>";
			html += "</div>";
		}
		html += "</td></tfoot>";
	}
	html += "<tbody>";
	html += msg.d;
	html += "</tbody>";
	html += "</table>";
	return html;
}
