Behaviors.register("ImageGrid", "#img-grid", {
	init: function() {
		this.pagination = new Behaviors.Pagination(".pagination", {
			target: this
		});
		this.filters = new Behaviors.ImageGridFilters(".image-grid-filters");
		this.$hdr = $("#grid-header");
	}
	,initEvents: function() {
		this.pagination.addEvent("pagechange", this.load.bind(this));
		this.filters.addEvent("update", this.load.bind(this));
		this.filters.addEvent("firstPage", this.firstPage.bind(this));
		this.initResults();
	}
	,initResults:function(){
		var $items = this.find("li:has(span)")
			.hoverClass("hover");
		// loop through and only attach tooltips if they have descriptions on them
		$items.each(function(){
			var $el = $(this);
			if (!$el.children("a:first").attr("title").contains("No description available."))
				$el.behavior("Tooltip", {})
			else
				$el.children("a:first").attr("title", "");	
			// if ie then attach click event to img since it doesnt bubble up to anchor el properly
			if ($.browser.msie)
				$el.find("img").click(function(){
					window.location.href = $el.children("a:first").attr("href");
				});
		});
	}
	,load: function() {
		this.$hdr.children(":first").html("Updating results...");
		var url = window.location.pathname + "?output=images";
		if(this.filters.criteriaMenu.getQueryParams() !="") url += "&" + this.filters.criteriaMenu.getQueryParams();
		url += "&pagenum=" + this.pagination.currentPageNum;
		this.$el.load(url, null, function() {
			this.initResults();
			this.pagination.update();
			this.$hdr.children(":first").replaceWith(this.find("#headerHtml h3"));
		}.bind(this));
	}
	,firstPage: function() {
		this.pagination.gotoPage(1);
	}
});
Behaviors.register("ImageGridFilters", null, {
	init: function() {
		this.filterByMenu = this.find("#filterby").behavior("FilterMenu", {});
		this.criteriaMenu = this.find("#criteria").behavior("FilterMenu", {});
		this.criteriaOptions = this.find("#criteria option");
		this.viewAllChk = this.filterByMenu.find("input:last").get(0);
		this.$criteriaChks = this.filterByMenu.find("input:not(:last)")
		this.updateCriteriaLayout();
	}
	,initLayout: function() {
		// set special styles on fields
		this.criteriaMenu.find("fieldset").each(function() {
			var childSelects = $(this).children("select");
			// if not a fieldset that has multiple selects (aka a date field)
			if (childSelects.length < 2)
			// TODO: use a specific class instead
				$(this).children("input, select").css("width", "100%");
			else
			// TODO: use a specific class instead
				childSelects.eq(0).css("width", "160px");
		});
	}
	,initEvents: function() {
		this.filterByMenu.addEvents({
			'change': function(elem, e) {
				// if the view all check box was clicked then set all of the other check boxes
				if (elem == this.viewAllChk){
					this.$criteriaChks.attr("checked", this.viewAllChk.checked);
					this.criteriaOptions.each(function(){
						this.selected = false;
					});
				}
				// else update the view all checkbox to match the proper state
				else
					this.viewAllChk.checked = this.$criteriaChks.filter(":not(:checked)").length == 0;
				this.updateCriteriaLayout();
			} .bind(this)
		});
		$("#btn-go a").click(function(e) {
			e.preventDefault();
			this.filterByMenu.close();
			this.criteriaMenu.close();
			this.update();
			this.updateCriteriaLayout();
		} .bind(this));
	}
		// updates the UI to match the proper state of each filter checkbox
	,updateCriteriaLayout: function() {
		var hasCriteria = false;
		this.$criteriaChks
			.each(function(o) {
				if (o.checked && !hasCriteria)
					hasCriteria = true;
				o.checked ? this.showCriteria(o.id) : this.hideCriteria(o.id);
			} .bindWith(this));
		hasCriteria ? this.criteriaMenu.enable() : this.criteriaMenu.disable();
	}
	,showCriteria: function(id) {
		var ids = id.split('-');
		for (var idIndex=0; idIndex < ids.length; idIndex++) {
			$("#" + ids[idIndex] + "-criteria")
			//.fadeIn()
				.slideDown()
				.find("input, select")
					.prop("disabled", false);
		}
	}
	,hideCriteria: function(id) {
		var ids = id.split('-');
		for (var idIndex=0; idIndex < ids.length; idIndex++) {
			$("#" + ids[idIndex] + "-criteria")
			//.fadeOut()
				.slideUp()
				.find("input, select")
					.prop("disabled", true);
		}
	}
	,update: function() {
		this.fireEvent("update");
		if (this.viewAllChk.checked)
			this.$criteriaChks.attr("checked",false);
		this.viewAllChk.checked = false;
		this.fireEvent("firstPage");

	}
});