var item_galleries = new Array();
var enlarged_img;
var caption_span;

function init_item_galleries() {
	var item_galleries = $$('.item_gallery_holder');
	for(var i=0;i<item_galleries.length;i++) {
		var gallery_id = item_galleries[i].getProperty('id');
		activate_gallery(gallery_id);
	}
}
function activate_gallery(item_gallery_id) {
	var image_margin=17;
	if(item_gallery_id=='modal_gallery') {
		enlarged_img=$('modal_gal_focus');
		caption_span=$('gallery_caption');
		image_margin=5;	
	}
	var gal_index = 0;
	var item_gallery_belt = $$('#'+item_gallery_id+' .item_gallery_belt')[0];
		
	var gal_prev = $$('#'+item_gallery_id+' a.gal_prev')[0];
	var gal_next = $$('#'+item_gallery_id+' a.gal_next')[0];

	var item_gallery_list = $$('#'+item_gallery_id+' ul.item_gallery_list')[0];
	var item_gallery_list_items = $$('#'+item_gallery_id+' li.gal_item_li');
	var item_gallery_pic_links = $$('#'+item_gallery_id+' a.item_gal_link');
	var num_gal_items = item_gallery_list_items.length;

	var gallery_viewport_w = item_gallery_belt.getStyle('width').toInt();

	var gal_item_animator = new Fx;
		
	// PAK ALLE IMG WIDTHS
	var gal_image_pos = new Array();
	for(var i=0; i<item_gallery_list_items.length; i++) {
		gal_image_pos[i] = item_gallery_list_items[i].getStyle('left').toInt();
	}
	var gal_list_width = item_gallery_list.getStyle('width').toInt();
	var end_reached = false;
	
	/*
	CHECK FOR PREV NEXT LARGE IMAGE NAV
	#modal_img_prev .modal_img_nav
	#modal_img_next .modal_img_nav
	#prev_active_area .nav_active_area
	#next_active_area .nav_active_area
	*/
	if($('modal_img_prev')!=null) {
		var prev_img_link = $('modal_img_prev');
		var next_img_link = $('modal_img_next');
		var pic_index = $('pic_index_counter').value.toInt();
		var num_pics = item_gallery_list_items.length;
		
		function toggle_prev_next_visibility(index) {
			//alert('pic_index = '+pic_index+' nun_pics = '+num_pics)
			if(pic_index==0) {
				prev_img_link.style.visibility='hidden';
				next_img_link.style.visibility='visible';		
			} else if(pic_index==(num_pics-1)) {
				prev_img_link.style.visibility='visible';
				next_img_link.style.visibility='hidden';		
			} else {
				prev_img_link.style.visibility='visible';
				next_img_link.style.visibility='visible';		
			}
		}
		
		toggle_prev_next_visibility(pic_index);
		
		prev_img_link.onclick=function() {
			if((pic_index-1)>=0) {
				pic_index--;
				show_large_pic(item_gallery_pic_links[pic_index]);
				toggle_prev_next_visibility(pic_index);
			}
			return false;
		}
		next_img_link.onclick=function() {
			if((pic_index+1)<num_pics) {
				pic_index++;
				show_large_pic(item_gallery_pic_links[pic_index]);
				toggle_prev_next_visibility(pic_index);
			} else {
				alert('fail')
			}
			return false;
		}
	}
	
	// POP-UP LINK VAN IMAGES
	item_gallery_pic_links.each(function(gal_link, i){
		gal_link.onclick=function() {
			if(item_gallery_id=='modal_gallery') {
				show_large_pic(this);			
			} else if(item_gallery_id=='product_gallery') {
				return true;
			} else {
				show_modal(this);
			}
			return false;
		}
	});
	
	// NEXT BUTTON
	// Quart.easeOut
	if(gal_next) {
		gal_next.onclick=function() {
			var cur_start = item_gallery_list.style.left;
			if(cur_start=='') { cur_start='0px'; }
			var cur_start_val = cur_start.toInt();
			var cur_diff = (-1*cur_start_val) + gallery_viewport_w;
			// NEXT POS BEKIJKEN, ALS VOLGENDE WITRUIMTE OVERLAAT, DAN NEXT POS AANPASSEN NAAR MAX
			var next_left_pos = gal_image_pos[gal_index+1];
			if((gal_index<num_gal_items) && (end_reached==false)) {
				gal_index++;
				var space_left = next_left_pos+gallery_viewport_w+ image_margin;
				if(space_left>=(gal_list_width)) {	
					var cur_end = -1*(gal_list_width - gallery_viewport_w) + image_margin;
					end_reached=true;
				} else {
					var cur_end = '-'+gal_image_pos[gal_index]+'px';
				}
				var cur_duration = 275;//cur_start_val - cur_end.toInt();
				gal_item_animator = new Fx.Tween(
						item_gallery_list, 
						{ property: 'left', duration: cur_duration, transition: Fx.Transitions.Quart.easeIn }
					)
					.start(cur_start, cur_end);
			}
			return false;
		}
	}
	// PREV BUTTON
	if(gal_prev) {
		gal_prev.onclick=function() {
			if(gal_index>0) {
				var cur_start = item_gallery_list.style.left;
				var max_gal_index = num_gal_items-1;
				gal_index--;
				if(end_reached==true) { end_reached=false; }
				var cur_end = '-'+gal_image_pos[gal_index]+'px';
				var cur_duration = 275;//-1*(cur_start.toInt() - cur_end.toInt());
				gal_item_animator = new Fx.Tween(
					item_gallery_list, 
					{ property: 'left', duration: cur_duration, transition: Fx.Transitions.Quart.easeIn }
					)
					.start(cur_start, cur_end);
			}
			return false;
		}
	}
}
//////////////////////////////////////////////////////////////////
/////////////////// ENLARGE PIC IN GALLERY MODAL /////////////////
//////////////////////////////////////////////////////////////////

function show_large_pic(the_link) {
	var img_to_show =the_link.href;
	var img_settings = the_link.rev;
	image_settings_array = get_image_settings(img_settings);
	var img_width = image_settings_array[0];
	var img_height = image_settings_array[1];
	var img_caption = image_settings_array[2];
	if(img_caption=='') { 
		img_caption='&nbsp;'; 
	} else {
		img_caption = unescape(img_caption);
		img_caption = img_caption.replace(/\+/g, ' ');
	}
	
	// SHOW LOADING
	toggle_opacity(the_link, 'transparent');

	// PRELOAD IMAGE
	var load_img = new Image();
	load_img.onload = function() {
		enlarged_img.src=img_to_show;
		enlarged_img.width=img_width;
		enlarged_img.height=img_height;
		toggle_opacity(the_link, 'full');
		// SET CAPTION
		caption_span.innerHTML=img_caption;
	}
	load_img.src=img_to_show;
}

function get_image_settings(img_settings) {
	img_settings_array = img_settings.split('###');
	// WIDTH
	var img_width_raw = img_settings_array[0]; //  '{width: 315'
	var img_width = img_width_raw.split('{width: ')[1];	
	// HEIGHT
	var img_height_raw = img_settings_array[1]; //  height: 445
	var img_height = img_height_raw.split('height: ')[1];	
	// CAPTION
	img_caption_raw = img_settings_array[2]; // caption: ''}
	var img_caption = img_caption_raw.replace("caption: '", "");
	img_caption = img_caption.replace("'}", "");

	var image_settings_array = new Array(img_width, img_height, img_caption);
	return image_settings_array;
}
//////////////////////////////////////////////////////////////////
/////////////////// FABRICS GALLERY //////////////////////////////
//////////////////////////////////////////////////////////////////
function fabric_gallery() {
	var fabrics_scroller = $('fabrics_scroller');
	var fabrics_to_scroll = $('fabrics_to_scroll');
	
	var scroll_fabric_up = $('fabric_scroll_up');
	var scroll_fabric_down = $('fabric_scroll_down');
	
	var fabric_specimens = $$('.fabric_specimen');
	var num_fabric_specimens = fabric_specimens.length;
	var num_per_row = 4;
	var num_rows = Math.ceil(num_fabric_specimens / num_per_row);
	
	var cur_row_index = 0;
	var row_height = -95;
	var cur_row_top = 0;
	
	var fabric_animator = new Fx;
	var cur_duration = 275;
	
	scroll_fabric_down.onclick=function() {
		if((cur_row_index+1)<num_rows) {
			cur_row_index++;
			cur_row_top = fabrics_to_scroll.style.top;
			if(cur_row_top=='') { cur_row_top = 0; }
			new_row_top = cur_row_index*row_height;	
			// alert('cur_row_index = '+cur_row_index+' - cur_row_top = '+cur_row_top+' - new_row_top = '+new_row_top);
			// fabrics_to_scroll.style.top = cur_row_top+'px';
			fabric_animator = new Fx.Tween(
				fabrics_to_scroll, 
				{ property: 'top', duration: cur_duration, transition: Fx.Transitions.Quart.easeIn }
				)
				.start(cur_row_top, new_row_top);
		}
		return false;
	}
	scroll_fabric_up.onclick=function() {
		if(cur_row_index>0) {
			cur_row_index--;
			cur_row_top = fabrics_to_scroll.style.top;
			new_row_top = cur_row_index*row_height;	
			//			fabrics_to_scroll.style.top = cur_row_top+'px';
			fabric_animator = new Fx.Tween(
				fabrics_to_scroll, 
				{ property: 'top', duration: cur_duration, transition: Fx.Transitions.Quart.easeIn }
				)
				.start(cur_row_top, new_row_top);
		}
		return false;
	}

}

//////////////////////////////////////////////////////////////////
/////////////////// MODAL EN AJAX STUFF //////////////////////////
//////////////////////////////////////////////////////////////////

var modal_to_show = '';
var modal_pic_height=0;
var image_to_enlarge;

function show_modal(the_link) {
	// SHOW LOADER
	toggle_opacity(the_link, 'transparent');
	// INSERT MODAL HOLDING HTML
	insert_modal_html();
	// LOAD FILE
	var load_file = the_link.href;
	// MODAL ID
	modal_to_show = 'de_vorm_modal';
	// MAKE ZE CALL
	sendRequest(the_link, handleRequest);
}

function enlarge_image(the_link) {
	// SHOW LOADER
	link_insert_loader(the_link);
	// INSERT MODAL HOLDING HTML
	insert_modal_html();
	// LOAD FILE
	image_to_enlarge = the_link.href;
	// MODAL ID
	modal_to_show = 'de_vorm_enlarge_img';
	
	// PRELOAD IMAGE
	var load_img = new Image();
	load_img.onload = function() {
		var his_width = load_img.width;
		var his_height = load_img.height;
		var html_to_show='<div id="de_vorm_enlarge_img" style="width:'+his_width+'px"class="page_modal"><a name="close_werk_modal" id="close_modal" class="close_modal"></a><hr class="clear" style="height: 10px;"><img src="'+image_to_enlarge+'" id="modal_enlarge_image" width="'+his_width+'" height="'+his_height+'" /></div>';
		var container = document.getElementById('modal_holder');
		container.innerHTML = html_to_show;

		hide_inserted_loader();
		launch_modal(modal_to_show);
	}
	load_img.src=image_to_enlarge;
}

function insert_msg_modal(the_link, msg) {
	// SHOW LOADER
	link_insert_loader(the_link);
	// INSERT MODAL HOLDING HTML
	insert_modal_html();
	// MODAL ID
	modal_to_show = 'de_vorm_message';
	
	var html_to_show='<div id="de_vorm_message" class="page_modal"><a name="close_werk_modal" id="close_modal" class="close_modal"></a><hr class="clear" style="height: 10px;">'+msg+'</div>';
	
	var container = document.getElementById('modal_holder');
	container.innerHTML = html_to_show;

	hide_inserted_loader();
	launch_modal(modal_to_show);
}

function insert_modal_html() {
	// INSERT HTML AT TOP OF PAGE
	var body_tag = document.getElementsByTagName("body").item(0);
	// -- MODAL
	var page_modal = document.createElement("div");
	page_modal.setAttribute('id','modal_holder');
	body_tag.insertBefore(page_modal, body_tag.firstChild);
	// -- OVERLAY
	var overlay_div = document.createElement("div");
	overlay_div.setAttribute('id','overlay');
	body_tag.insertBefore(overlay_div, page_modal.nextSibling);
}
///////// SHOW LOADING /////////
var active_link;
function toggle_opacity(link, state) {
	active_link = link;
	var linked_img=link.getElement('img');

//	var linked_img = link.childNodes[1];
	if(state=='full') {
		opacity_val=1;
	} else {
		opacity_val=0.5;
	}
	if(in_ie_hell==false) {
		linked_img.style.opacity = opacity_val;
	} else {
		linked_img.style.filter = 'alpha(opacity=' + opacity_val*100 + ')';
	}
}
var active_loading_link;
var active_loading_link_html;
var mix_loader_html = ' <img src="_img/ajax_loader.gif" alt="Loading..." border="0" />';

function link_insert_loader(the_link) {
	active_loading_link = the_link;
	active_loading_link_html = the_link.innerHTML;
	the_link.innerHTML = active_loading_link_html + mix_loader_html;
}
function hide_inserted_loader() {
	if((active_loading_link!='') && (active_loading_link!=null)) {
		active_loading_link.innerHTML = active_loading_link_html;
	} 
}

/* -----------------------------------------------------
	INSTANT EDIT CALLBACK FUNCTIONS
 -----------------------------------------------------*/
function handleRequest(req) {
	var html_to_show = req.responseText;
	var container = document.getElementById('modal_holder');
	container.innerHTML = html_to_show;
	toggle_opacity(active_link, 'full');
	launch_modal(modal_to_show);
}
/* -----------------------------------------------------
	XMLHTTP Functions
	As found on Quirksmode. You hero.
 -----------------------------------------------------*/

function sendRequest(url,callback,postData) {
	var req = createXMLHTTPObject();
	if (!req) return;
	var method = (postData) ? "POST" : "GET";
	req.open(method,url,true);
	req.setRequestHeader('User-Agent','XMLHTTP/1.0');
	if (postData)
		req.setRequestHeader('Content-type','application/x-www-form-urlencoded');
	req.onreadystatechange = function () {
		if (req.readyState != 4) return;
		if (req.status != 200 && req.status != 304) {
		//	alert('HTTP error ' + req.status);
			return;
		}
		callback(req);
	}
	if (req.readyState == 4) return;
	req.send(postData);
}

function XMLHttpFactories() {
	return [
		function () {return new XMLHttpRequest()},
		function () {return new ActiveXObject("Msxml2.XMLHTTP")},
		function () {return new ActiveXObject("Msxml3.XMLHTTP")},
		function () {return new ActiveXObject("Microsoft.XMLHTTP")}
	];
}

function createXMLHTTPObject() {
	var xmlhttp = false;
	var factories = XMLHttpFactories();
	for (var i=0;i<factories.length;i++) {
		try {
			xmlhttp = factories[i]();
		}
		catch (e) {
			continue;
		}
		break;
	}
	return xmlhttp;
}
/* -----------------------------------------------------
	SET OVERLAY STUFF
 -----------------------------------------------------*/
var array_page_size;
var overlay_div;
var scroll_x, scroll_y, window_w, window_h;


function get_page_size(){
	var scroll_position = window.getScroll();
	scroll_x = scroll_position.x;
	scroll_y = scroll_position.y;

	var body_size =  $(document.body).getScrollSize();
	body_w = body_size.x;
	body_h = body_size.y;
	
	var window_size = window.getSize();
	window_w = window_size.x;
	window_h = window_size.y;
	
	// for small pages with total height less then height of the viewport
	if(body_h < window_h){
		page_h = window_h;
	} else { 
		page_h = body_h;
	}

	// for small pages with total width less then width of the viewport
	if(scroll_x < window_w){	
		page_w = window_w;
	} else {
		page_w = body_w;
	}
	array_page_size = new Array(page_w, page_h, window_w, window_h);
	return array_page_size;
}

function show_overlay(overlay_height_int) {
	var overlay_height = overlay_height_int + 'px';
	overlay_div.setStyle('height', overlay_height);
	overlay_div.setStyle('display', 'block');
	overlay_div.setStyle('opacity', '0');
	overlay_div.fade(0, 1);
}

function launch_modal(modal_to_display) {

	array_page_size=get_page_size();

	var target_modal_div = $(modal_to_display);
	// ZET OP ZICHTBAAR
	target_modal_div.setStyle('opacity', '0');
	target_modal_div.style.display = "block";
	//  MODAL DIMENSIONS
	var modal_size = target_modal_div.getSize();
	var modal_div_w = modal_size.x;
	var modal_div_h = modal_size.y;
	
	var page_height = array_page_size[1];
	var overlay_height = page_height;
	if(modal_div_h>page_height) {
		overlay_height = modal_div_h;
	}	

	// CENTER THE MODAL AND MAKE SURE LEFT AND TOP VALUES ARE NOT NEGATIVE
	var modal_div_x = Math.round(((array_page_size[2] - modal_div_w) / 2));
	var modal_div_y = Math.round(scroll_y + ((array_page_size[3] - modal_div_h) / 2));

	target_modal_div.style.top = (modal_div_y < 0) ? "0px" : modal_div_y + "px";
	target_modal_div.style.left = (modal_div_x < 0) ? "0px" : modal_div_x + "px";

 	// OVERLAY
	overlay_div = $('overlay');
	show_overlay(overlay_height);
	target_modal_div.fade(0, 1);
	
	// ACTIVATE GALLERY
	if($('modal_gallery')) {
		activate_gallery('modal_gallery');
	}
	// ENLARGE IMAGE BUSINESS	
	if(modal_to_display=='de_vorm_enlarge_img') {
		
	}
	// CLOSE BUSINESS
	var close_link = $('close_modal');
	if(close_link) {
		close_link.onclick=function() {
			close_cur_modal();
		}
	}
	overlay_div.onclick=function() {
		close_cur_modal();
	}
}
var div_fader = new Fx;

function close_cur_modal() {
	if (document.getElementById) {
		// REMOVE THE DYNAMIC DIVS
		if ($(modal_to_show)) { 	
			var modal_to_show_to_del = $(modal_to_show);
			div_fader = new Fx.Tween(modal_to_show_to_del, { property: 'opacity', duration: 150 } ).start(1, 0);
		}
		if ($('overlay')) { 	
			var overlay = $('overlay');
			div_fader = new Fx.Tween(overlay, { property: 'opacity', duration: 150 } ).start(1, 0).chain(
				function() {  
				  	document.body.removeChild(overlay);
			  		var modal_holder = $('modal_holder');
				  	document.body.removeChild(modal_holder);
				}
			);
		}
	}
}
function start_key_functions() {
 	document.onkeydown = check_key;
}
function check_key(event) {
	// IE hack
	if (window.event) { event = window.event; }
	var keycode = event.keyCode;
	var escapeKey;
	if (event.DOM_VK_ESCAPE) {  // mozilla
		escapeKey = event.DOM_VK_ESCAPE;
	} else { // ie
		escapeKey = 27;
	}
	var key = String.fromCharCode(keycode).toLowerCase();
	if (keycode == escapeKey){ // close lightbox
			close_cur_modal();
	}
}
start_key_functions();