$(document).ready( function() {
	var sLocation = document.location.href;
	var iPos = sLocation.indexOf('#cross');
	
	if(iPos != '-1') { 
		
		if(bShowSubmission) {
			showInzendingen();
		} else {
			showOpgaven();
		}		
	}
	
	// Show hidden elements on mouseover
	$('div.btn_hidden').mousemove( function(e) {
		showHidden(this.id,e);
	});
	
	// Hide hidden elements again
	$('div.btn_hidden').mouseout( function (e) {		
		var sTarget = this.id.replace('wrap','btn');
		if( $('#'+sTarget).hasClass('visible') && !$('#'+sTarget).hasClass('locked')) {
			$('#'+sTarget+' img').fadeOut('fast');
			$('#'+sTarget).removeClass('visible');			
		}
	});
	
	// Click on visible hidden element
	$('a.btn_hidden').click( function(e) {
		clickHidden(this.id,e);
	});
	
	// Click on cross
	$('#btn_cross').click( function() {
		if(bShowSubmission) {
			showInzendingen();
		} else {
			showOpgaven();
		}
	});
	
	// Click on vignet
	$('#engel').click( function() {
		showEngel();
	});
	
});


function showFish() {
	$('#engel').removeClass('active');
	
	var sTarget = 'btn_fish';	
	$('#'+sTarget+' img').show();
	$('#'+sTarget).addClass('locked');
	
	getAjaxContent('small_content','vis','plain',true);	
}

function showBoat() {
	$('#engel').removeClass('active');
	
	var sTarget = 'btn_boat';	
	$('#'+sTarget+' img').show();
	$('#'+sTarget).addClass('locked');
	
	getAjaxContent('small_content','boot','plain',true);	
}

function showCastle() {
	$('#engel').removeClass('active');
	
	var sTarget = 'btn_castle';	
	$('#'+sTarget+' img').show();
	$('#'+sTarget).addClass('locked');
	
	getAjaxContent('small_content','kasteel','plain',true);	
	
	
}

function showVisie() {
	if(bShowSubmission) {
		document.location.href = LINKROOT+'/inzendingen/visie-engelermeer';
	} else {
		alert('Hier kun je straks alle inzendingen terugvinden.');
	}
}

function showPaviljoen() {
	if(bShowSubmission) {
		document.location.href = LINKROOT+'/inzendingen/ontwerp-paviljoen';
	} else {
		alert('Hier kun je straks alle inzendingen terugvinden.');
	}
}

function showEngel() {
	
	$('#engel').addClass('active');
	getAjaxContent('small_content','engelermeer','plain',true);	
}

function showOpgaven() {
	$('.element_main').hide();
	$('#map').addClass('map3');
	$('#large_content_wrap').show();
	getAjaxContent('large_content','opgaven','opgaven',true);
	
}


function showInzendingen() {
	$('.element_main').hide();
	$('#map').addClass('map3');
	$('#large_content_wrap').show();
	
	getAjaxContent('large_content','inzendingen','inzendingen',true);
	
}


function showMain() {
	$('#large_content_wrap').fadeOut('medium',function() {
		$('#large_content').html(' '); 
		$('.element_main').show();
		$('#map').removeClass('map3');
	});	
}

function withinMargins(sId,e) {
	var oPosElement = $('#'+sId).position();
	var oPosWrapper = $('#map').position();
	
	var iLeft = oPosElement.left + oPosWrapper.left;
	var iTop = oPosElement.top + oPosWrapper.top;
	
	var iHeight = $('#'+sId).innerHeight();
	var iWidth = $('#'+sId).innerWidth();
	
	// Define threshold
	var iThreshXMin = iLeft + (iWidth/6);
	var iThreshXMax = iLeft + (iWidth/1.5);

	var iThreshYMin = iTop + (iHeight/6);
	var iThreshYMax = iTop + (iHeight/1.5);
	
	
	if(e.clientX > iThreshXMin && e.clientX < iThreshXMax ) {		
		if(e.clientY > iThreshYMin && e.clientY < iThreshYMax ) {
				return true;
		} else {
			return false;
		}
	} else {
		return false;
	}
	
}

function clickHidden(sId,e) {
	
	var sTarget = sId.replace('wrap','btn');	
	$('#'+sTarget+' img').show();
	$('#'+sTarget).addClass('locked');
	
	switch(sId) {
	case 'btn_fish':
		showFish();
		break;
		
	case 'btn_boat':
		showBoat();
		break;
		
	case 'btn_castle':
		showCastle();
		break;
	}
	
				
}

function showHidden(sId,e) {
	var sTarget = sId.replace('wrap','btn');
	
	if( !$('#'+sTarget).hasClass('visible') && !$('#'+sTarget).hasClass('locked')) {	
		// Get location of trigger

		if(withinMargins(sId,e)) {
			$('#'+sTarget+' img').fadeIn('fast');
			$('#'+sTarget).addClass('visible');
		}
	}
}