/*
 * picsearchImage.js
 *
 * Author: Jon Eriksmo
 * Email: jon@itano-systems.com
 * Date: 2009-11-09
 *
 */

function searchResultView(browserWidth) {
	// Some static values
	this.adWidth         = 165;		// The ad box
	this.filterWidth     = 154;		// The filter column
	this.adMargin        = 0;		// The margin to the left of the ad box
	this.imageWidth      = 158;		// The width of an image result including margin
	this.containerMargin = 0;		// The left/right margin of the container
	this.maxColumns      = 10;		// Max columns we will display (must be a value of 4-10)
	
	// These are temporary values that will be set in the calculateView() function
	this.browserWidth    = 0;
	this.containerWidth  = 0;
	this.resultWidth     = 0;
	this.imageColumns    = 0;
	this.resultPadding   = 0;

	var resultsPerPage = 30;

	this.getBrowserWidth = function() {
		if (!(document.documentElement.clientWidth == 0)) {
			return document.documentElement.clientWidth;
		}
		else {
			return document.body.clientWidth;
		}
	}	

	this.getNumberColumns = function(available) {
		for (var i = this.maxColumns; i >= 3; i--) {
			resultSize = (i * this.imageWidth);
			if (resultSize <= available || i == 3) {
				return i;
				break;
			}
		}
	}

	this.calculateView = function() {
		// First calculate the container width
		this.browserWidth   = this.getBrowserWidth();
		this.containerWidth = this.browserWidth;
		
		// We will never go below a container width of 700px
		this.containerWidth = Math.max(this.containerWidth, 700);
		
		// Then calculate the rest
		this.resultWidth   = this.containerWidth - this.adWidth - this.adMargin - this.filterWidth;
		this.imageColumns  = this.getNumberColumns(this.resultWidth);
		this.resultPadding = Math.floor((this.resultWidth - (this.imageColumns * this.imageWidth)) / this.imageColumns / 2 - 1 );
		if (this.resultPadding < 1) {
			this.resultPadding = 0;
		}
	}
	
	this.updateView = function() {
		// The result area
		$("#results_table div.clsFloat").css("padding-left", this.resultPadding + "px");
		$("#results_table div.clsFloat").css("padding-right", this.resultPadding + "px");
		
		// First display all the hideable results
		$("#result25").css("display", "block");
		$("#result26").css("display", "block");
		$("#result27").css("display", "block");
		$("#result28").css("display", "block");
		$("#result29").css("display", "block");
		$("#result30").css("display", "block");
		
		// If we are displaying (4 or 7), 8, 9 columns we must hide results
		if (this.imageColumns == 4 || this.imageColumns == 7) {
			resultsPerPage = 28;
			$("#result29").css("display", "none");
			$("#result30").css("display", "none");
		}
		if (this.imageColumns == 8) {
			resultsPerPage = 24;
			$("#result25").css("display", "none");
			$("#result26").css("display", "none");
			$("#result27").css("display", "none");
			$("#result28").css("display", "none");
			$("#result29").css("display", "none");
			$("#result30").css("display", "none");
		}
		if (this.imageColumns == 9) {
			resultsPerPage = 27;
			$("#result28").css("display", "none");
			$("#result29").css("display", "none");
			$("#result30").css("display", "none");
		}

		// Update the result page links
		var firstResult = parseInt($("span#displayFirst").html())
		var browserWidth = this.getBrowserWidth();
		
		var expr1 = new RegExp(/start=[0-9]+/);
		var expr2 = new RegExp(/width=[0-9]*/);
		if (document.getElementById('pnext')) {
			var newHref = $("#pnext").attr("href").replace(expr1, "start=" + (firstResult + resultsPerPage));
			$("#pnext").attr("href", newHref);
			var newHref = $("#pnext").attr("href").replace(expr2, "width=" + browserWidth);
			$("#pnext").attr("href", newHref);
		}
		if (document.getElementById('pprev')) {
			var newHref = $("#pprev").attr("href").replace(expr1, "start=" + Math.max(1, (firstResult - resultsPerPage)));
			$("#pprev").attr("href", newHref);
			var newHref = $("#pprev").attr("href").replace(expr2, "width=" + browserWidth);
			$("#pprev").attr("href", newHref);
		}
		$("a[name=plink]").each(function(idx, item) {
			var expr1    = new RegExp(/start=[0-9]+/);
			var expr2    = new RegExp(/width=[0-9]+/);
			var page    = $(this).attr("title") * 1;
			var start   = ((page - 1) * resultsPerPage) + 1;
			var newHref = $(this).attr("href").replace(expr1, "start=" + start);
			$(this).attr("href", newHref);
			var newHref = $(this).attr("href").replace(expr2, "width=" + browserWidth);
			$(this).attr("href", newHref);
		});
		last = Math.min(parseInt($("div#hits").html()), parseInt($("span#displayFirst").html()) + parseInt(resultsPerPage) - 1)
		$("span#displayLast").html(last);
		
		// Finally update all width references
		this.updateWidthReferences();

	}

	this.updateWidthReferences = function() {
		var browserWidth = this.getBrowserWidth();

		// First update all input values with the name "width"
		$("input[name=width]").each(function(idx, item) {
			$(this).attr("value", browserWidth);
		});
		
		// Target the links within clsContainer passing on "width" as a parameter
		$('div.clsContainer').children().each(function(idx, item) {
			var expr = new RegExp(/width=[0-9]*/);
			var newHref = $(this).attr("href").replace(expr, "width=" + browserWidth);
			$(this).attr("href", newHref);
		});

		// Target the links within related searches passing on "width" as a parameter
		$('#relatedSearches').children().each(function(idx, item) {
			var expr = new RegExp(/width=[0-9]*/);
			var newHref = $(this).attr("href").replace(expr, "width=" + browserWidth);
			$(this).attr("href", newHref);
		});
		
	}
	
	this.alertValues = function() {
		alert(  "adWidth: " + this.adWidth + 
				"\nfilterWidth: " + this.filterWidth + 
				"\nadMargin: " + this.adMargin + 
				"\nbrowserWidth: " + this.browserWidth +
				"\ncontainerWidth: " + this.containerWidth +
				"\ncontainerMargin: " + this.containerMargin + 
				"\nimageColumns: " + this.imageColumns +
				"\nresultWidth: " + this.resultWidth + 
				"\nresultPadding: " + this.resultPadding +
				"\nimageWidth: " + this.imageWidth);
	}
}

srw = new searchResultView();
srw.calculateView();
srw.updateView();
// srw.alertValues();

// And if the user resizes the window, do it also
$(window).bind('resize', function() {
	srw = new searchResultView();
	srw.calculateView();
	srw.updateView();
});