/* special sfx styles */
var sfx = {
	
	slideClass   : "slide",
	slidePixels  : 200,
	slideSpeed   : 100,
	slideDeacc	 : 2,
	slideStarted : false,
	slideSpeedUp : false,
	slideCurrent : 0,
	slideCallback: null,

	/* amount in percentage*/
	fadePixels   : 2, // px
	maxOpacity   : 100,
	fadeQue    : [], // stores queued objs for fading
	
	// stores objects that will slide open
	expandersArray : [],
	
	/* ************************************
	parentObj is the container for slides
	x = the slide number 0-9...
	************************************ */
	slidePan : function(sliderObj, x)
	{
		//	stores collected slides
		var slides 		= [];
		var movePixels  = sfx.slidePixels;
		var speed = sfx.slideSpeed;

		// start the sliding effect
		sfx.slideStarted = true;
		
		//	get slides
		slides = dom.byClass(sfx.slideClass, sliderObj);
		if((slides && (x < slides.length))){
			
			// get the width of a single slide
			var slideWidth  = slides[0].offsetWidth;
			var curMargin 	= dom.getMargin(sliderObj); // returns NEGATIVE value
			var gotoMargin  = -(x * slideWidth); 		// sets NEGATIVE value
			var contSliding = false;
			var pixels = 0;
			
			
			//alert("Pos: " + x + "\nCurrent Margin: " + curMargin + "\nGo Margin: " + gotoMargin);
			
			// add speed up on further away objects
			if(sfx.slideSpeedUp){
				if(x > (sfx.slideCurrent + 2) || x < (sfx.slideCurrent - 2)){
					movePixels = sfx.slidePixels * 2;
					speed = sfx.slideSpeed / 2 ;
				}
			}
			
			if( curMargin > gotoMargin ){
				//	move slide left
				contSliding = true;
				if( Math.abs((gotoMargin - curMargin)) < sfx.slidePixels){
					movePixels = Math.ceil(Math.abs((gotoMargin - curMargin)) / sfx.slideDeacc);
				}
				sliderObj.style.marginLeft = (curMargin - movePixels) + "px"  ;
			}
			else if(curMargin < gotoMargin){
				// move slide right
				contSliding = true;
				if( Math.abs(curMargin - gotoMargin) < sfx.slidePixels ){
					movePixels = Math.ceil(Math.abs((curMargin - gotoMargin)) / sfx.slideDeacc);
				}
				sliderObj.style.marginLeft = (curMargin + (movePixels) + "px")  ;
				
			}
			else{
				// sliding has stopped. continue
				sliderObj.style.marginLeft = gotoMargin + "px";
				sfx.slideCurrent = x;
				contSliding = false;
				sfx.slideStarted = false;
				sfx.slideSpeedUp = false;
				if (sfx.slideCallback) {
					eval(sfx.slideCallback);
				}
			}
			
			if(contSliding){
				setTimeout(function(){ sfx.slidePan( sliderObj , x) }, speed );
			}
			
		}
	},
	
	
	/* *********************************************
	Moves the slide.  Ensures that slide is not 
	currently sliding, otherwise error is caused
	********************************************* */
	slideStart : function(sliderObj, x)
	{
		if (!sfx.slideStarted) {
			sfx.slidePan(sliderObj, x);
			return true;
		}
		else{
			return false;
		}
	},
	
	
	/* *********************************************
	move directly to a slide without sliding,
	fading is optional
	********************************************* */
	slideGoto : function(sliderObj, x, fade)
	{
		//if(fade){
			// fade in and out of each slide
		//}
	},


	/* *********************************************
	gets opacity of object, inline stlye or by class
	********************************************* */
	getOpacity : function( obj, fromClass )
	{
		// add code to tes for computerize style:getClassStyle
		// get opacity from inline style
		if( !fromClass ){
			var value = parseFloat(obj.style.opacity);

			// if opacity is not set
			if(isNaN(value)){
				sfx.setOpacity(obj, sfx.maxOpacity);
				return sfx.maxOpacity;
			}
			return Math.floor( value * 100 );
		}
		
	},
	
	
	/* *********************************************
	set opacity of oject via inline style
	********************************************* */
	setOpacity : function( obj, value )
	{
		if( obj ){
			obj = obj.style;
			obj.opacity 	 =  (value / 101);  // bug fix for FF
			obj.MozOpacity 	 =  (value / 101);  // bug fix for FF
			obj.KhtmlOpacity =  (value / 100); 
			obj.filter = "alpha(opacity=" + value + ")"; 
		}
	},
	
	//	IE bug, fading will not work if width is not set!
	fade : function( obj, to, px )
	{
		// IE bug, width and height needs to be set on objs
		if( obj.tagName != "IMG" && document.all ){
			if( obj.style.width == "" || obj.style.height == "" ){
				obj.style.width = obj.offsetWidth - 10 ;
				obj.style.height = obj.offsetHeight - 10;
			}
		}	
		
		var op = sfx.getOpacity(obj);
		
		// set the amount of pxiels to afe at a time
		if(!px){
			px = sfx.fadePixels;	
		}
		
		if(op >= 0 && op <= sfx.maxOpacity){
			
			var nodes = dom.byTag("*", obj );
			
			//fade out	
			if(op > to){
				
				// ensure it doesnt exceed 'to'
				if( (op - px) < to ){
					px = to;	
				}	
				
				// insure that all chid nodes fade too, safari fix
				sfx.setOpacity( obj, (op - px) );
				for(var n = 0; n < nodes.length; n++ ){
					sfx.setOpacity( nodes[n], (op - px) );
				}
				
			} // fade in
			else if(op < to){
				
				// ensure it doesnt exceed 'to'
				if((op + px) > to ) {
					px = 1 ;
					op = to;
				}
				// make sure child nodes fade too
				sfx.setOpacity( obj, (op + px) );
				
				for(var n = 0; n < nodes.length; n++ ){
					sfx.setOpacity( nodes[n], (op + px) );
				}
			}
			// continue fade looping
			if( op != to ){ 				
				setTimeout( function() {sfx.fade( obj, to, px )}, 10);
			}// stop looping
			else{
				return true;	
			}
 		}
	},
	
	/* *********************************************
	simple hde show siwtching for objects
	newCntent is for new internal content on the same obj
	********************************************** */
	fadeSwitch : function( objToHide, objToShow, px, loop ){
		
		if(!loop){
			sfx.fade(objToHide, 0, px);
		}
		if( sfx.getOpacity( objToHide) != 0 ){
			
			// continue checking, to start showing of new object
			setTimeout(function(e){
					sfx.fadeSwitch(objToHide, objToShow, px, true);
				}, 5)
			
		}else{
			// hide object is hidden
			sfx.hide(objToHide);
			sfx.show(objToShow, true, px);
		}
	},
	
	
	/* *********************************************
	simple fade and show of object
	********************************************** */
	show : function(obj, fade, px)
	{
		
		if( fade ){
			sfx.setOpacity(obj, 0);
		}
		dom.setDisplay([obj], "");
		if( fade ){
			// bug is created at 100 opacity, set to 99 instead, safari only
			sfx.fade(obj, 99, px);
		}else{
			sfx.setOpacity(obj, 99);	
		}
	},
	
	hide : function(obj, fade, delay)
	{
		if( fade ){
			sfx.fade(obj, 0);
			setTimeout( function(e){
				dom.setDisplay([obj], "none");
			}, delay);	
		}else{
			dom.setDisplay([obj], "none");
		}
		
				
	}
}


/* *********************************************
lightbox, ajax, photos etc
********************************************* */
var lightbox =  {
	
	colour 	: "#000000",
	opacity : 85, // %
	baseIndex : 500, // sets the base Z Index, add each time lightbox made
	
	/* *************************************************
	create the overlay and content box ready for display
	options{ colour: "#000000",
			 opac: "80%" 
			 tId:target, place to put it
			 lbId: sets id to lightbox content
			}
			
	! important, remeber to setPosition of the (lb)
	************************************************* */	
	create : function( opt )
	{
		// create lightbox div 
		var lb = dom.create("div");
		lb.className = "lbdiv";
		// check passed colour
		var co = (opt && opt.colour ) ? opt.colour : lightbox.colour;
		//	opacity setting if one.
		var op = (opt && opt.opacity ) ? opt.opacity : lightbox.opacity;
		//	set if ID is requested		
		var tId = (opt && opt.target ) ? opt.target : false;
		// assign an ID to the display content box
		var lbId = (opt && opt.lbId ) ? opt.lbId : false;
		
		// create overlay container and append 
		lb.appendChild( lightbox.overlay( { "colour" : co, "opacity" : op, "target" : tId }));
		lb.appendChild( lightbox.displayBox( tId, lbId ));
		
		if( opt && opt.target ){
			dom.addNode(opt.target, lb, {add:"before"});
			//dom.byId(opt.id).insertBefore(lb, dom.byId(opt.id).firstChild );
		}else{
			document.body.appendChild(lb);
		}
		
		// return the display area of the content box object
		return dom.byClass("lbdisplay", lb)[0];
	},
	
	
	
	/* *********************************************
	create an overlay
	// options are {colour: , opacity:, target:id  }
	********************************************* */
	overlay : function( opt )
	{
		// create element
		var ol 	= dom.create("div");
		
		//	check for custom colour
		if(opt && opt.colour){
			colour = opt.colour;
		}else{
			colour = lightbox.colour;
		}
		
		// see if opacity is used instantly
		if(opt && opt.opacity){
			sfx.setOpacity( ol, opt.opacity );
		}
				
		//	general styles for overlay
		overlay = ol.style;
		overlay.position 		= "absolute";
		overlay.backgroundColor = colour;
		overlay.zIndex 			= lightbox.baseIndex++;
		
		//	if id is set, place over object area
		if(opt && opt.target){
			overlay.height 	   = dom.getHeight(opt.target, true);
			overlay.width 	   = dom.getWidth( opt.target, true);
		}
		// use as body overlay
		else{
			overlay.top 	= "0";
			overlay.left 	= "0";
			overlay.width 	= "100%";
			overlay.height  = dom.getPageHeight( true );
		}
		
		return ol;
	},


	/* *********************************************
	create an overlay
	// options are {colour: , opacity:, target:id  }
	********************************************* */
	displayBox : function( targetId, boxId )
	{
		// create the centering wrapper
		var lbWrapper 		= dom.create("div");
		var lbRap 			= lbWrapper.style;

		lbRap.position 	= "absolute";
		lbRap.zIndex 	= lightbox.baseIndex++;
		
		lbRap.textAlign = "center";
		
		if( targetId ){
			lbRap.height 	   = dom.getHeight(targetId, true);
			lbRap.width 	   = dom.getWidth( targetId, true);
		}
		// use as body overlay
		else{
			lbRap.top 	= "0";
			lbRap.left 	= "0";
			lbRap.width 	= "100%";
			lbRap.height  = dom.getPageHeight( true );
		}
		
		//	delete overlay and lightbox
		lbWrapper.onclick = function(e){
			//	destory the lightbox and all children
			lightbox.deactivate(lbWrapper.parentNode, e);
		}
		
		//	Create the internal display area
		var lbDisplayArea	= dom.create("div", ((boxId) ? boxId : "") );
		var lbDis 			= lbDisplayArea.style;
			lbDis.margin	= "auto";
			lbDis.position	= "relative";
			lbDis.textAlign = "left";

		lbDisplayArea.className 	= "lbdisplay";
		
		// hide the display area for preloading
		sfx.hide(lbDisplayArea);
		
		// ensure that lightbox isnt destroyed
		lbDisplayArea.onclick 		= function(e){
			dom.stopProp( e );
		}
		
		lbWrapper.appendChild( lbDisplayArea );
		return lbWrapper
	},
 
 	
	 
	/* *********************************************
	returns the object of the display area to edit
	********************************************* */
	/*
	getDisplayObject : function( lb )
	{
		return dom.byClass("lbdisplay", lb)[0];
	},
 	*/
 	
 	setPositionTop : function( lb, insideObject )
	{
		lb.style.top = (( ((!insideObject) ? dom.browserHeight() : insideObject.offsetHeight) / 2) - (lb.style.height.replace(/px.*/, "") / 2)) / 2 + "px";
		
	},
	
	deactivate : function( obj, e )
	{
		dom.delElement( obj );
		dom.stopProp(e);
	}
 	
}