/*
'*  Script name:	ew.panorama.js
'*  Created on:	10/28/2010
'*  Author:		Stefan Bleilevens
'*  Purpose:		-
'*  Created for:	Euroweb Group | Euroweb Internet GmbH
'*  History:		Stefan Bleilevens 10/28/2010
'*				No modifications.
*/
var panoramaIsVisible = false;
jQuery(document).ready(function(){
	jQuery('.hidePanorama').fadeOut(200);
	jQuery('#backgroundPanorama').css('display','none');
	jQuery('#naviForBackgroundPanorama').css('display','none');
	jQuery('#overlay').css('display','block');
	jQuery(window).load(function(){
		jQuery('#backgroundPanorama').fadeIn(1200);
	});
	jQuery('.viewPanorama').click(function(){
		tooglePanoramaView();
	});
	jQuery('.hidePanorama').click(function(){
		tooglePanoramaView();
	});
});

function tooglePanoramaView(){
	jQuery('#contentContainer').stop(true,true);
	if(!panoramaIsVisible){
		jQuery('#header').animate({
			top: "-=127px"
		}, 450);
		jQuery('#contentContainer').animate({
			top: doc.body.offsetHeight
		}, 450, function(){
			jQuery('#contentContainer').fadeOut(100, function(){
			});
			
			jQuery('#naviForBackgroundPanorama').css('display','block');
			jQuery('#naviForBackgroundPanorama').animate({
				opacity: 1,
				top: '+=55px'
			}, 450);
			jQuery('.hidePanorama').fadeIn(750);
		});
		
		panoramaIsVisible = true;
	} else {
		jQuery('#header').animate({
			top: "+=127px"
		}, 450);
		jQuery('.hidePanorama').fadeOut(200);
		jQuery('#contentContainer').fadeIn(145);
		jQuery('#naviForBackgroundPanorama').animate({
			opacity: 0,
			top: '-=55px'
		}, 400);
		jQuery('#contentContainer').animate({
			top: 170,
			opacity: 1
		}, 900, function(){
			jQuery('#naviForBackgroundPanorama').css('display','none');
		});
		panoramaIsVisible = false;
	}
};


var dragobj; var panoramaContent;
var dragx; var dragy; var scrollToPos;
var mposx; var mposy;
var panoramaWidth; var panoramaScrollableWidth;
var salt;
(function(){

var _panorama = {
	init: function(){
		doc = document;
		dragobj = null; dragx = 0; dragy = 0; mposx = 0; mposy = 0; salt = 1; panoramaContent = null;
		doc.onmousemove = ewPanorama.drag;
		doc.onmouseup = ewPanorama.dragstop;

	},
	
	addTo: function(containerId, containerWidth, containerHeight, imageSrc, imageWidth, externalNaviId, thumbSrc){
		if(!(panoramaContainer = doc.getElementById(containerId))) {
			throw(containerId + " does not exists. [ewError]"); return false;
		};
		
		var usesExtNavi = (doc.getElementById(externalNaviId))?true:false;
		if(!usesExtNavi) throw("This version doesn't support inline navigation");
		
		/* prepare sizes */
		containerWidth = (containerWidth.indexOf('%')>-1)?(doc.body.offsetWidth*(parseInt(containerWidth)/100)):containerWidth;
		containerHeight = (containerHeight.indexOf('%')>-1)?(doc.body.offsetHeight*(parseInt(containerHeight)/100)):containerHeight;
		
		/* set panorama sizes */
		panoramaContainer.style.width = containerWidth + 'px';
		panoramaContainer.style.height = containerHeight + 'px';
		
		/* create required elements */
		/* create new panoramaHead */
		newPanoramaHead = doc.createElement('div');
		newPanoramaHead.className = 'panoramaHead';
		newPanoramaHead.style.width = imageWidth+'px';
		newPanoramaHead.style.containerHeight = (containerHeight)+'px';
		newPanoramaHead.style.background = 'url('+imageSrc+') no-repeat left center';
		
			
			/* create new panoramaNavigation */
			newPanoramaNavigation = doc.createElement('div');
			newPanoramaNavigation.className = 'panoramaNavigation';
			newPanoramaNavigation.style.width = 400 + 'px';
			
			/* append panoramaHead */
			panoramaContainer.appendChild(newPanoramaHead);
			/* append panoramaNavigation */
			doc.getElementById(externalNaviId).appendChild(newPanoramaNavigation);
			
			
			/* create new panoramaDragger */
			newPanoramaDragger = doc.createElement('div');
			newPanoramaDragger.className = 'panoramaDragger';
			newPanoramaDragger.style.width = ((containerWidth / imageWidth)*newPanoramaNavigation.offsetWidth) +'px';

			newPanoramaDragger.innerHTML = '<div class="panoramaDraggerLeftArrow"></div><div class="panoramaDraggerCenter"></div><div class="panoramaDraggerRightArrow"></div>';
			
			if(thumbSrc.length > 1){
				newPanoramaNavigation.style.background = 'url('+thumbSrc+') no-repeat left center';
			}
			
			/* append panoramaDragger */
			newPanoramaNavigation.appendChild(newPanoramaDragger);
			
		/* setup panoramaDragger */
		mysalt = imageWidth / (containerWidth - newPanoramaNavigation.offsetWidth);
		mysalt = containerWidth / imageWidth * jQuery(newPanoramaDragger).width() / jQuery(newPanoramaNavigation).width();
		
		mysalt = (imageWidth - containerWidth) / (jQuery(newPanoramaNavigation).width() - jQuery(newPanoramaDragger).width());

		
		if(doc.body.offsetWidth > imageWidth){
			ewPanorama.dragstop();
			throw('no dragging possible');
			return false;
		};
		
		newPanoramaDragger.mousedown = ewPanorama.initDrag(newPanoramaDragger,mysalt,panoramaContainer.id);
	},
	
	initDrag: function(dragElement,mysalt,panoramaElement){
		salt = mysalt;
		dragElement.onmousedown = new Function('ewPanorama.dragstart(this,'+mysalt+');ewPanorama.setPanoramaContent("'+panoramaElement+'");return false;');

	},
	
	setPanoramaContent: function(element){
		panoramaContent = doc.getElementById(element).getElementsByTagName('div')[0];
		panoramaWidth = panoramaContent.offsetWidth;
		panoramaScrollableWidth = (panoramaWidth - panoramaContent.parentNode.offsetWidth) * -1;
	},
	
	dragstart: function(element){
		dragobj = element;
		dragx = mposx - element.offsetLeft;
	},
	
	drag: function(e){
		mposx = doc.all ? window.event.clientX : e.pageX;
		
		if(dragobj == null) return false;
		scrollToPos = (((mposx - dragx + 1)*salt*-1));
		
		if(panoramaScrollableWidth > scrollToPos){
			panoramaContent.style.left = panoramaScrollableWidth + 'px';
			dragobj.style.left = ((dragobj.parentNode.offsetWidth - dragobj.offsetWidth)) + 'px';
			return false;
		} else if(scrollToPos > 0){
			panoramaContent.style.left = 0 + 'px';
			dragobj.style.left = 0 + 'px';
			return false;
		} else {
			panoramaContent.style.left = scrollToPos + 'px';
			dragobj.style.left = ((mposx - dragx)) + 'px';
			dragobj.style.backgroundPosition = ((mposx-dragx)*-1)+'px' + ' 0px ';
		};
	},

	dragstop: function(){
		dragobj = null;
	}
};
window.ewPanorama = _panorama;
_panorama.init();
})();