/* This script is a common Mootools Essential script that should be linked
/ to by any other CMSLite or Web and Go sites that want to use the same functionality.
/ By default, this will be linked to when a new site is created in either CMSLite or Web and Go.
/ See mootools-release-1.11.js for more information
*/

//All functions below make use of the Mootools library
//----------------------------------------------------

//Function :: Darken Screen
function darkenScreen(){	
	if(!$("div_darkenScreen")){
		var ds = new Element("div",{
			"styles" : {
				"color" : "#ffffff",
				"background-color" : "#000000",
				"opacity" : 0.5,
				"width" : window.getScrollWidth()-(window.ie6?21:0)+"px",
				"height" : window.getScrollHeight()+"px",
				"position" : "absolute",
				"z-index"  : 2,
				"top" : "0px",
				"left" : "0px"
			},
			"id" : "div_darkenScreen"
		});
		ds.inject(document.body);
	}
}

//Function :: Removes the darkenScreen effect
function lightenScreen(){
	if($("div_darkenScreen")){
		$("div_darkenScreen").remove();
	}
}

//Function :: Create a popup content window
//Place the class "updateLink" on any links in the content that you want to
//have print inside the window too...

//Two functions related to popupContent();
var popupContent = function(obj,width,height,isWhat,isExt,siteLocation,isEmbed){

	//Have we passed in an object to obtain the href or have we passed in
	//a direct link to the item we want to view
	if(typeof(obj) == "object"){
		url = obj.href;
	} else {
		//Url must be directly to a script that prints the image
		url = obj;
	}

	//Prepend the Homepage URL to run the dynamic viewer
	url = url.replace(/\//g,"¬");
	url = "/goto/inc"+(siteLocation=="admin"?"share":"")+"/dynamicview/"+url;

	//Append Ajax flag?
	//This lets the CMS know that the url is being called via an Ajax call.
	if(url.indexOf("?") > -1){
		url = url+"&ajax=1";
	} else {
		url = url+"?ajax=1";
	}

	//Append Embed Flag?
	//The Embed flag is different to the Ajax flag as it is optional when running
	//the PHP functions. If the Embed flag is set, it tells the CMS not to include the
	//main core template around the content (if the content being called is HTML).
	//Instead, it will include a very basic BODY/HEAD tag with relevant stylesheets.
	if(isEmbed == 1){
		url = url+"&embed=1";
	}

	//Are we embedding Audio or Video?
	if(isWhat == "audio" || isWhat == "video"){
		if(isExt == "flv" || isExt == "mp3"){		
			popupContentFinish = function(){
				var mediafile = document.getElementById("media_filename").value;
				playMedia(
					"div_popupContentInner",
					width,
					height,
					mediafile,
					"",
					"eeeeee",
					"000000",
					"fafafa",
					"aaaaaa",
					"ffffff"
				);
			}
		}
	}

	//Are we showing content within a popup window?(need to fix ie bug) 
	//If running this inside a browser popup window, you MUST pass in the size
	//of the popup Window as for some reason, IE doesn't understand and doesn't
	//get the Width/Height of the window it's inside.
	var topOffset	= 0;
	var leftOffset	= 0;
	if(isWhat == "inPopup"){
		if(window.ie){
			topOffset = 160;
			leftOffset = 220;
		}
	}
		

	//Verify Dimensions	
	width2	= width==null?400:width;
	width2	= width2 < 150?150:width2;
	width2	= (width2 > window.getWidth()?(window.getWidth()-100):width2);
	width2 += 30;

	height2	= height==null?490:height;
	height2	= height2 < 20?20:height2;
	height2	= height2 > 490?490:height2;
	height2 += 50;
	

	//Hide Popup Window if already exists.	
	popupContentHide();
	darkenScreen();
	
	//Create new Popup
	var pc = new Element("div",{
		"styles" : {
			"color"				: "#000000",
			"background-color"	: "#ffffff",
			"width"				: width2+($("htmliframe")?20:0)+"px", //takes into account vertical scrollbar width for IE
			"height"			: height2+"px",
			"position"			: "absolute",
			"z-index"			: 3,
			"top"				: ((window.getHeight() - height2) / 2)+window.getScrollTop()+topOffset+"px",
			"left"				: ((window.getWidth() - width2) / 2)+window.getScrollLeft()+leftOffset+"px",
			"opacity"			: 0,
			"padding"			: "5px"
		},
		"id" : "div_popupContent"
	});
	pc.setHTML("<div style='background-color:#000000;font-size:11px;font-weight:bold;border:1px solid #ffffff;text-align:right;padding:5px;margin-bottom:5px;'><a href='#' style='color:#ffffff;background-color:#000000;' onclick='popupContentHide();return false;'>Close Window (x)</a></div><div id='div_popupContentInner' style='background-repeat:no-repeat;background-position:center center;overflow:hidden;height:"+(height2-30)+"px;width:"+(width2-2)+"px;'></div>");
	pc.inject(document.body);
	var fx = new Fx.Styles(pc, {duration:500, wait:false});
	fx.start({
		"opacity" : 1
	}).addEvent("onComplete",function(){
		popupContentLoad(url,width2,height2);		
	});
}
var popupContentFinish	= function(){}
var popupContentHide	= function(){
	if($("div_popupContent")){
		
		if($("moviecontainer")){
			$("moviecontainer").setHTML("&nbsp;");
			$("moviecontainer").empty();
			$("moviecontainer").remove();
		}
		
		if($("div_popupContentInner")){
			$("div_popupContentInner").empty();
		}
		$("div_popupContent").remove();
	}
	lightenScreen()
;}

var popupContentLinks	= function(){
	var list = $$("#div_popupContentInner a.updateLink");
	list.each(function(element){
		element.addEvent("click",function(e){
			e = new Event(e).stop();
			popupContentLoad(this.getProperty("href"));
		});
	});
}

var popupContentLoad = function(url,width2,height2){

	//Loading...
	$('div_popupContentInner').empty();
	$('div_popupContentInner').setStyles({
		"background-image" : "url('http://admin.inco-cmslite.net/images/spinner.gif)"
	});

	var goUrl = new Ajax(url, {
		method: 'get',
		update: $('div_popupContentInner'),
		onComplete: function(){

			$('div_popupContentInner').setStyles({
				"width"		: (width2-2)+"px",
				"height"	: (height2-30)+"px"
			});
				
			//Remove Loading
			$('div_popupContentInner').setStyle("background-image","none");

			//Resize iFrame if required.
			if($('htmliframe')){
				$('htmliframe').setStyle("height",((height2-30)+"px"));				
			} else {
				$('div_popupContentInner').setStyle("overflow","auto");
			}
			
			//Run any javascript that needs to be done AFTER content is embedded.
			popupContentFinish();
			//Then clear it
			popupContentFinish = function(){};
			//Update links on ajax result
			popupContentLinks();
		}
	});
	goUrl.request();
}

//Slideshow Handler
function slideShowHandler(id,imagesList){

	//Preload the images!
	if(document.images){
		var iList2 = new Object;
		var i = 0;
		for(i=0; i<=imagesList.length; i++) {
			iList2["i"+i] = new Image;
			iList2["i"+i].src = imagesList[i];
		}
	}

	this.id					= id;
	this.imgid				= $(this.id).getElementsBySelector("img")[0];
	this.imagesList			= imagesList;
	this.sliderota_count	= 1;
	this.sliderota_timer	= null;

	$(this.id).setStyles({
		"background-image"	: "url("+this.imgid.getProperty("src")+")",
		"height"			: this.imgid.getProperty("height")+"px",
		"width"				: this.imgid.getProperty("width")+"px"
	});
	this.imgid.setOpacity(0);			

	this.launch = function(milsec) {
		this.tabrota_timer = this.doRotate.periodical(milsec,this);
	}

	this.doRotate = function(){
		this.sliderota_count += 1;		
		var ni		= this.imagesList[this.sliderota_count-1];	
		var fx		= new Fx.Styles(this.imgid, {duration:2000, wait:false});
		var id		= this.id;
		var imgid	= this.imgid;

		this.imgid.setProperty("src",ni);
		fx.start({
			"opacity" : 1
		}).addEvent("onComplete",function(){
				$(id).setStyle("background-image","url("+imgid.getProperty("src")+")");
				imgid.setOpacity(0);
		});
		if(this.sliderota_count == this.imagesList.length){
			this.sliderota_count=0;
		}			
	}
}

//Makes sure that any images with a width of over 340px are surrounded with a DIV tag
//that has "overflow:hidden" property so that the size can shrink in size without
//images overlapping it.
//
// @containerDIV	string	Id of element (start it with a # to identify it as id).
//										   eg  #tpl_page
function fixImageWidths(containerDIV){
	if(containerDIV){
		var list = $$(containerDIV+" img");
		var imgbord = new Element("div",{
			"styles" : {
				"overflow" : "hidden",
				"width" : "auto"
			}
		});
		list.each(function(element) {
			imgbord2 = imgbord.clone();

			if(element.hasClass("floatright")){
				imgbord2.addClass("floatright");
				element.removeClass("floatright");
			}

			if(element.hasClass("floatleft")){
				imgbord2.addClass("floatleft");
				element.removeClass("floatleft");
			}

			imgbord2.injectBefore(element);
			element.injectInside(imgbord2);
		});
	}
}

//Thumbnail Scroller
//Will scroll images from left to right constantly within the div specified.
//
//@containerId	string	Name of the Id to convert into scroller. (Will check it for all
//images and use them in the scrolling process.
//@containerWidth	string	Width of the container (including % or px unit)
function thumbnailScroller(containerId,containerWidth){

	if(!containerId){
		alert("No containerId specified for Thumbnail Scroller");
		return false;
	}

	if(!containerWidth){
		containerWidth = "100%";
	}

	var sGal				= new Object();
	sGal.imageGap			= 2; //Pixel space between images
	sGal.totalImageWidth	= 0;

	//Get List of images to scroll								
	sGal.list	= $$("#"+containerId+" img");
	sGal.images	= Array();									
	sGal.list.each(function(element) {
		element.setStyles({
			"margin"		: "0px",
			"padding"		: "0px",
			"border-right"	: sGal.imageGap+"px solid #ffffff"
		});
		sGal.images.push(element);
		sGal.totalImageWidth	+= (element.getSize().scrollSize.x+sGal.imageGap);
	});

	//Get initial padding for first image movement
	sGal.padFix	= sGal.images[0].getSize().scrollSize.x+sGal.imageGap;

	//Only launch scroller if images width greater than frame (and will hide swap)
	sGal.innerFrame = $(containerId);

	if(sGal.innerFrame.getSize().scrollSize.x < sGal.totalImageWidth){

		//Create outer frame
		sGal.outerFrame	= new Element("div",{
			"styles" : {
				"overflow"		: "hidden",
				"border-top"	: "1px solid #aaaaaa",
				"border-bottom"	: "1px solid #aaaaaa",
				"padding"		: "2px 0px 2px 0px",
				"width"			: containerWidth,
				"margin"		: "0px auto 0px auto"
			}
		});

		//Update inner width
		sGal.innerFrame.setStyles({
			"width"			: "9999px",
			"padding"		: "0px",
			"margin"		: "0px"
		});										

		//Create Listener										
		sGal.listener	= function(){										
			if((sGal.scrollHandler.now[0]-15) > sGal.padFix){

				//Get first + last image objects
				var first	= sGal.images.shift();
				var firstW	= sGal.images[0].getSize().scrollSize.x;
				var last	= sGal.images[(sGal.images.length-1)];

				//Move Image from front to back											
				sGal.images.push(first);
				first.injectAfter(last);
				
				//Increase padding to make up for removed image
				sGal.innerFrame.setStyle("padding-left",sGal.padFix+"px");

				//Grab next image width
				sGal.padFix	+= firstW+sGal.imageGap;				
			}
		}

		//Create scroll animation
		sGal.outerFrame.addEvent("scroll",sGal.listener);

		sGal.outerFrame.injectBefore(sGal.innerFrame);
		sGal.innerFrame.injectInside(sGal.outerFrame);

		sGal.scrollHandler = new Fx.Scroll(sGal.outerFrame,{
			'transition':Fx.Transitions.linear,
			'duration':500000,
			'wheelStops':false
		});
		sGal.scrollHandler.scrollTo(50000,0);
	}
}