/*

xFlow!

Created by Paul Whitrow - www.pwhitrow.com

xFlow! Software License - see xFlow! Software License.html in the xFlow! root directory

*	This code is based on Michael L. Perrys Cover flow in Javascript.

*/


/* Configuration variables */
					 // Sets the image you wish to start at!
var xflow_curr_img_id = 0;
var xflow_focus = 5;                  // Sets the numbers of images visible on each side of the focused one
var xflow_images_cursor = 'pointer';  // Sets the cursor type for all images default is 'default'
var xflow_slider_cursor = 'default';  // Sets the slider cursor type: try "e-resize" default is 'default'
var xflow_xstep = 30;					// default central image spacing!
var xflow_menuopac = 100;				// default opacity for menu images

/* Id names used in the HTML */
var xflow_maintitle = 'maintitle';    // Default is 'maintitle'
var xflow_div = 'xflow';			 // Default is 'xflow'
var xflow_loading = '';        // Default is 'loading'
var xflow_images = 'images';          // Default is 'images'
var xflow_captions = 'captions';      // Default is 'captions'
var xflow_scrollbar = '';    // Default is 'scrollbar'
var xflow_slider = '';          // Default is 'slider'
var xflow_barleft = '';			// Default is 'barleft'
var xflow_barright = '';			 // Default is 'barright'
var xflow_gallerymenu = '';	// Default is 'gallerymenu'
var xflow_helplayer = '';		// Default is 'gallerymenu'

var xflow_allowed_videos = new Array('avi', 'mpg', 'flv', 'wmv');

/* Global variables */
var xflow_slider_width = 0;           
var xflow_caption_id = 0;
var xflow_new_caption_id = 0;
var xflow_current = 0;
var xflow_target = 0;
var xflow_memtarget = 0;
var xflow_timer = 0;
var xflow_array_images = new Array();
var xflow_imgarray = new Array();
var xflow_new_slider_pos = 0;
var xflow_dragging = false;
var xflow_dragobj = null;
var xflow_dragx = 0;
var xflow_posx = 0;
var xflow_newposx = 0;
var xflow_max = 0;
var xflow_vieweropen = false;
var xflow_imageviewer = "";
var xflow_viewerimageholder = "";
var xflow_viewerloadingimage = "";
var xflow_viewermainimage = "";
var xflow_viewertext = "";
var xflow_viewercode ="";
var xflow_viewercontrols = "";
var xflow_viewernextimage = "";
var xflow_viewercloseimage = "";
var xflow_viewerprevimage = "";
var xflow_preloadedimgs = new Array();
var xflow_loadtimer;
var xflow_percent = 0
var xflow_imageid;

/* Start functions */


/* detect IE! */
var IE = false;
if (document.all) 
{
	IE = true;
}

function XFLOW_init()
{

	if(XFLOW_getByClassName(xflow_images))
	{
		XFLOW_preLoad();
		if(xflow_startimage <= 0 ) xflow_startimage = 1;
		xflow_startimage -= 1;
		XFLOW_hide(xflow_loading);
		XFLOW_refresh(true);
		XFLOW_show(xflow_images);
		XFLOW_show(xflow_scrollbar);
		XFLOW_initMouseWheel();
		XFLOW_initMouseDrag();
		XFLOW_glideTo(-(xflow_xstep * xflow_startimage), xflow_startimage);
		XFLOW_menuSet();
		XFLOW_extras(2);
		XFLOW_extras(3);
	}
}

function XFLOW_preLoad()
{
	var preLoadImages = XFLOW_getByClassName(xflow_images).getElementsByTagName('IMG');
	
	for(var i=0; i < preLoadImages.length; i++) 
	{
		xflow_preloadedimgs[i] = new Image();
		xflow_preloadedimgs[i].src = XFLOW_str_replace("/thumbs", "", preLoadImages[i].src);
		XFLOW_checkLoadStatus(i)
	}
}

function XFLOW_checkLoadStatus(i)
{
	if(XFLOW_isImgLoaded(xflow_preloadedimgs[i]))
	{
		xflow_percent += 1
		var p = Math.round((xflow_percent / xflow_preloadedimgs.length) * 100)

		window.status = 'Preloading Images: ' + p + '% Complete';

		if((i + 1) >= xflow_preloadedimgs.length)
		{
			clearTimeout(xflow_loadtimer);
			window.status = 'xFlow Ready.';
		}
	}
	else
	{
		xflow_loadtimer = setTimeout('XFLOW_checkLoadStatus(' + i + ')', 100)
	}
}

function XFLOW_isImgLoaded(img) 
{
	if (!img.complete) 
	{
        return false;
    }

    if (typeof img.naturalWidth != "undefined" && img.naturalWidth == 0) 
	{
        return false;
    }

    return true;
}

function XFLOW_getFileExtension(file)
{
	var tmp = file.split('.');
	return (tmp[tmp.length - 1]);
}

function XFLOW_in_array(needle, haystack, argStrict) 
{
 
    var found = false, key, strict = !!argStrict;
 
    for (key in haystack) 
	{
        if ((strict && haystack[key] === needle) || (!strict && haystack[key] == needle)) 
		{
            found = true;
            break;
        }
    }
 
    return found;
}

function XFLOW_getByClassName(classname,el)
{
	if(!el)
	{
		el = "DIV";
	}

	var divs = document.getElementsByTagName(el);
	for(a = 0; a < divs.length; a++)
	{
		var cn = (divs[a].className);

		if(cn == classname)
		{
			return divs[a];
		}
	}

	return false;
}

function XFLOW_addLoadEvent(func) 
{
    var oldonload = window.onload;
    if (typeof window.onload != 'function') 
	{
		window.onload = func;
	}
    else 
	{
        window.onload = function() 
			{
            if (oldonload) oldonload();
            func();
			}
    }
} 

function XFLOW_pause(ms) 
{
	var now = new Date();
	var exitTime = now.getTime() + ms;
	while (true) 
	{
		now = new Date();
		if (now.getTime() > exitTime)
		{
			return;
		}
	}
}

function XFLOW_str_replace(search, replace, subject) 
{
	var f = search, r = replace, s = subject;
	var ra = r instanceof Array, sa = s instanceof Array, f = [].concat(f), r = [].concat(r), i = (s = [].concat(s)).length;
 
    while (j = 0, i--) 
	{
        if (s[i]) {
            while (s[i] = s[i].split(f[j]).join(ra ? r[j] || "" : r[0]), ++j in f){};
        }
    };
 
    return sa ? s : s[0];
}

function XFLOW_menuSet()
{
	XFLOW_show(xflow_gallerymenu);
	var i = XFLOW_getByClassName(xflow_gallerymenu).getElementsByTagName('IMG');
	for(a=0; a < i.length; a++)
	{
		if(i[a].className == 'active') continue;
		XFLOW_changeOpac(xflow_menuopac, i[a]);
	}
}

function XFLOW_menu(opac, obj)
{
	if(obj.className == 'active') return;
	XFLOW_changeOpac(opac, obj);
}

function XFLOW_step()
{
	switch (xflow_target < xflow_current-1 || xflow_target > xflow_current+1) 
	{
		case true:
			XFLOW_moveTo(xflow_current + (xflow_target-xflow_current)/3);
			window.setTimeout(XFLOW_step, 50);
			xflow_timer = 1;
			break;

		default:
			xflow_timer = 0;
			break;
	}
}

function XFLOW_glideTo(x, xflow_new_caption_id)
{	
	/* Animate gliding to new x position */

	if(xflow_imgarray.length <= 1)
	{
		return;
	}

	xflow_target = x;
	xflow_memtarget = x;
	if (xflow_timer == 0)
	{
		window.setTimeout(XFLOW_step, 50);
		xflow_timer = 1;
	}
	
	/* Display new caption */
	xflow_caption_id = xflow_new_caption_id;
	var caption = xflow_imgarray[xflow_caption_id].alt;
	var description = xflow_imgarray[xflow_caption_id].title;
	if (caption == '') caption = '&nbsp;';
	if(description.length > 200)
	{
		description = description.substring(0, 200) + '&#8230;[more]';
	}
	 if (is_saf)
	  caption_div.innerHTML = "<p style='float: left;'><strong>" + caption + "</strong></p>";
   else
    caption_div.innerHTML = "<p><strong>" + caption + "</strong></p>";
	/* Set scrollbar slider to new position */
	if (xflow_dragging == false)
	{
		xflow_new_slider_pos = (scrollbar_width * (-(x*100/((xflow_max-1)*xflow_xstep))) / 100) - xflow_newposx;
		slider_div.style.marginLeft = (xflow_new_slider_pos - xflow_slider_width) + 'px';
	}

}

function XFLOW_loadImagesToArray()
{
	var imgs = XFLOW_getByClassName(xflow_images).getElementsByTagName('IMG')
	xflow_max = imgs.length;
	for (var index = 0; index < xflow_max; index++)
	{ 
		xflow_imgarray[index] = imgs[index];
	}
}

function XFLOW_moveTo(x)
{
	xflow_current = x;
	var zIndex = xflow_max;

	/* Main loop */
	for (var index = 0; index < xflow_max; index++)
	{ 
		var image = xflow_imgarray[index];
		var current_image = index * -xflow_xstep;
		var imgbg = image.parentNode;

		/* Don't display images that are not xflow_focussed */
		if ((current_image+max_xflow_focus) < xflow_memtarget || (current_image-max_xflow_focus) > xflow_memtarget)
		{
			image.style.visibility = 'hidden';
			image.style.display = 'none';
			imgbg.style.visibility = 'hidden';
			imgbg.style.display = 'none';
		}
		else 
		{
			var z = (Math.sqrt(10000 + x * x) + 100);
			var xs = x / z * size + size;

			/* Still hide images until they are processed, but set display style to block */
			image.style.display = 'block';
			imgbg.style.display = 'block';
		

			/* Process new image height and image width */
			/*
			var new_img_h = (image.h / image.w * image.defWidth) / z * size;

			if(isNaN(new_img_h)) continue; // IE fix !

			switch ( new_img_h > max_height )
			{
				case false:
					var new_img_w = image.defWidth / z * size;
					break;

				default:
					new_img_h = max_height;
					var new_img_w = image.w * new_img_h / image.h;
					break;
			}
	
*/
     
			/* Set new image properties */
			var imgleft = xs - (image.defWidth / 2) / z * size + images_left + 'px';

			var new_img_top = 0;

      var new_img_h = image.h;
      var new_img_w = image.w;
      

			if(new_img_w > xflow_div.offsetWidth)
			{
				new_img_w = xflow_div.offsetWidth / 2;
				new_img_h = (image.h / image.w * new_img_w) / z * size;
				imgleft = xs - (new_img_w / 2) / z * size + images_left + 'px';
			}

			imgbg.style.left = imgleft;
			imgbg.style.height = new_img_h + 'px';
			imgbg.style.width = new_img_w + 'px';
			imgbg.style.top = new_img_top + 'px';
			imgbg.style.visibility = 'visible';

			image.style.left = imgleft;
			image.style.height = new_img_h + 'px';
			image.style.width = new_img_w + 'px';
			image.style.top = new_img_top + 'px';
			image.style.visibility = 'visible';
			image.id = index;

			/* Set image layer through zIndex */
			switch ( x < 0 )
			{
				case true:
					zIndex++;
					break;

				default:
					zIndex = zIndex - 1;
					break;
			}
			
			/* Change zIndex and onclick function of the focussed image */
			switch ( image.i == xflow_caption_id )
			{
				case false:
					image.onclick = function() 
					{ 
					  
						XFLOW_glideTo(this.x_pos, this.i); 
					}
					break;

				default:
				  xflow_curr_img_id = image.id;
					zIndex = zIndex + 1;

					if(image.url != "")
					{
						image.onclick = function()
						{
						  if (fetch_obj('anch_'+this.parentNode.getAttribute('id')))
						   fetch_obj('anch_'+this.parentNode.getAttribute('id')).click();
						}
					}
					
					/* set opacities for images either side of main */
					for(a=0; a < xflow_max; a++){
						
						if((a > index + 3) || (a < index - 3)){ 
							XFLOW_changeOpac(40, xflow_imgarray[a]);
						}else if((a > index + 2) || (a < index - 2)){ 
							XFLOW_changeOpac(60, xflow_imgarray[a]);
						}else if((a > index + 1) || (a < index - 1)){
							XFLOW_changeOpac(80, xflow_imgarray[a]);
						}else if((a > index) || (a < index)){
							XFLOW_changeOpac(100, xflow_imgarray[a]);
						}else{
							XFLOW_changeOpac(100, xflow_imgarray[a]);
						}

					}
					break;
			}

			// make images appear on a curved plain!
			imgbg.style.top = (new_img_h / 4) + images_top + 'px';

			imgbg.style.zIndex = zIndex;

		}
		x += xflow_xstep;
	}
}

/* we may need to do extra site specific things so add them into this function */
function XFLOW_extras(x)
{
	switch(x)
	{
		case(1):
				XFLOW_getByClassName(xflow_gallerymenu).style.width = scrollbar_div.offsetWidth + 'px';
				break;
		case(2):
				xflow_helplayer.style.display	= "block";
				break;
		case(3):
				caption_div.style.width	= scrollbar_div.offsetWidth + 'px';
				break;
	}
}

function XFLOW_basename(file)
{
	var tmp = file.split('/');
	return (tmp[tmp.length - 1]);
}

function XFLOW_isVideo(file)
{
	var ext = XFLOW_getFileExtension(file);
	var video = XFLOW_basename(file);
    if(XFLOW_in_array(ext, xflow_allowed_videos))
	{
		return video;
	}
	else
	{
		return false;
	}
}

function XFLOW_video(file)
{
    if(video = XFLOW_isVideo(file.lang))
	{
		imgSize = file.className.split(':');
		width = imgSize[0];
		height = imgSize[1];
		preview = XFLOW_basename(file.src);
		video = XFLOW_str_replace('thumbs/' + preview, XFLOW_basename(file.lang), file.src);

		var s1 = new SWFObject('../../extras/player-viral.swf', 'ply', width, height, '9.0.0');
		s1.addParam('quality', 'best');
		s1.addParam('bgcolor', '#AF949B');
		s1.addParam('allowfullscreen', 'true');
		s1.addParam('allownetworking', 'all');
		s1.addParam('allowscriptaccess', 'always');
		s1.addParam('flashvars', 'file=' + video + '&image=' + file.src);
		s1.write('xflow_viewercode');

		xflow_viewercode.style.top = file.offsetTop + 'px';
		xflow_viewercode.style.left = file.offsetLeft + 'px';
	}
}

function XFLOW_openViewer(img)
{

}

function XFLOW_viewerImage(i, h)
{
	if(h)
	{
		i = XFLOW_handle(i, true);
	}

	xflow_viewercode.innerHTML = '';
	img = xflow_imgarray[i];
	XFLOW_setViewerImage(img.url, img.alt, img.title, img.lang, i);
	XFLOW_video(xflow_imgarray[i]);
	xflow_imageid = i;
	return xflow_imageid;
}

function XFLOW_setViewerImage(src, alt, txt, lang, i)
{
	XFLOW_changeOpac(0, xflow_viewerimageholder);

	xflow_viewermainimage.src = src;
	xflow_viewermainimage.alt = alt;
	
	XFLOW_getByClassName('alt', 'p').innerHTML = alt;
	XFLOW_getByClassName('title', 'p').innerHTML = XFLOW_convertURL(txt);

	if(XFLOW_getByClassName('imgSize', 'p'))
	{
		imgSize = xflow_imgarray[i].className.split(':');
		XFLOW_getByClassName('imgSize', 'p').innerHTML = '' + imgSize[0] + 'px / ' + imgSize[1] + 'px';
	}

	XFLOW_getByClassName('viewimagelink', 'p').onclick = function()
													{
														if(XFLOW_isVideo(lang))
														{
															document.location.href = XFLOW_str_replace(XFLOW_basename(src),XFLOW_basename(lang), src);
														}
														else
														{
															document.location.href = src;
														}
														return false;
													}

	XFLOW_mainImageLoaded(i);
}

function XFLOW_mainImageLoaded(i)
{
	XFLOW_viewerDisplay('loading');


	if(!XFLOW_isImgLoaded(xflow_viewermainimage))
	{
		XFLOW_mainImageLoaded(i)
	}
	else
	{
		var browser = XFLOW_getBrowserInfo();

		xflow_imageviewer.style.height = browser['H'];
		xflow_imageviewer.style.width = browser['W'];

		XFLOW_viewerDisplay('show');

		XFLOW_resizeImage(xflow_imgarray[i]);

		xflow_viewerimageholder.style.width = xflow_viewermainimage.offsetWidth + 'px';

		XFLOW_setControls()
	}
}

function XFLOW_resizeImage(img)
{
	/* arbitrary value to get a nice new image size! */
	var xBy = 200;

	var browser = XFLOW_getBrowserInfo();

	/* get image dimensions */
	imgSize = img.className.split(':');
	imgWidth = parseFloat(imgSize[0]);
	imgHeight = parseFloat(imgSize[1]);

	/* resize the image */
	if((imgHeight + xBy) > browser['H'])
	{
		xflow_viewermainimage.style.width = 'auto';
		xflow_viewermainimage.style.height = Math.round(browser['H'] - xBy) + 'px'; 
	}
	else if((imgWidth + xBy) > browser['W'])
	{
		xflow_viewermainimage.style.width = Math.round(browser['W'] - xBy) + 'px';
		xflow_viewermainimage.style.height = 'auto'; 
	}
	else
	{
		xflow_viewermainimage.style.width = imgWidth + 'px';
		xflow_viewermainimage.style.height = imgHeight + 'px'; 
	}

	XFLOW_AnimateOpac(100, 0, xflow_viewerimageholder, 20)

	xflow_viewermainimage.onclick = function()
	{
		// maybe show some exif info?
	}


}

function XFLOW_getBrowserInfo()
{
	var browser = new Array();

	if( typeof( window.innerHeight ) == 'number' ) 
	{
		browser['W'] = window.innerWidth;
		browser['H'] = window.innerHeight;
	} 
	else 
	{
		browser['W'] = document.documentElement.clientWidth;
		browser['H'] = document.documentElement.clientHeight;
	}

	return browser;
}

function XFLOW_setControls()
{
	xflow_viewerprevimage.style.top = xflow_viewermainimage.offsetHeight + 'px'
	xflow_viewerprevimage.style.left = xflow_viewermainimage.offsetLeft + 10 + 'px'
	xflow_viewernextimage.style.top = xflow_viewermainimage.offsetHeight + 'px'
	xflow_viewernextimage.style.left = xflow_viewermainimage.offsetLeft + xflow_viewermainimage.offsetWidth - 34 + 'px'
	xflow_viewercloseimage.style.top = xflow_viewermainimage.offsetHeight + 'px'
	xflow_viewercloseimage.style.left = xflow_viewermainimage.offsetLeft + (xflow_viewermainimage.offsetWidth / 2) - (12) + 'px'
}

function XFLOW_viewerDisplay(val)
{
	if(val == 'show')
	{
		xflow_imageviewer.style.display				= "none";
		xflow_viewerloadingimage.style.display		= "none";
		xflow_viewerimageholder.style.display		= "block";
		xflow_viewermainimage.style.display			= "block";
		xflow_viewercontrols.style.display			= "block";
		xflow_viewertext.style.display				= "block";
		xflow_imageviewer.style.display				= "block";
		xflow_vieweropen = true;
	}
	if(val == 'hide')
	{
		xflow_viewerloadingimage.style.display		= "none";
		xflow_viewerimageholder.style.display		= "none";
		xflow_viewermainimage.style.display			= "none";
		xflow_viewercontrols.style.display			= "none";
		xflow_viewertext.style.display				= "none";
		xflow_imageviewer.style.display				= "none";
		xflow_vieweropen = false;
	}
	if(val == 'loading')
	{
		xflow_viewerloadingimage.style.display		= "block";
		xflow_viewerimageholder.style.display		= "none";
		xflow_viewermainimage.style.display			= "none";
		xflow_viewercontrols.style.display			= "none";
		xflow_viewertext.style.display				= "none";
		xflow_imageviewer.style.display				= "block";
		xflow_vieweropen = true;
	}
}

function XFLOW_closeViewer()
{
	XFLOW_AnimateOpac(0, 100, xflow_viewerimageholder, 20, 'XFLOW_viewerDisplay("hide")')
}

/* Change opacity for image (cross browser) */
function XFLOW_changeOpac(opacity, obj) 
{
/*
	var object = obj.style;
	object.opacity = (opacity / 100);
	object.MozOpacity = (opacity / 100);
	object.KhtmlOpacity = (opacity / 100);
	object.filter = "alpha(opacity=" + opacity + ")";
*/
}

/* Aminate opacity for object, and call a function when complete */
function XFLOW_AnimateOpac(target, opacity, obj, steps, func)
{
	if(!obj.id) obj = document.getElementById(obj);
	target = parseFloat(target);
	opacity = parseFloat(opacity);
	steps = parseFloat(steps);

	XFLOW_changeOpac(opacity, obj)

	if(opacity < target)
	{
		opacity += steps;
		setTimeout("XFLOW_AnimateOpac('"+target+"', '"+opacity+"', '"+obj.id+"', '"+steps+"', '"+func+"')", 1);
	}
	else if(opacity > target)
	{
		opacity -= steps;
		setTimeout("XFLOW_AnimateOpac('"+target+"', '"+opacity+"', '"+obj.id+"', '"+steps+"', '"+func+"')", 1);
	}
	else
	{
		clearTimeout();

		if(func != 'undefined') 
		{
			eval(func)
		}
	}

}

/* Main function */
function XFLOW_refresh(onload)
{
	/* Cache document objects in global variables */
	xflow_div = XFLOW_getByClassName(xflow_div);
	img_div = XFLOW_getByClassName(xflow_images);
	scrollbar_div = XFLOW_getByClassName(xflow_scrollbar);
	slider_div = XFLOW_getByClassName(xflow_slider);
	caption_div = XFLOW_getByClassName(xflow_captions);
	xflow_helplayer = XFLOW_getByClassName(xflow_helplayer);

	// get xflow_imageviewer objects
	xflow_imageviewer = XFLOW_getByClassName("xflow_imageviewer");
	xflow_viewerimageholder = document.getElementById("xflow_viewerimageholder");
	xflow_viewerloadingimage = XFLOW_getByClassName("xflow_viewerloadingimage");
	xflow_viewermainimage = document.getElementById("xflow_viewermainimage");
	xflow_viewertext = document.getElementById("xflow_viewertext");
	xflow_viewercode = document.getElementById("xflow_viewercode");
	xflow_viewercontrols = document.getElementById("xflow_viewercontrols");
	xflow_viewernextimage = document.getElementById("xflow_viewernextimage");
	xflow_viewercloseimage = document.getElementById("xflow_viewercloseimage");
	xflow_viewerprevimage = document.getElementById("xflow_viewerprevimage");
								
	/* Cache global variables, that only change on XFLOW_refresh */
	images_width = img_div.offsetWidth;
	images_top = xflow_div.offsetTop + 70;
	images_left = xflow_div.offsetLeft;
	max_xflow_focus = xflow_focus * xflow_xstep;
	size = images_width * 0.5;
	scrollbar_width = images_width * 0.6;
	xflow_slider_width = xflow_slider_width * 0.3;
	max_height = images_width * 0.5;

	/* Change images div properties */
	img_div.style.height = images_width * 0.330 + 'px';
    
	 // IE fix !
    if(IE){
	 slider_div.style.left = 0 + 'px';
	 XFLOW_getByClassName(xflow_barleft).style.left = -27 + 'px'
	 XFLOW_getByClassName(xflow_barright).style.right = -47 + 'px'
	}else{
	 scrollbar_div.style.marginLeft = images_width * 0.2 + 'px';
	}

	// centralise the bar a little more! 
	scrollbar_div.style.left = -10 + 'px';
	
	scrollbar_div.style.width = scrollbar_width + 'px';

	/* Set slider attributes */
	slider_div.onmousedown = function () { XFLOW_dragStart(this); };
	slider_div.style.cursor = xflow_slider_cursor;

	slider_div.innerHTML="<a href=\"javascript:void(1);\" title=\"Move images\">&#124;&#124;&#124;</a>";

	// create left / right move actions for slider ends 
	XFLOW_getByClassName(xflow_barleft).innerHTML="<a href=\"javascript:XFLOW_handle(1);\" title=\"Move left\">&#171;</a>";
	XFLOW_getByClassName(xflow_barright).innerHTML="<a href=\"javascript:XFLOW_handle(-1);\" title=\"Move right\">&#187;</a>";


	/* Cache EVERYTHING! */

	XFLOW_loadImagesToArray();

	var i = 0;
	for (var index = 0; index < xflow_max; index++)
	{ 
		var image = xflow_imgarray[index];
		if (image.nodeType == 1)
		{
			xflow_array_images[i] = index;
			
			/* Set image onclick by adding i and x_pos as attributes! */
			image.onclick = function() { XFLOW_glideTo(this.x_pos, this.i); }
			image.x_pos = (-i * xflow_xstep);
			image.i = i;
			
			/* Add width and height as attributes ONLY once onload */
			if(onload == true)
			{
				image.w = image.width;
				image.h = image.height;
				// added for landscape and portrait!
			    image.defWidth = (image.width / 2);
			}

			image.url = XFLOW_str_replace("thumbs/", "", image.src);

			/* Set ondblclick event */
			image.ondblclick = function() { /* do something here! */ }

			/* Set image cursor type */
			image.style.cursor = xflow_images_cursor;

			i++;
		}
	}
	xflow_max = xflow_array_images.length;

	/* Display images in current order */
	XFLOW_moveTo(xflow_current);
	XFLOW_glideTo(xflow_current, xflow_caption_id);

	XFLOW_extras(1);
}

/* Show/hide element functions */
function XFLOW_show(id)
{
	var el = XFLOW_getByClassName(id);
	if(el)
	{
		el.style.visibility = 'visible';
	}
}

function XFLOW_hide(id)
{
	var el = XFLOW_getByClassName(id);
	if(el)
	{
		el.style.visibility = 'hidden';
		el.style.display = 'none';
	}
}

/* Handle the wheel angle change (delta) of the mouse wheel */
function XFLOW_handle(delta, ret)
{
	var change = false;
	switch (delta > 0)
	{
		case true:
			if(xflow_caption_id >= 1)
			{
				xflow_target = xflow_target + xflow_xstep;
				xflow_new_caption_id = xflow_caption_id - 1;
				change = true;
			}
			break;

		default:
			if(xflow_caption_id < (xflow_max-1))
			{
				xflow_target = xflow_target - xflow_xstep;
				xflow_new_caption_id = xflow_caption_id + 1;
				change = true;
			}
			break;
	}
	
	if (xflow_vieweropen)
	{
		XFLOW_viewerImage(xflow_new_caption_id, false);
	}

	/* Glide to next (mouse wheel down) / previous (mouse wheel up) image */
	if (change == true)
	{
		XFLOW_glideTo(xflow_target, xflow_new_caption_id);
	}
	
 if(ret) return xflow_new_caption_id;
}

/* Event handler for mouse wheel event, also will capture and move xflow_imageviewer accordingly */
function XFLOW_wheel(event)
{
	var delta = 0;
	if (!event) event = window.event;
	if (event.wheelDelta)
	{
		delta = event.wheelDelta / 120;
	}
	else if (event.detail)
	{
		delta = -event.detail / 3;
	}


	if (delta)
	{
		var n = XFLOW_handle(delta, true);

		if (xflow_vieweropen)
		{
			XFLOW_viewerImage(n, false);
		}
	}
	if (event.preventDefault) event.preventDefault();
	event.returnValue = false;
}

/* Initialize mouse wheel event listener */
function XFLOW_initMouseWheel()
{
	if(window.addEventListener) xflow_div.addEventListener('DOMMouseScroll', XFLOW_wheel, false);
	xflow_div.onmousewheel = XFLOW_wheel;
}

/* This function is called to drag an object (= slider div) */
function XFLOW_dragStart(element)
{
	xflow_dragobj = element;
	xflow_dragx = xflow_posx - xflow_dragobj.offsetLeft + xflow_new_slider_pos;
}

/* This function is called to stop dragging an object */
function XFLOW_dragStop()
{
	xflow_dragobj = null;
	xflow_dragging = false;
}

/* This function is called on mouse movement and moves an object (slider div) on user action */
function XFLOW_drag(e)
{
	xflow_posx = IE ? window.event.clientX : e.pageX;

	if(xflow_dragobj != null)
	{
		xflow_dragging = true;
		xflow_newposx = (xflow_posx - xflow_dragx) + xflow_slider_width;

		/* Make sure, that the slider is moved in proper relation to previous movements by the XFLOW_glideTo function */
		if(xflow_newposx < ( - xflow_new_slider_pos)) xflow_newposx = - xflow_new_slider_pos;
		if(xflow_newposx > (scrollbar_width - xflow_new_slider_pos)) xflow_newposx = scrollbar_width - xflow_new_slider_pos;
		
		var slider_pos = (xflow_newposx + xflow_new_slider_pos);
		var step_width = slider_pos / ((scrollbar_width) / (xflow_max-1));
		var image_number = Math.round(step_width);
		var new_target = (image_number) * -xflow_xstep;
		var xflow_new_caption_id = image_number;

		xflow_dragobj.style.left = xflow_newposx + "px";
		XFLOW_glideTo(new_target, xflow_new_caption_id);
	}
}

/* Initialize mouse event listener */
function XFLOW_initMouseDrag()
{
	document.onmousemove = XFLOW_drag;
	document.onmouseup = XFLOW_dragStop;
}

function XFLOW_getKeyCode(event)
{
	event = event || window.event;
	return event.keyCode;
}

/* Capture keyboard actions */
document.onkeydown = function(event)
{
	var charCode  = XFLOW_getKeyCode(event);
	//window.status = charCode;

	switch (charCode)
	{
		/* Right arrow */
		case 39:
			XFLOW_handle(-1);
			break;
		
		/* Left arrow */
		case 37:
			XFLOW_handle(1);
			break;

		/* Enter */
		case 13:
			if (xflow_vieweropen)
			{
				XFLOW_closeViewer();
			}
			else
			{
				XFLOW_openViewer(document.getElementById(xflow_new_caption_id));

			}
			break;
	}
}

/* Convert textual links to actual urls */
function XFLOW_convertURL(text)
{
	if( !text ) return text;
	text = text.replace(/((https?\:\/\/|ftp\:\/\/)|(www\.))(\S+)(\w{2,4})(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/gi,function(url){
	nice = url;
	if( url.match('^https?:\/\/') )
	{
		nice = nice.replace(/^https?:\/\//i,'')
	}
	else
		url = 'http://'+url;
		return '<a href="'+ url +'">'+ nice.replace(/^www./i,'') +'</a>';
	});
	return text;
}

/* XFLOW_refresh xflow on window resize */
window.onresize = function()
{
	if(XFLOW_getByClassName('xflow'))
	{
		//XFLOW_refresh();
	}
}

/* start code */
//XFLOW_addLoadEvent(XFLOW_init);