/* ---------------------------------------------------------------------------------------------------
	 presentation_event.js $Revision: 1.1.2.3 $
	 --------------------------------------------------------------------------------------------------- */

/* - Image Preview ----------------------------------------------------------------------------------- */
var preloadInterval = {};
var ep_ImageCache = {};
var ep_ImagePercent = {};

function preloadImage(ImageURL, ImageID) {
// ---------------------------------------------------------------------------------------------------
// preloadImage([id of an img tag])
// ---------------------------------------------------------------------------------------------------
// This function can be used in the previewArea only!
// It tests if the download of an image is complete. On positive result it:
//  - displays the image by changing its display properties
//  - changes the size of large images
//  - removes its own interval
//
// Usage example:
// if(preloadInterval!="") clearInterval(preloadInterval);            // remove possible old interval
// preloadInterval = setInterval("preloadImage('"+ImageID+"')",100);  // start this function in an interval

		//settings for height and width according to source of functioncall
		var ImgWidth = 190;
		var ImgHeight= 140;
		if(Caller == 1) {   // storefront image format
				ImgWidth = 200;
				ImgHeight = 200;
		}
		var image = ep_ImageCache[ImageURL];
		var IsComplete=(image.width!=0 || browser.isIE) && image.complete;

		if(IsComplete) {                         // do nothing while the image is not loaded yet
				if(preloadInterval[ImageURL]!="") clearInterval(preloadInterval[ImageURL]);
				// create dummy image to get (non-cached) image width & height
				percent = 100;
				if(image.width> ImgWidth || image.height> ImgHeight) {  // resize large images
						horPercent = 100*ImgWidth/image.width;
						verPercent = 100*ImgHeight/image.height;
						if(horPercent > verPercent) {
								image.height =ImgHeight;
								image.width =image.width * verPercent / 100;
								percent = verPercent;
						}  else {
								image.width =ImgWidth;
								image.height =image.height * horPercent / 100;
								percent = horPercent;
						}
				}

				// calculate new postion
				newMarginLeft = image.width/2;
				newMarginTop = image.height/2;

				if (!browser.isOpera) {                                         // positioning for opera
						image.style.left="50%";
						image.style.top="50%";
						image.style.marginLeft="-"+newMarginLeft+"px";
						image.style.marginTop="-"+newMarginTop +"px";
				} else {
					 image.style.margin='auto';
				}

				oldimage = document.getElementById(ImageID);
				if(image != oldimage) {
					oldimage.parentNode.replaceChild(image, oldimage);
					oldimage.id = '';
					image.id = ImageID;
				}
				image.style.display="block";
				ep_ImagePercent[ImageURL] = "("+Math.floor(percent)+"%)";
				try {document.getElementById("Percentage").innerHTML= ep_ImagePercent[ImageURL]} catch(ex) {}
				try {document.getElementById("Loading").style.display="none";} catch(ex) {}
				try {document.getElementById("Percentage").style.display="inline";} catch(ex) {}
		}
}

function changePreviewImage(ImageID, ImageURL, ImageTitle) {
	var image = undefined;
	if (ep_ImageCache[ImageURL] === undefined) {
		image = new Image();
		image.src = ImageURL;
		image.id = '';
		if (ImageTitle) {
			image.alt = ImageTitle;
		}
		ep_ImageCache[ImageURL] = image;
		image.style.display="none";      // hide preview image while loading
		try{document.getElementById("Loading").style.display="inline"; } catch(ex) {} // display Loading info
		try{document.getElementById("Percentage").style.display="none";} catch(ex) {} // hide image size while loading
		try{document.getElementById("PreviewArea").style.textAlign="left";} catch(ex) {}
		preloadInterval[ImageURL] = setInterval("preloadImage('"+ImageURL+"','"+ImageID+"')",100);
	} else {
		image = ep_ImageCache[ImageURL];
		// changes the image url & title of an image element (specified by its id attribute)
		oldimage = document.getElementById(ImageID);
		if(image != oldimage) {
			oldimage.parentNode.replaceChild(image, oldimage);
			oldimage.id = '';
			image.id = ImageID;
			try {document.getElementById("Percentage").innerHTML= ep_ImagePercent[ImageURL]} catch(ex) {}
			try {document.getElementById("Loading").style.display="none";} catch(ex) {}
		}
		try {document.getElementById("Percentage").style.display="inline";} catch(ex) {}
		image.style.display="block";
	}
}

function resizeImage(ImageID, ImgWidth, ImgHeight) {
// ? unused	function
	var IsComplete=(document.getElementById(ImageID).width!=0 || browser.isIE) && document.getElementById(ImageID).complete;

    if(IsComplete) {
        testImage=document.createElement("img");
        testImage.src=document.getElementById(ImageID).src;

        percent = 100;
        if(testImage.width != 0) {                                                     // do nothing while the width is unset
            document.getElementById(ImageID).style.display="block";
            if (testImage.width< ImgWidth) {
                document.getElementById(ImageID).width = testImage.width;
                document.getElementById(ImageID).height = testImage.height;
            }
        }

        document.getElementById(ImageID).style.display="inline";
        newMarginLeft = document.getElementById(ImageID).width/2;
        newMarginTop = document.getElementById(ImageID).height/2;

        if (((!browser.isOpera)&&(testImage.height < ImgHeight))||((testImage.height < testImage.width)&&(!browser.isOpera))) {
            document.getElementById(ImageID).style.top="0";
            if(testImage.height < testImage.width) {
                document.getElementById(ImageID).style.marginTop = (ImgHeight/2) - (((ImgWidth*testImage.height)/testImage.width)/2) +"px";
            } else {
                document.getElementById(ImageID).style.marginTop = ImgHeight/2 - testImage.height/2 +"px";
            }
        } else {
          document.getElementById(ImageID).style.margin='auto';
        }
    } else {
        setTimeout("resizeImage('"+ImageID+"', 150, 150)",100);
    }
}

/* ---------------------------------------------------------------------------------------------------
	 - SlideShow (BackOffice) --------------------------------------------------------------------------
	 --------------------------------------------------------------------------------------------------- */

var PlayerArray = new Array();
var PlayerCount=0;
var PlayerListLength =0;
var PlayerStatus = -1; // -1 = not started (initial), 0 = rotate, 1= stop
var PlayerInterval ="";
var Caller=0;


// The player can be started by calling:
// function SlideShowPlay(string)
// function SlideShowSkip(integer, string);

function initPlayer(productImagePath) {
// This function scans all hidden checkboxes on the current page with the
// name attribute "ImageSlideShow" and if the checkbox is "checked" the image
// will be added to an image array
		imageArray=new Array();
		for(i =0; i<document.getElementsByName("ImageSlideShow").length; i++) {
				if(document.getElementsByName("ImageSlideShow")[i].checked==true) {
						// - The id attribute (of these checkboxes) contains an img identifier eg. "file_lii_1" "external_ssi_2".
						// - Depending on the first part oft the id the slideshow can make a difference between files on "our" server and an external URL
						//   file - files on "our" server
						//   external - an external URL
						var idcheck = document.getElementsByName("ImageSlideShow")[i].getAttribute("id");
						var splitter = idcheck.split('_');
						if(splitter[0]!="external") {
								fileName=productImagePath+document.getElementsByName("ImageSlideShow")[i].value;
						} else {
								fileName=document.getElementsByName("ImageSlideShow")[i].value;
						}
						// Create new Image
						bild = new Image();
						bild.src=fileName;
						// Add Image to the Image Array
						imageArray.push(bild);
				}
		}
		// return the Image Array
		return imageArray;
}

function rotatePicture() {
		if (PlayerStatus==0 && PlayerListLength>0) {
				PlayerCount++;
				if (PlayerCount==PlayerListLength) PlayerCount=0;
				if (PlayerCount<0) PlayerCount=PlayerListLength-1;

				changePreviewImage("PreviewImage", PlayerArray[PlayerCount].src, PlayerArray[PlayerCount].src)

				if(PlayerInterval!="") clearInterval(PlayerInterval);
				PlayerInterval = setInterval("rotatePicture()", 2000);
		}
}

function SlideShowInit(productImagePath){
		PlayerArray = initPlayer(productImagePath);
		PlayerListLength = PlayerArray.length;
		PlayerCount=-1;
		var Caller = 0;
		if (PlayerStatus==0) rotatePicture();
}

function SlideShowPlay(productImagePath){
		if (PlayerStatus==-1) {
				PlayerStatus=0;
				SlideShowInit(productImagePath);
		} else {
				PlayerStatus=0;
				rotatePicture();
		}
}

function SlideShowSkip(direction, productImagePath) {
		if (PlayerStatus==-1) {
				SlideShowInit(productImagePath);
		}
		PlayerStatus=1;                                                // stop Slide Show Player
		if(PlayerArray.length>0) {
				PlayerCount=PlayerCount+direction;
				if (PlayerCount==PlayerListLength) PlayerCount=0;
				if (PlayerCount<0) PlayerCount=PlayerListLength-1;

				changePreviewImage("PreviewImage", PlayerArray[PlayerCount].src, PlayerArray[PlayerCount].src)
		}
}


function SlideShowPause(){
		PlayerStatus=1;
}

function SlideShowStop(){
		PlayerStatus=-1;                                               // stop Slide Show Player
		document.getElementById("PreviewImage").style.display="none";  // hide preview image if slideshow is running
		document.getElementById("Loading").style.display="none";       // hide Loading info
		document.getElementById("Percentage").style.display="none";    // hide image size while loading
}