var popUpStatus			= 0;
var popUpOtherStatus	= 0;
var timeout				= 500;
var boxPosX 			= 500;
var boxPosY 			= 147;
var boxWidth 			= 600;
var boxHeight 			= 410;

var menuLinks			= new Array();
var menuText			= new Array();

var mouseStatus			= 0;
var lastItemHover;

menuLinks[1] 			= 'firmenprofil';
menuLinks[2] 			= 'kontakte';
menuLinks[3]			= 'impressum';
menuLinks[4]			= 'anfahrt';

addEvent('domready', function() {
	createBox();

	makerHover();

	for(var i=1; i<=4; i++) {
		// PreLoad BoxContent
		makeContent(i);
	}
});

function createBox() {
	// CreateBox
	new Element('div', {
		styles: {
			position: 'absolute',
			left: boxPosX-(boxWidth/2),
			top: boxPosY+boxHeight,
			width: 0,
			height: 0,
			fontSize: 0
		},
		id: 'popUpBox'
	}).inject($('page'));
}

function makerHover() {
	// AddEvents mouseover and mouseout
	$(menuLinks[1]).addEvent('click', function() {
		handleClick(1, 1);
	});
	$(menuLinks[1]).addEvent('mouseover', function() {
		$(menuLinks[1]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[1] + '-hover.png)');
	});
	$(menuLinks[1]).addEvent('mouseout', function() {
		$(menuLinks[1]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[1] + '.png)');
	});

	$(menuLinks[2]).addEvent('click', function() {
		handleClick(1, 2);
	});
	$(menuLinks[2]).addEvent('mouseover', function() {
		$(menuLinks[2]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[2] + '-hover.png)');
	});
	$(menuLinks[2]).addEvent('mouseout', function() {
		$(menuLinks[2]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[2] + '.png)');
	});

	$(menuLinks[3]).addEvent('click', function() {
		handleClick(1, 3);
	});
	$(menuLinks[3]).addEvent('mouseover', function() {
		$(menuLinks[3]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[3] + '-hover.png)');
	});
	$(menuLinks[3]).addEvent('mouseout', function() {
		$(menuLinks[3]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[3] + '.png)');
	});

	$(menuLinks[4]).addEvent('click', function() {
		handleClick(1, 4);
	});
	$(menuLinks[4]).addEvent('mouseover', function() {
		$(menuLinks[4]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[4] + '-hover.png)');
	});
	$(menuLinks[4]).addEvent('mouseout', function() {
		$(menuLinks[4]).setStyle('backgroundImage', 'url(auswahlseite/images/' + menuLinks[4] + '.png)');
	});
}

function makeContent(getItem) {

var getContent = new Request({
  method: 'get',
  url: getPath('auswahlseite/scripts/getcontent.php')
 });

getContent.addEvent('success', function(response, text){menuText[getItem] = response;});
getContent.send('path='+ menuLinks[getItem] +'.html');

/*
	var getContent = new Request({
		method: 'get',
		url: getPath('scripts/getcontent.php'),
		onSuccess: function(){
			menuText[getItem] = getContent.response.text;
		}
	}).send('path='+ menuLinks[getItem] +'.html');
*/


/*
	var getContent = new XHR({
		method: 'get',
		onSuccess: function(response){
			menuText[getItem] = response;
		}
	}).send(getPath('scripts/getcontent.php'), 'path='+ menuLinks[getItem] +'.html');
*/
}

function getPath(addPath) {

	var path = location.href;
	/*var search = path.lastIndexOf('templates/');
	var newPath = path.slice(0, search) + addPath;*/
	var search = path.lastIndexOf('/');
	var newPath = path.slice(0, search)+ '/' + addPath;
	
	return newPath;
}

function handleClick(isClick, getItem) {
	switch(isClick) {
		case 1:
			lastItemHover = getItem;
			mouseStatus = isClick;
			if(popUpStatus != 3) {
				if(popUpStatus == 0) handleBox(1, getItem);
			}

		break;

		case 0:
			mouseStatus = isClick;
			if(popUpStatus != 2) {
				if(popUpStatus == 1) handleBox(0, getItem);
			}
		break;
	}
}

function handleBox(openClose, getItem) {
	switch(openClose) {
	case 1:
		if(lastItemHover) getItem = lastItemHover;
		$('popUpBox').setStyle('backgroundColor', '#FFF').set('morph', {
			duration: timeout,
			// transition: Fx.Transitions.Bounce.easeOut,
			link: 'chain',
			onStart: function(){
				$('popUpBox').set('html', menuText[getItem]);
				popUpStatus = 2;
			},
			onComplete: function(){
				if(mouseStatus == 0) handleBox(0, getItem);
				popUpStatus = 1;
			},
			top: [0, boxPosY],
			width: 0,
			height: 0
		}).morph({
			'top':					boxPosY,
			'left': 				[boxPosX, boxPosX - (boxWidth / 2)],
			'width': 				boxWidth,
			'height':				boxHeight
		});
		break;
	case 0:
		$('popUpBox').set('morph', {
			duration: 				timeout,
			link: 					'chain',
			onStart: function() {
				popUpStatus = 3;
			},
			onComplete: function() {
				if(mouseStatus == 1) handleBox(1, getItem);
				popUpStatus = 0;
			},
			top: 					[0, boxPosY],
			width: 					0,
			height: 				0
		}).morph({
			'top': 					boxHeight+boxPosY,
			'left': 				[boxPosX - (boxWidth / 2), boxPosX],
			'width': 				0,
			'height': 				0
		});
		break;
	}
}