var old_ie 	= false;
var SERIES	= "";
var POS		= 30;
var UL_POS;
var xml_http;

function init () {
	check_browser();
	if (!(xml_http)) {
		xml_http = get_xml_http_object();
	}
	if (xml_http == null) {
		alert ("Sorry, your browser does not support AJAX.");
		return;
	}
}

//asynchronous calls for dynamic content
//---------------------------------------------------------------------
function display_quilts (sid, pnt) {
	remove_all_child_nodes($('slider_cs'));
	if (sid != "3x3") {
		base_url	= "script/php_q_scroller.php?&series=" + sid;
	}
	else {
		base_url	= "script/php_q_scroller.php?&series=" + sid + "&pointer=" + pnt;
	}
	//alert (base_url);
	xml_http.onreadystatechange = all_quilts;
	send_asynchronous (base_url);
}

function all_quilts () {
	if (xml_http.readyState==4) {
		xml_feed = xml_http.responseXML;
		if (!(xml_feed == null)) {
			populate_slider (xml_feed);
			return true;
		}
	}
}

function populate_slider (quilt_xml) {
	//arrays to hold data from the xml stream
	var quilt_file		= new Array();
	var quilt_id		= new Array();
	var quilt_title		= new Array();
	var quilt_sizes		= new Array();
	var quilt_prices	= new Array();
	//var quilt_notes	= new Array();
	//var quilt_prev	= get_slide_images();
	
	//arrays to hold the dom elements
	var quilt_div		= new Array();
	var title_div		= new Array();
	var size_div		= new Array();
	var price_div		= new Array();
	var place_div		= new Array();
	
	slider				= $('slider_cs');
	
	quilt_series		= quilt_xml.getElementsByTagName("quilts")[0].getAttribute("series");
	quilt_count			= quilt_xml.getElementsByTagName("quilts")[0].getAttribute("quantity");
	quilt_total			= quilt_xml.getElementsByTagName("quilts")[0].getAttribute("total");
	
	for (x = 0; x < quilt_count; x++) {
		quilt_file[x]				= quilt_xml.getElementsByTagName("filename")[x].childNodes[0].data;
		quilt_title[x]				= quilt_xml.getElementsByTagName("pieceName")[x].childNodes[0].data;
		quilt_sizes[x]				= quilt_xml.getElementsByTagName("size")[x].childNodes[0].data;
		quilt_prices[x]				= quilt_xml.getElementsByTagName("price")[x].childNodes[0].data;
		quilt_id[x]					= quilt_xml.getElementsByTagName("filename")[x].getAttribute("id");
		
		if (quilt_prices[x] == 0) {
			quilt_prices[x] = "Not for sale";
		}
	}
	if (SERIES == "3x3") {
		POS 						= 30;
		slider.style.left			= POS + "px";
		($('al')).style.visibility	= "hidden";
	}
	
	for (y = 0; y < quilt_count; y++) {
		//alert (y);
		//set up div element to hold the quilt preview image
		quilt_div[y]							= document.createElement("div");
		quilt_div[y].style.backgroundImage		= "url(quilts/" + quilt_series + "/200/" + quilt_file[y] + ".png)";
		quilt_div[y].style.backgroundRepeat		= "no-repeat";
		quilt_div[y].style.height				= "300px";
		quilt_div[y].style.width				= "200px";
		quilt_div[y].style.top					= "0px";
		quilt_div[y].style.left					= (y * 260) + "px";
		quilt_div[y].style.cursor				= "pointer";
		quilt_div[y].style.backgroundPosition	= "center top";
		quilt_div[y].setAttribute("id", quilt_file[y]);
		
		//set up div element to hold the title of the work
		title_div[y]							= document.createElement("div");
		title_div[y].style.top	 				= "210px";
		title_div[y].style.left					= "5px";
		title_div[y].style.color				= "#42182A";
		title_div[y].style.fontFamily			= "calibri,arial,helv,sans";
		title_div[y].style.fontSize				= "3mm";
		title_div[y].appendChild(document.createTextNode("Title: " + quilt_title[y]));
		quilt_div[y].appendChild(title_div[y]);
		
		//set up div element to hold the size of the work
		size_div[y]								= document.createElement("div");
		size_div[y].style.top	 				= "250px";
		size_div[y].style.left					= "5px";
		size_div[y].style.color					= "#42182A";
		size_div[y].style.fontFamily			= "calibri,arial,helv,sans";
		size_div[y].style.fontSize				= "3mm";
		size_div[y].appendChild(document.createTextNode("Size: " + quilt_sizes[y]));
		quilt_div[y].appendChild(size_div[y]);
		
		//set up div element to hold the price of the work
		price_div[y]							= document.createElement("div");
		price_div[y].style.top	 				= "265px";
		price_div[y].style.left					= "5px";
		price_div[y].style.color				= "#42182A";
		price_div[y].style.fontFamily			= "calibri,arial,helv,sans";
		price_div[y].style.fontSize				= "3mm";
		price_div[y].appendChild(document.createTextNode("Price: " + quilt_prices[y]));
		quilt_div[y].appendChild(price_div[y]);
		
		//set up div element to hold the series number of the work
		place_div[y]							= document.createElement("div");
		place_div[y].style.top	 				= "280px";
		place_div[y].style.left					= "5px";
		place_div[y].style.color				= "#42182A";
		place_div[y].style.fontFamily			= "calibri,arial,helv,sans";
		place_div[y].style.fontSize				= "3mm";
		place_div[y].appendChild(document.createTextNode("Image " + quilt_id[y] + " of " + quilt_total));
		quilt_div[y].appendChild(place_div[y]);

		add_overlay_event(quilt_div[y]);
		slider.appendChild(quilt_div[y]);
		
		UL_POS	= -((y * 275) - 940);	
	}
}

//functions for displaying and changing the elements on the page
//---------------------------------------------------------------------
function smoke (call, answer, series) {
	SERIES					= series;
	caller					= $(call);
	answerer				= $(answer);
	answerer.style.zIndex 	= "99";
	stepper					= 2;
	if (old_ie) {
		stepper				= 7;
	}
	var fade_fast		= {type: 'opacity', from: 100, to: 0, step: -(stepper), delay: 3};
	$fx(caller).fxAdd(fade_fast).fxRun(set_zs);
	
	if (answer == "slider_wrapper") {
		POS						= 30;
		slid_elem				= $("slider_cs");
		slid_elem.style.left	= POS;
		
		display_quilts(series);
	}
}

function mirror (o_e) {
	f_m			= $('img_over_lay');
	remove_all_child_nodes(f_m);
	if (old_ie == true) {
		target	= o_e.srcElement;
		tid		= target.id;
	}
	else {
		t							= o_e.target;
		tid 						= t.id;
	}
	ol							= $('overlay');
	olt							= $('o_title');
	oli							= $('img_over_lay');
	//olt.firstChild.data			= get_piece_title (tid);
	new_path					= "url(quilts/" + SERIES + "/" + tid + ".jpg)";
	oli.style.backgroundImage	= new_path;
	open_overlay (ol);
}

function rabbit (hat) {
	ol	= $('overlay');
	oli	= $('img_over_lay');
	oli.style.backgroundImage	= "";
	o_id	= hat;
	if (o_id == "contact") {
		in_html	= build_contact();
	}
	else if (o_id == "framing") {
		in_html	= build_framing();
	}
	else {
		in_html	= build_about();
	}
	oli.innerHTML	= in_html;
	open_overlay (ol);
}

function set_zs () {
	all_top_elems		= new Array();
	all_top_elems[0]	= $("front_main");
	all_top_elems[1]	= $("small_works");
	all_top_elems[2]	= $("large_works");
	all_top_elems[3]	= $("slider_wrapper");
	
	for (z = 0; z < all_top_elems.length; z++) {
		all_top_elems[z].style.opacity	= "1.0";
		all_top_elems[z].style.filter 	= "alpha(opacity=100)";

		if (all_top_elems[z].style.zIndex == 99) {
			all_top_elems[z].style.zIndex = 100;
		}
		else {
			all_top_elems[z].style.zIndex = 30;
		}
	}
	s_init	= (all_top_elems[3].style.zIndex == 100) ? slider_init (SERIES) : "";
}

//functions to support the sliding quilt preview elements
//----------------------------------------------------------------------------------
function slider_init (series) {
	story	= $('bs');
	title	= $('tt');
	goback	= $('return');
	
	slide					= $('slider_cs');
	right					= $('ar');
	slide.style.left		= POS + "px";
	right.style.visibility	= "visible";
	
	if (series == "3x3") {
		($('n_3x3')).style.visibility	= "visible";
		title.firstChild.data	= "3 by 3 Series";
		story.firstChild.data	= "This is my favorite page. I wanted to experiment with techniques and color so I committed to a year of creating very small work. I made five 3x3 pieces a week for most of that year. I gave them all titles and although they are not for sale, many of the 250 pieces have inspired my current work.";
		goback.setAttribute("name", "small_works");
		add_return_event (goback, slider_return);
	}	
	else if (series == "color_story") {
		title.firstChild.data	= "Color Story Series";
		story.firstChild.data	= "Color and texture create interest in the Color Story series. Each 5 by 5 piece includes a color from the work before it.";
		goback.setAttribute("name", "small_works");
		add_return_event (goback, slider_return);
	}
	else if (series == "europe") {
		title.firstChild.data	= "Europe Series";
		story.firstChild.data	= "Original photographs taken in Europe and digitally printed on fabric provide the basis for these 5 by 5 collages.";
		goback.setAttribute("name", "small_works");
		add_return_event (goback, slider_return);
	}
	else if (series == "landscapes") {
		title.firstChild.data	= "Landscapes Series";
		story.firstChild.data	= "Serene landscapes evoke thoughts of folk art. These works include mostly solids with the occasional subtle print.";
		goback.setAttribute("name", "small_works");
		add_return_event (goback, slider_return);
	}
	else if (series == "happy_girl") {
		title.firstChild.data	= "Happy Girl Series";
		story.firstChild.data	= "These whimsical 4x6 pieces invite you into the upbeat adventures of Happy Girl.";
		goback.setAttribute("name", "small_works");
		add_return_event (goback, slider_return);
	}
	else if (series == "nature") {
		title.firstChild.data	= "Nature Series";
		story.firstChild.data	= "A varied series including pieces that explore our natural world. This series contains work generated through my participation in SAQA's Visioning project 2010. Many pieces begin with original nature photographs digitally printed on fabric.";
		goback.setAttribute("name", "large_works");
		add_return_event (goback, slider_return);
	}
	else if (series == "therapy") {
		title.firstChild.data	= "Therapy Series";
		story.firstChild.data	= "Each piece emphasizes one word or phrase that provokes thoughts about human nature and relationships. (This series is in progress.)";
		goback.setAttribute("name", "large_works");
		add_return_event (goback, slider_return);
	}
}


function slide_left () {
	step_up			= 5;
	if (old_ie) {
		step_up		= 10;
	}
	new_pos				= parseInt(POS) + 500;
	var slider_move		= {type: 'left', from: POS, to: new_pos, step: step_up, delay: 1};
	POS					= new_pos;
	$fx('#slider_cs').fxAdd(slider_move).fxRun(set_arrows);
}

function slide_right () {
	step_up			= 5;
	if (old_ie) {
		step_up		= 10;
	}
	new_pos				= parseInt(POS) - 500;
	var slider_move		= {type: 'left', from: POS, to: new_pos, step: -(step_up), delay: 1};
	POS					= new_pos;
	$fx('#slider_cs').fxAdd(slider_move).fxRun(set_arrows);
}

//utilitity and support functions
//----------------------------------------------------------------------------------------------
function set_arrows () {
	left				= $('al');
	right				= $('ar');
	if (POS < 30 && POS > UL_POS) {
		left.style.visibility	= "visible";
		right.style.visibility	= "visible";
	}
	else {
		if (POS < UL_POS) {
			right.style.visibility	= "hidden";
			left.style.visibility	= "visible";
		}
		else if (POS >= 30) {
			left.style.visibility	= "hidden";
			right.style.visibility	= "visible";
		}
	}
	
}

function slider_return (e) {
	remove_all_child_nodes($('slider_cs'));
	($('n_3x3')).style.visibility	= "hidden";
	($('al')).style.visibility		= "hidden";
	($('ar')).style.visibility		= "hidden";
	if (old_ie == true) {
		t		= e.srcElement;
		target	= t.name;
	}
	else {
		target	= e.target.name;
	}
	title						= $('tt');
	title.innerHTML				= "&nbsp;";
	smoke ('slider_wrapper', target);
}

function $ (id) {
	sid	= document.getElementById(id);
	return sid;
}

function add_return_event (eventer) {
	(old_ie == false) ? eventer.addEventListener("click", slider_return, false) : eventer.attachEvent("onclick", slider_return);
}

function add_overlay_event (eventer) {
	(old_ie == false) ? eventer.addEventListener("click", mirror, false) : eventer.attachEvent("onclick", mirror);
}

function check_browser () {
	if (navigator.appName.indexOf ("Microsoft") != -1) {
		old_ie = true;
	}
}

function open_overlay (ol) {
	ol.style.visibility 		= "visible";
	var ol_appear				= {type: 'opacity', from: 0, to: 100, step: 5, delay: 2};
	$fx(ol).fxAdd(ol_appear).fxRun(null, 1);
}

function close_overlay () {
	ol		= $('overlay');
	oi		= $('o_image');
	ot		= $('o_title');
	ol.style.opacity	= "0.0";
	ol.style.filter		= "alpha(opacity=0)";
	ol.style.visibility	= "hidden";
	oi.setAttribute("src", null);
	ot.firstChild.data	= " ";
}

function remove_all_child_nodes(node) {
	if (node && node.hasChildNodes && node.removeChild) {
		while (node.hasChildNodes()) {
			node.removeChild(node.firstChild);
		}
	}
}

function get_piece_title (tid) {
	if (tid == "s_left") {
		p_t	= slt_i.firstChild.data;
	}
	else if (tid == "s_right") {
		p_t	= srt_i.firstChild.data;
	}
	else {
		p_t	= smt_i.firstChild.data;
	}
	return p_t;
}

function dim (e) {
	menu_num	= $(e);
	menu_num.style.color	= "#957119";
}

function brighten (e) {
	menu_num	= $(e);
	menu_num.style.color 	= "#822e4b";
}

//menu item utilities;
function build_contact() {
	contact_html	=  "<form method='POST' action='http://sseebart.site.aplus.net/cgi-bin/formmail'><p>";
	contact_html	+= "<input TYPE='hidden' NAME='recipient' VALUE='susan@susanelaine.com'>";
	contact_html	+= "<input TYPE='hidden' NAME='subject' VALUE='Contact email from susanelaine.com'>";
	contact_html	+= "<div class='fm'><table class='ct_tbl' border='0'>";
	contact_html	+= "<tr><td colspan='2'><img src='images/seh_fa_centered_sm.jpg'></td></tr>";
	contact_html	+=  "<tr><td colspan='2' height='50'>Thanks for contacting me. I will get back to you soon.</td></tr>";
	contact_html	+= "<tr><td>Your name:</td>";
	contact_html	+= "<td><input TYPE='text' NAME='realname' class='ct_name'></td></tr>";
	contact_html	+= "<tr><td>Your E-mail:</td><td><input TYPE='text' NAME='email' class='ct_email'></td></tr>";
	contact_html	+= "<tr><td valign='top'>Your message:</td>";
	contact_html	+= "<td><textarea NAME='Enter your question or comment here' VALUE='' class='ct_comment'></textarea></td></tr>";
	contact_html	+= "<tr><td align='right'><input TYPE='hidden' NAME='env_report' VALUE='REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT'>";
	contact_html	+= "</td><td><input type='submit' value='Send Message'></td></tr></table></div></form>";
	return contact_html;
}

function build_about () {
	about_html	=  "<div class='fm'><table class='abt_tbl' border='0' cellpadding='10'><tr>";
	about_html	+= "<tr><td colspan='2'><img src='images/seh_fa_centered_sm.jpg'></td></tr>";
	about_html	+= "<td>I create pieces that incorporate the study of color, texture and pattern and thought ";
	about_html	+= "provoking pieces that examine human nature and our place in the world.<br><br>";
	about_html	+= "I grew up in various locales in the western United States. I have always loved working with fabric. ";
	about_html	+= "Beginning with Barbie clothes and then on to real clothes led me to quilts and happily to the fiber ";
	about_html	+= "art I create today. I live in Northern California with my family and our dog, Kevin. You can get to ";
	about_html	+= "know me a little more through my blog.</td>";
	about_html	+= "<td align='right' v-align='top'><img src='images/seh_artist_photo.jpg'></td></tr></table></div>";
	return about_html;
}

function build_framing () {
	frame_html	=  "<div class='fm'><table class='fra_tbl' border='0' cellpadding='10'><tr>";
	frame_html	+= "<td colspan='2'>Much of my artwork is small so it&#39;s easy to frame. Below I&#39;ve shown four of ";
	frame_html	+= "my Color Story displayed together and one of my 8x10 landscapes framed. You can take the pieces to your ";
	frame_html	+= "local framer or do it yourself.</td></tr><tr><td><img src='images/img_4263.jpg'></td>";
	frame_html	+= "<td rowspan='2'><img src='images/img_4276.jpg'></td></tr>";
	frame_html	+= "<tr><td><img src='images/img_4130.jpg'></tr></table>";
	return frame_html;
}

//asynchronous utilities
function get_xml_http_object() {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest();
	}
	if (window.ActiveXObject) {
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
	return null;
}

function send_asynchronous (url) {
	xml_http.open("GET", url, true);
	xml_http.send(null);
	xml_http.close;
}