/*
 *
 * Manual Zoom
 *
 */
function getObj(n, d) { //v4.01
	var p,i,x;
	if(!d) d=document;
	if((p=n.indexOf("?"))>0&&parent.frames.length) {
		d=parent.frames[n.substring(p+1)].document;
		n=n.substring(0,p);
	}
	if(!(x=d[n])&&d.all) x=d.all[n];
	for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
	for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=getObj(n,d.layers[i].document);
	if(!x && d.getElementById) x=d.getElementById(n);
	return x;
}

function setRaster( pos ){
	/*
current raster systematic:
the # is posX = 0; posY = 0;
#**********************
*1         *         2*
*          *          *
*     ***********     *
*     *5        *     *
*     *         *     *
*******         *******
*     *         *     *
*     *         *     *
*     ***********     *
*          *          *
*3         *         4*
***********************
*/

	/* if you change the raster logic setRaster_n here, be sure you also have to change the correspond raster_image php function */
	setRasterNow( getRaster_1( images[pos]['width'], images[pos]['height'] ) );
	setRasterNow( getRaster_2( images[pos]['width'], images[pos]['height'] ) );
	setRasterNow( getRaster_3( images[pos]['width'], images[pos]['height'] ) );
	setRasterNow( getRaster_4( images[pos]['width'], images[pos]['height'] ) );
	setRasterNow( getRaster_5( images[pos]['width'], images[pos]['height'] ) );
}

function getRaster_1( width, height ){
	var retValues = new Array();
	retValues['num'] = 1;
	retValues['width'] = Math.round( width / 2 );
	retValues['height'] = Math.round( height / 2 );
	retValues['posX'] = 0;
	retValues['posY'] = 0;
	return retValues;
}

function getRaster_2( width, height ){
	var retValues = new Array();
	var corrPixelX = 1;
	retValues['num'] = 2;
	//if the image width is odd a correction pixel is necessary
	if ((width % 2) == 0) corrPixelX = 0;
	retValues['width'] = (Math.round( width / 2 )) - corrPixelX;
	retValues['height'] = Math.round( height / 2 );
	retValues['posX'] = retValues['width'] + corrPixelX;
	retValues['posY'] = 0;
	return retValues;
}

function getRaster_3( width, height ){
	var retValues = new Array();
	var corrPixelY = 1;
	retValues['num'] = 3;
	//if the image height is odd a correction pixel is necessary
	if ((height % 2) == 0) corrPixelY = 0;
	retValues['width'] = Math.round( width / 2 );
	retValues['height'] = (Math.round( height / 2 )) - corrPixelY;
	retValues['posX'] = 0;
	retValues['posY'] = retValues['height'] + corrPixelY;
	return retValues;
}

function getRaster_4( width, height ){
	var retValues = new Array();
	var corrPixelX = 1;
	var corrPixelY = 1;
	retValues['num'] = 4;
	//if the image width/height is odd a correction pixel is necessary
	if ((width % 2) == 0) corrPixelX = 0;
	if ((height %2) == 0) corrPixelY = 0;
	retValues['width'] = (Math.round( width / 2 )) - corrPixelX;
	retValues['height'] = (Math.round( height / 2 )) - corrPixelY;
	retValues['posX'] = retValues['width'] + corrPixelX;
	retValues['posY'] = retValues['height'] + corrPixelY;
	return retValues;
}

function getRaster_5( width, height ){
	var retValues = new Array();
	retValues['num'] = 5;
	retValues['width'] = Math.round( width / 2 );
	retValues['height'] = Math.round( height / 2 );
	retValues['posX'] = Math.round( retValues['width'] / 2 );
	retValues['posY'] = Math.round( retValues['height'] / 2 );
	return retValues;
}

function setRasterNow( values ) {
	var Raster  = jQuery('#rast_' + values['num'] );
	var Sens    = jQuery("#sens_" + values['num'] );
	var SensImg = jQuery("#sens_img_" + values['num'] );

	Raster.css({
		"width": parseInt( values['width'] ) + "px",
		"height": parseInt( values['height'] ) + "px",
		"top": parseInt( values['posY'] ) + "px",
		"left": parseInt( values['posX'] ) + "px"
	});
	Sens.css({
		"width": parseInt( values['width'] ) + "px",
		"height": parseInt( values['height'] ) + "px",
		"top": parseInt( values['posY'] ) + "px",
		"left": parseInt( values['posX'] ) + "px"
	});
	SensImg.css({
		"width": parseInt( values['width'] ) + "px",
		"height": parseInt( values['height'] ) + "px"
	});
} // end: function

function zoomIn( stat ) {
    if ( ProductDetailHandler ) {
		ProductDetailHandler.zoomHandler.imageGridZoomIn(stat);
	} // end: if
}

function zoomOut( pos ) {
    if ( ProductDetailHandler ) {
		ProductDetailHandler.updateSelectedImage( pos );
	} // end: if
}

function changeVisibility( obj, state ){
	if(document.getElementById) {
		document.getElementById(obj).style.visibility = state;
	} else {
		if(document.all) {
			document.all[obj].style.visibility = state;
		}
	}
}

function displayZoomserverScript(pos){} /* do we need this function? needs to be refactored. */

function displayVideoScript( flvPath ) {
	// if no flash is available, call zoomOut again, but now with flashAvailable = false set
	if(swfobject.hasFlashPlayerVersion("7.0.0")) {

    if ( jQuery("#flashContainer").length == 0 ) {
       jQuery('<div id="flashContainer"></div>').insertBefore( jQuery("#imageContainerImagePane div").first() );
    }

    jQuery(".ImageContainer").addClass('zoomserver').addClass('videoplayer');

    var flashvars = {
	  vid: flvPath
	}
    var params = {
      wmode: "transparent"
    };

    swfobject.embedSWF("/fileadmin/templates/BASE/swf/videoplayer_03.swf", "flashContainer", "380", "430", "7.0.0", false, flashvars, params);

    imageGridActive = false;
	}
}

/**
 *
 * @access public
 * @return void
 **/
function showVideo( flvPath ){
	displayVideoScript( flvPath );
}// end: function showVideo



function ProductDetailJSHandler() {
	this.zoomHandler = new PDSZoomHandler();

	this.init = function() {
		// zoomToStart = variable set by configuration directive out of extrakonfigurator.
		this.zoomHandler.init(zoomToStart);
	} // end: function init

	this.initEventHandlers = function() {
		jQuery(".alternateViewsSlider ul li a, #textLinkToVideo").click(function() {
			var offset = jQuery(this).attr('rel');
			var videourl = '';
			if ( offset == 'video' ) {
				videourl = jQuery(this).attr('data-videourl');
			}
			ProductDetailHandler.switchToAlternateViewImage(offset, videourl);
		});

		if ( flashAvailable ) {
			jQuery("#pds_imageToolbar a.action.showZoom").click(function() {
				ProductDetailHandler.zoomHandler.switchZoomHandler(jQuery(this));
				return false;
			});
		} else {
			// no flash available, so hide the toolbar...
			jQuery("#pds_imageToolbar a.action.showZoom").hide();
		}
	}

	this.updateSelectedImage = function(imagePos) {
		this.zoomHandler.toggleZoomDisplay(imagePos);
	}

	// switch to another image selected from "alternate views" slider
	this.switchToAlternateViewImage = function(offset, videourl) {
		this.zoomHandler.switchToAlternateViewImage(offset, videourl);
	} // end: function

	this.allowDisablingOfZoomviewer = function(state) {
		this.zoomHandler.allowDisablingOfZoomviewer(state);
	} // end: function
} // end: ProductDetailJSHandler


// This handles all the zoom functionality
function PDSZoomHandler() {
	this.currentZoom		= "imagegrid";
	this.imageGridZoom		= null;
	this.zoomViewerClient	= null;


	this.init = function(zoomToActivate) {
		this.currentZoom		= zoomToActivate;
		this.imageGridZoom		= new PDSGridZoomHandler();
		this.zoomViewerClient	= new PDSZoomserverClient();
		this.initZoomHandlers();
	} // end: function

	this.toggleZoomDisplay = function(imagePos) {
		this.imageGridZoom.toggleZoomDisplay(imagePos);
	}
	// switch to another image available as "alternate view" (mainly called from color selector and sliders)
	this.switchToAlternateViewImage = function(offset, videourl) {
		// detect and remove videoplayer
		if ( jQuery(".ImageContainer").hasClass('videoplayer') ) {
			jQuery(".ImageContainer").removeClass('videoplayer').removeClass('zoomserver');
			jQuery("#flashContainer").hide();
		}

		if ( typeof(offset) == 'undefined' || offset == '' ) {
			return false;
		}

		// switch to a video...
		if ( offset == 'video' ) {

			// switch current zoomhandler "off" to display video correctly...
			if ( this.currentZoom == "imagegrid" ) {
				this.imageGridZoom.switchFrom(this.imageGridZoom.getCurrentImagePos());
			}

			displayVideoScript( videourl );
			return false;
		}

		if ( images[offset]['zoombrowserimage'] != '') {
			jQuery("#pds_imageToolbar a.action.showZoom").show();

		} else {
			if (this.currentZoom == 'zoomviewer') {
				ProductDetailHandler.zoomHandler.switchZoomHandler(jQuery(this));
			}
			jQuery("#pds_imageToolbar a.action.showZoom").hide();
		}

		if ( this.currentZoom == "imagegrid" ) {
			this.imageGridZoom.displayZoom(offset);
		} else {
			this.zoomViewerClient.displayZoom(offset);
			// select the image index for later switch back to imageGridZoom.
			this.imageGridZoom.currentImagePos = offset;
		}
	}

	this.displayZoom = function(imagePos) {
		this.imageGridZoom.displayZoom(imagePos);
	} // end: function displayZoom

	this.imageGridZoomIn = function(stat) {
		this.imageGridZoom.imageGridZoomIn(stat);
	} // end: function

	this.initZoomHandlers = function() {
		// switch between the different zooms
		if ( this.currentZoom == "imagegrid" ) {
			this.zoomViewerClient.switchFrom(this.imageGridZoom.getCurrentImagePos());
			this.imageGridZoom.switchTo(this.imageGridZoom.getCurrentImagePos());
		} else {
			this.imageGridZoom.switchFrom(this.imageGridZoom.getCurrentImagePos());
			this.zoomViewerClient.switchTo(this.imageGridZoom.getCurrentImagePos());
		} // end: if
		this.toggleZoomLinkTexts();
	} // end: function

	this.switchZoomHandler = function(jQueryLink) {
		// switch between the different zooms
		if ( this.currentZoom == "imagegrid" ) {
			this.imageGridZoom.switchFrom(this.imageGridZoom.getCurrentImagePos());
			this.zoomViewerClient.switchTo(this.imageGridZoom.getCurrentImagePos());
			this.currentZoom = "zoomviewer";
		} else {
			this.zoomViewerClient.switchFrom(this.imageGridZoom.getCurrentImagePos());
			this.imageGridZoom.switchTo(this.imageGridZoom.getCurrentImagePos());
			this.currentZoom = "imagegrid";
		} // end: if
		this.toggleZoomLinkTexts();
	} // end: function

	this.toggleZoomLinkTexts = function() {
		if ( this.currentZoom == "imagegrid" ) {
			jQuery("#pds_imageToolbar ul li a span.activateFlashZoom").show();
			jQuery("#pds_imageToolbar ul li a span.deactivateFlashZoom").hide();
		} else {
			jQuery("#pds_imageToolbar ul li a span.activateFlashZoom").hide();
			jQuery("#pds_imageToolbar ul li a span.deactivateFlashZoom").show();
		} // end: if
	} // end: function

	this.allowDisablingOfZoomviewer = function(state) {
		this.zoomViewerClient.allowDisablingOfZoomviewer(state);
	} // end: function
} // end: "class" PDSZoomHandler


// Implementation for the Zoomviewer / Zoomserver Flash
function PDSZoomserverClient() {
	this.zoomViewerCanBeDisabled = true;

	this.isZoomviewerAvailable = function(imagePos) {
		// we need some images defined
		if ( typeof(images) != 'object' ) {
			return false;
		} // end: if
		// without flash we cannot use flashviewer flash
		if ( imagePos == 0  ||  flashAvailable == false ) {
			return false;
		} // end: if
		return (images[imagePos]['zoombrowserimage'].length != 0);
	} // end: function isZoomviewerAvailable

	this.displayZoom = function(imagePos) {
		if ( this.isZoomviewerAvailable(imagePos) ) {
			this.setupImageGrid(imagePos);
			jQuery('#flashContainer').show();
		} // end: if
	} // end: function displayZoom

	// switch to => this becomes the active zoom
	this.switchTo = function(imagePos) {
		this.displayZoom(imagePos);
		return true;
	} // end: function

	// switch from => this becomes the inactive zoom
	this.switchFrom = function(imagePos) {
		if ( this.zoomViewerCanBeDisabled ) {
			jQuery('#flashContainer').hide();
			return true;
		} // end: if
		return false;
	} // end: function

	this.allowDisablingOfZoomviewer = function(state) {
		this.zoomViewerCanBeDisabled = state;
	} // end: function

	this.setupImageGrid = function(pos) {
		// if no flash is available, call zoomOut again, but now with flashAvailable = false set
		// we require flash v7.0.0 to use this zoom
		if ( flashAvailable ) {
			if ( !jQuery(".ImageContainer").hasClass('zoomserver') ) {
				jQuery(".ImageContainer").addClass('zoomserver');
			} // end: if

			if (jQuery("#flashContainer").length == 0) {
				jQuery("#imageContainerImagePane").html('<div id="flashContainer"></div>');
			} // end: if

			var zoomserveraddtionals = "&clockprogress=0&history=0&maxzoom=1&mousemodes=1&mousemodeselect=1&mousemodes_mode3=false";
			var flashvars = false;
			var params = {
			  wmode: "transparent"
			};

			swfobject.embedSWF("http://zoom01.neckermann.de/fsi4/fsi.swf?FPXSrc=" + images[pos]['zoombrowserimage'] + zoomserveraddtionals, "flashContainer", "380", "430", "7.0.0", false, flashvars, params);

			imageGridActive = false;
		} else {
			flashAvailable = false;
			zoomOut(pos);
		} // end: if
	} // end: function

} // end: "class" PDSZoomserverClient


// The five-area zoom (javascript based)
function PDSGridZoomHandler() {
	this.currentImagePos		= 1;
	this.imagegridZoomActive	= false;

	this.imagegridSelector		= '#dmc_mb3_product_pi1256MainImage';
	this.rastergridSelector		= '#rast';
	this.imagegridVisible		= false;

	this.getCurrentImagePos = function() {
		return this.currentImagePos;
	} // end: function

	this.isImagegridAvailable = function(imagePos) {
		// we need some images defined
		if ( typeof(images) != 'object' ) {
			return false;
		} // end: if
		if ( imagePos == 0 ) {
			return false;
		} // end: if

		return (images[imagePos]['zoom'] == true);
	} // end: function

	// called from several functions this handles zooming in and out
	this.toggleZoomDisplay = function(imagePos) {
		// we are currently zooming out from a zoomed raster-image view
		if ( this.imagegridVisible && this.currentImagePos > 0 ) {
			this.displayZoom(this.currentImagePos);
			this.imagegridVisible = false;
		} else if ( imagePos == -1 ) {
			this.resetGridZoomForCurrentImage(imagePos);
		} else {
			this.displayZoom(imagePos);
		}
	}

	// reset to the normal image with grid selection
	this.resetGridZoomForCurrentImage = function(imagePos) {
		var bak = this.currentImagePos;
		this.displayZoom(this.currentImagePos);
		this.currentImagePos	= bak;
		this.imagegridVisible	= false;
	}

	this.displayZoom = function(imagePos) {
		jQuery(".ImageContainer").removeClass('zoomserver');

		if (this.imagegridZoomActive == false) {
			this.setupImageGrid();
		} // end: if

		var cursor				= 'pointer';
		this.imagegridVisible	= true;
		if ( !this.isImagegridAvailable(imagePos) ) {
			cursor					= 'default';
			this.imagegridVisible	= false;
		} // end: if

		// set the defined layers to create the zoom optic for the current picture
		if ( imagePos > 0 ) {
			this.currentImagePos	= imagePos;
		} // end: if

		setRaster( this.currentImagePos );
		jQuery(this.imagegridSelector).css({
			'cursor': cursor,
			'width': parseInt(images[this.currentImagePos]['width']) + "px",
			'height': parseInt(images[this.currentImagePos]['height']) + "px",
			'background': 'url(' + images[this.currentImagePos]['name'] + ')'
		});

		// toggle visibility of imagegrid zoom
		if ( !this.imagegridVisible ) {
			this.hideImageGridFromView(this.currentImagePos);
		} else {
			this.showImageGrid(this.currentImagePos);
		} // end: if

		// some flags
		zoomState				= false;
	} // end: function

	// create/copy the html necessary to activate this type of zoom
	this.setupImageGrid = function() {
		jQuery("#gridzoom").html(jQuery("#gridzoom_blueprint").html());
		this.imagegridZoomActive = true;
	}

	// zoom into an image (user clicked on a zoomable area)
	this.imageGridZoomIn = function(stat) {
		var height;
		var width;
		var hiresValues = new Array();

		if( images[this.currentImagePos]['hiresWidth'] == 0 || images[this.currentImagePos]['hiresHeight'] == 0 ){
			width = parseInt(images[this.currentImagePos]['width']);
			height = parseInt(images[this.currentImagePos]['height']) + "px";
		} else {
			hiresValues = eval( 'getRaster_' + stat + '(' + images[this.currentImagePos]['hiresWidth'] + ', ' + images[this.currentImagePos]['hiresHeight'] + ')');
			width = parseInt( hiresValues['width'] );
			height = parseInt( hiresValues['height'] ) + "px";
		}

		width = (width > 380) ? 380 + 'px' : width + 'px';
		//jQuery("#dmc_mb3_product_pi1256MainImage div").remove();
		jQuery(this.imagegridSelector).html('');
		jQuery(this.imagegridSelector).unbind('click');
		jQuery(this.imagegridSelector).click(function() {zoomOut(-1);});
		jQuery(this.imagegridSelector).css({
			'width': width,
			'height': height,
			'background': 'url(http://' + URL_httphost + '/typo3conf/ext/dmc_mb3_product/pi1/raster_image_n.php?breite=0&file=' + images[this.currentImagePos]['zoomi'] + '&status=' + stat + ')'
		});
		this.imagegridZoomActive = false;
	}

	this.hideImageGridFromView = function(imagePos) {
		jQuery(this.rastergridSelector).hide();
		jQuery(this.imagegridSelector).hide();
		return true;
	} // end: function

	this.showImageGrid = function(imagePos) {
		jQuery(this.imagegridSelector).show();
		jQuery(this.rastergridSelector).show();
	} // end: function

	// switch to => this becomes the active zoom
	this.switchTo = function(imagePos) {
		this.displayZoom(imagePos);
		return true;
	} // end: function

	// switch from => this becomes the inactive zoom
	this.switchFrom = function(imagePos) {
		return this.hideImageGridFromView(imagePos);
	} // end: function
} // end: "class" PDSGridZoomHandler

var ProductDetailHandler = new ProductDetailJSHandler();
ProductDetailHandler.init();

jQuery(document).ready(function() {
	ProductDetailHandler.initEventHandlers();
	ProductDetailHandler.allowDisablingOfZoomviewer(true);
});


/* Toggle ActiveState in MorePicturesRow */
$("a.moreviewsItem").click(function(){
	jQuery('.moreviewsItem').removeClass("moreviewsItemActive");
	$(this).addClass("moreviewsItemActive");
});