if(FUTURE_GLOBAL_PAGEJS == "gallery" ){

	function galleryLoader()
	{
		if ($("gallery_items"))
		{
			var selectedIndex = (url.split("mid=")[1])? url.split("mid=")[1]-1 : 0; // We'll need this shortly.
			$("arrow_left").addEvent('click', function(evt){
				new Event(evt).stop();
				initiateMoveGallery("left");
				this.blur();
				return false;
			}.bindWithEvent($("arrow_left")));
			$("arrow_right").addEvent('click', function(evt){
				new Event(evt).stop();
				initiateMoveGallery("right");
				this.blur();
				return false;
			}.bindWithEvent($("arrow_right")));
			var imgThumbs = $$("#gallery_items img");
			var imgThumbLinks = $$("#gallery_items a");
			for (i=0; i<imgThumbs.length; i++)
			{
				imgThumbs[i].imgIndex = i;
				imgThumbs[i].addEvent('click', function(evt)
				{
					new Event(evt).stop();
					updateSelectedImage(this.imgIndex);
					return false;
				}.bindWithEvent(imgThumbs[i]));
				if (selectedIndex != 0) {
					if (imgThumbLinks[i].href.split("mid=")[1] == selectedIndex) {
						changeGalleryPosition(i);
					}
				}
			}
			if (selectedIndex == 0) {
				changeGalleryPosition(0);
				$("arrow_left").style.display = "none";   
			}
			if ($("closure_link"))
			{
				$("closure_link").addEvent('click', function(evt)
				{
					new Event(evt).stop();
					window.close();
				}.bindWithEvent($('closure_link')));
			}
		}
	}

	var imgWidth = 65; // This means the scroller functionality only works when the images are the same width. Boo.
	var displayedImgs = 4; // This is the number of images we display in the scroller at once.
	var bigImgWidth = 850;
	
	var speed = 40;
	var alreadyLoaded = false;
	
	var n = 0;
	var position = 0;
	var middleIndex = 2;
	var oldIndex = 0;
	var newIndex = 0;
	var leftmostThumb = 0; // Between 0 and the number of images-1, ie 0-11 for a 12-thumbnail gallery
	var url = window.location.href;
	var selectedIndex = (url.split("img=")[1])? url.split("img=")[1]-1 : 0; //need to be the index and not the img number


	//Change the gallery position according to the new selectedIndex value
	function changeGalleryPosition(index,arrowShift){
		if (typeof arrowShift == "undefined") arrowShift = 0;
		if ($("gallery_items"))
		{
			var imgList = $$("#gallery_items img");
			if(imgList.length > displayedImgs){
				var maxScroll = imgList.length-displayedImgs;

				
				direction=0;
				if (arrowShift == 0) {
					if (leftmostThumb > 0) {
						if ((index-leftmostThumb) < (displayedImgs/2)) {
							direction=-1;
						}
					}
					if (leftmostThumb < maxScroll) {
						if ((index-leftmostThumb) > (displayedImgs/2)) {
							direction=1;
						}
					}
				} else {
					direction = arrowShift;
				}
				leftmostThumb+=direction;

				//Manage arrows display
				if(leftmostThumb==0){
					$("arrow_right").style.display = "block";
					$("arrow_left").style.display = "none";   
				}else if(leftmostThumb == maxScroll){
					$("arrow_left").style.display = "block";
					$("arrow_right").style.display = "none";  
				}else{
					$("arrow_right").style.display = "block";
					$("arrow_left").style.display = "block";
				}
				imgElList = $$("#gallery_items img");
				
				if (direction==0) { return false; }
				var newX = - (imgWidth * leftmostThumb);
				var slideThumbs = new Fx.Style($("gallery_items"), 'margin-left', {wait: false, duration: 1000, transition: Fx.Transitions.Quad.easeOut});
				slideThumbs.start(newX);
				position = newX;
				oldIndex = index;
				return false;
			}else{
				$("arrow_right").style.display = "none";
				$("arrow_left").style.display = "none";   
				return false;
			}
		}
	}

	//Generate by an onclick on the arrows link
	//This function initiate (if it is necessary) the gallery move to right direction
	function initiateMoveGallery(direction){
	    if(direction == "left"){
	        newIndex--;
	    }else{
	        newIndex++;
	    }
	     var imgList = $$("#gallery_items img");
	
	    if (((leftmostThumb > 0) && (direction == "left")) || ((leftmostThumb < imgList.length-displayedImgs) && (direction=="right"))) {
	        changeGalleryPosition(newIndex,(direction=="right" ? 1 : -1));
	        oldIndex = newIndex;
	    }
	}
	
	//Generate by an onclick on a thumbnail
	//This function initiate (if it is necessary) the gallery move to right position
	function updateSelectedImage(index){
	    alreadyLoaded = false;
	
		newIndex = selectedIndex;
		selectedIndex = middleIndex = index;
		if(middleIndex < 2){middleIndex = 2;}
		if(newIndex != index){
			fadeImageOutIn("image_container",$$("#gallery_items img")[selectedIndex].src);
		}
	
		var imgList = $$("#gallery_items img");
	
		$$("#gallery_items li")[newIndex].className = "";
		$$("#gallery_items li")[index].className = "slc";
	
		if($("gallery_top")){
			$$("#gallery_top h2")[0].innerHTML = $$("#gallery_items a")[selectedIndex].title;
		}
		if($("gallery_caption")){
			$("gallery_caption").innerHTML = $$("#gallery_items img")[selectedIndex].alt;
		}
		if($("gallery_pagination")){
			$("gallery_pagination").innerHTML = "Showing "+(Number(selectedIndex)+1)+" of "+imgList.length;
		}
		changeGalleryPosition(index);
	
	    if(tempImg == undefined){
			var tempImg = new Element('img');
			divId = "image_container";
			var myFx = new Fx.Style(divId, 'opacity', {wait: false, duration: 500, transition: Fx.Transitions.Quad.easeOut});
			tempImg.onload = function(){
				alreadyLoaded = true;
				myFx.set(0);
				setTimeout(function(){
					$(divId).src = tempImg.src;
					myFx.start(0,1)
				},500);
			}
		}
	    if(newIndex != index){
	    	var regex = /(.*)-[0-9]{1,4}-([0-9]{1,3}).([a-zA-Z]{3}$)/gi
	        tempImg.src = $$("#gallery_items img")[selectedIndex].src.replace(regex , "$1-"+bigImgWidth+"-$2.$3");
	        // Soon, we might have an upscaling prevention mechanism on mos. In anticipation of this:
	        //tempImg.src = document.getElementById("gallery_items").getElementsByTagName("img")[selectedIndex].src.replace(regex , "$1-"+bigImgWidth+"-$2-noupscale.$3");
	    }                   
	    return false;
	}
	
	//Bring the opacity of an element from 0 to 100
	function fadeImageOutIn(divId,newSrc){                  
	    timer =  0;
	    var divOpacity = new Fx.Style(divId, 'opacity', {wait: false, duration: 500, transition: Fx.Transitions.Quad.easeOut});
		divOpacity.start(1,0);
	    setTimeout(function(){displayLoader(divId)},500);
	    timer++;                
	}
	
	//Change the src of the main image to display the loader
	function displayLoader(divId){
	    if(alreadyLoaded == false){
	        $(divId).src = '/default/img/gallery/imloading.gif';
			var myFx = new Fx.Style(divId, 'opacity').set(1);
	    }           
	}
	addWindowOnLoadEvent(function(){galleryLoader()});
	addWindowOnLoadEvent(function(){changeGalleryPosition(selectedIndex)}, "wrapper");

}