var Finder = {

	sections: {},

	initialize: function () {
		var finder = $("finder");
		if (!finder) return false;
		Element.immediateDescendants(finder).each(function(section){
			var section_name = section.id.substr(0, section.id.indexOf("_"));
			this.sections[section_name] = new this.Section(section_name, section);
		}.bind(this));
	}

}

Finder.Section = function(name, element) {

	this.name = name;
	this.element = element;
	this.spotlight = null;
	this.spotlight_controls = null;
	this.learn_more_link = null;
	this.learn_more_url = null;

	this.initialize = function() {
		this.spotlight = this.name + "_spotlight";
		$A(this.element.getElementsByTagName("a")).each(function(a){
			Event.observe(a, "click", this.handle_index_click.bindAsEventListener(this));
		}.bind(this));
	}

	this.handle_index_click = function(evt) {
		Event.stop(evt);
		var link = Event.element(evt);
		var href = link.getAttribute("href");
		this.learn_more_url = href;
		href = this.path_relative_to_location(href);
		this.set_spotlight(href);
	}

	this.set_spotlight = function(fragment) {
		this.hide_spotlight();
		//var fragment_url = "finder/fragments/test.html";
		fragment = fragment.substring(0, fragment.indexOf("."))
		    + ".html";
		var fragment_url = "finder/fragments/" + fragment;
		var updater = new Ajax.Updater({ success: this.spotlight }, fragment_url, {
			method: "get",
			onSuccess: this.show_spotlight.bind(this),
			onFailure: this.go_to_learn_more_url.bind(this)})
	}

	this.show_spotlight = function() {
		this.add_spotlight_controls();
		this.element.addClassName("has_spotlight");
	}

	this.hide_spotlight = function() {
		this.remove_spotlight_controls();
		this.element.removeClassName("has_spotlight");
	}

	this.add_spotlight_controls = function() {

		// "Learn more" link
		var learn_more_span = document.createElement("span");
		learn_more_span.appendChild(document.createTextNode("Learn More"));
		var learn_more = document.createElement("a");
		learn_more.className = "learn_more";
		learn_more.setAttribute("href", this.learn_more_url);
		learn_more.appendChild(learn_more_span);
		Event.observe(learn_more, "mouseover", this.button_over);
		Event.observe(learn_more, "mouseout", this.button_out);

		// "Back to search" button
		var back_to_search_span = document.createElement("span");
		back_to_search_span.appendChild(document.createTextNode("Back to Search"));
		var back_to_search = document.createElement("button");
		back_to_search.className = "back_to_search";
		back_to_search.appendChild(back_to_search_span);
		Event.observe(back_to_search, "click", this.hide_spotlight.bindAsEventListener(this));
		Event.observe(back_to_search, "mouseover", this.button_over);
		Event.observe(back_to_search, "mouseout", this.button_out);

		this.spotlight_controls = document.createElement("div");
		this.spotlight_controls.className = "spotlight_controls";
		this.spotlight_controls.appendChild(learn_more);
		this.spotlight_controls.appendChild(back_to_search);
	
		var spotlight = $(this.spotlight);
		spotlight.parentNode.insertBefore(this.spotlight_controls, spotlight.nextSibling);
	}

	this.remove_spotlight_controls = function() {
		if (this.spotlight_controls == null) return;
		this.spotlight_controls.parentNode.removeChild(this.spotlight_controls);
		this.spotlight_controls = null;
	}

	this.go_to_learn_more_url = function() {
		location.href = this.learn_more_url;
	}

	this.button_over = function(evt) {
		var button = Event.element(evt);
		Element.addClassName(button, "hover");
	}
	
	this.button_out = function(evt) {
		var button = Event.element(evt);
		Element.removeClassName(button, "hover");
	}

	this.path_relative_to_location = function(path) {
		if (path.substr(0, 4) != "http") return path;
		var url = location.href;
		for (var i=0, len=path.length; i < len; i++) {
			if (url.substr(i,1) != path.substr(i,1)) break;
		}
		if (path.substr(i,1)=="/") i++;
		return path.substr(i);
	}

	this.initialize();
}

Event.observe(window, "load", Finder.initialize.bindAsEventListener(Finder));