////////////////////////////////////////////////////////////////////////////////////////////////////
// Stuff for the popup and message box with a locked (disabled) webpage
//
// IMPORTANT: these functions don't work without prototype.js!!
//

////////////////////////////////////////////////////////////////////////////////////////////////////
// Contanten
var MT_INFORMATION = 0;
var MT_YESNO = 1;
var MT_CUSTOM = 99;

////////////////////////////////////////////////////////////////////////////////////////////////////
// Global variables
var popupWindow = null;
var lockedWindow = null;
var config = null;
var configInitiated = false;

////////////////////////////////////////////////////////////////////////////////////////////////////
// Initialise the config variables
// 
function initPopup(idParent, opacity) {
	config = new Object();
	config.mainContainer = $(idParent);
	if (!config.mainContainer) {
		alert("Error in website: main container is invalid!");
		return;
	}
	config.opacity = opacity;
	configInitiated = true;
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Lock the window (by show a div element over all other elements with opacity)
//
function lockWindow() {
	// Initieer de lockedWindow
	if (lockedWindow == null) {
		lockedWindow = new Element('div', { id:'idDisabler' });
		lockedWindow.setStyle({
			position: 'absolute',
			top: 0,
			left: 0,
			display: 'none',
			zIndex: +50
		});
		lockedWindow.setOpacity(config.opacity);
		config.mainContainer.appendChild(lockedWindow);
	}
	
	// Wat zijn de dimensies van mijn viewport
	mydims = document.viewport.getDimensions();
	
	// Zet de breedte en hoogte van hetgeen dat gelocked moet worden
	//lockHeight = $('idTheEnd').positionedOffset().top;
	//alert(lockHeight + ',' + config.mainContainer.getHeight());
	lockHeight = config.mainContainer.getHeight();
	if (lockHeight < mydims.height) { lockHeight = mydims.height; }
	else { lockHeight = lockHeight + 20; }
	lockedWindow.setStyle({ width:mydims.width+'px', height:lockHeight+'px' });
	lockedWindow.show();
	
	hideSelectBoxes();
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Unlock the window (by removing the div element)
//
function unlockWindow() {
	if (lockedWindow != null) {
		lockedWindow.hide();
	}
	
	showSelectBoxes();
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Hide the popup window AND the lockedWindow
// Noot: The lock window is used to disbable all actions, buttons, links on the website 
//       except the popup window
// Noot: for IE6: we have to show all hidden selectboxes because they won't go to the background!
//
function hidePopup() {
	if (popupWindow != null) {
		popupWindow.hide();
	}
	
	unlockWindow();
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Show the popup AND lockedWindow
// Noot: The lock window is used to disbable all actions, buttons, links on the website 
//       except the popup window
// Noot: for IE6: we have to hide all hidden selectboxes because they won't go to the background!
//
function showPopup(strContents) {
	if (!configInitiated) {
		alert("Error in website: use of popup without initialisation");
		return;
	}
	
	lockWindow();
	
	// Initieer de popupWindow
	if (popupWindow == null) {
		popupWindow = new Element('div', { id:'idPopupWindow' });
		popupWindow.setStyle({
			position: 'absolute',
			top: 0,
			left: 0,
			display: 'none',
			zIndex: +100
		});
		config.mainContainer.appendChild(popupWindow);
	}
	
	// Wat zijn de dimensies van mijn viewport
	mydims = document.viewport.getDimensions();
	myoffsets = document.viewport.getScrollOffsets();
	
	// Zet de message (contents) in messagewindow en toon deze
	popupWindow.innerHTML = strContents;
	popupWindow.setStyle({
		'left': Math.floor((mydims.width - popupWindow.getWidth()) / 2) + 'px',
		'top':  Math.floor(myoffsets.top + (mydims.height - popupWindow.getHeight()) / 2) + 'px'
	});
	
	popupWindow.show();
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Show a messagebox with custom buttons
//
function showMessageBox(strMessage, arrButtons, idDefaultButton) {
	// Stel de buttons samen
	closeButton = '<p class="buttons">';
	closeButton = closeButton + arrButtons[0]; // Er moet minimaal 1 button zijn!!!
	for (idx = 1; idx < arrButtons.length; idx++) {
		closeButton = closeButton + '&nbsp;' + arrButtons[idx];
	}
	closeButton = closeButton + '</p>';
	
	// en toon de popup (messagebox)
	showPopup(strMessage + closeButton);
	
	if (idDefaultButton != undefined) {
		$(idDefaultButton).focus();
	}
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Show a message box with default buttons
//
function showMessage(strMessage, iMessType, strOkAction) {
	// Initieer de default waarden
	if (iMessType == undefined) iMessType = 0;
	if (strOkAction == undefined) strOkAction = '';
	
	// Voeg de buttons toe aan de messagewindow inhoud
	arrButtons = new Array();
	idx = 0;
	if (iMessType == MT_INFORMATION) {
		arrButtons[idx] = '<button class="button" id="btnOk" onClick="hidePopup();'+strOkAction+'" accesskey="s">Sluiten</button>';
	} else if (iMessType == MT_YESNO) {
		arrButtons[idx] = '<button class="button" id="btnOk" onClick="hidePopup();'+strOkAction+'" accesskey="j">Ja</button>';
		idx++;
		arrButtons[idx] = '<button class="button" id="btnCancel" onClick="hidePopup();" accesskey="n">Nee</button>';
	}
	
	// Toon de messagebox
	showMessageBox('<p style="padding:5px; cursor:pointer;" onClick="hidePopup();">'+strMessage+'</p>', arrButtons, 'btnOk');
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Show a message box with default buttons
//
function showImageMessage(imgurl, maxWidth, maxHeight) {
	//strMessage = '<table style="width:912px;"><tr><td style="text-align:center;"><img alt="" src="'+imgurl+'" onload="if (this.width>912) {this.style.width=\'912px\';}" /></td></tr></table>';
	myImage = new Image();
	myImage.src = imgurl;
	
	strMessage = '<img alt="" src="'+imgurl+'"';
	if (maxWidth) { 
		strMessage = strMessage + ' width="' + maxWidth + '"';
	}

	if (maxHeight) {
		strMessage = strMessage + ' height="' + maxHeight +'"';
	}
	strMessage = strMessage + ' />';
	
	if (myImage.complete) {
		showMessage(strMessage);
	}else{
		myImage.onload = function(event) {
			showMessage(strMessage);
		}
	}
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Hide all selectboxes
//
function hideSelectBoxes() {
	// Only for ie6
	if (navigator.userAgent.search(/MSIE 6/) == -1) {
		return;
	}
	
	arrElems = $$('select');
	
	for(idx = 0; idx < arrElems.length; idx++) {
		arrElems[idx].hide();	
	}
}

////////////////////////////////////////////////////////////////////////////////////////////////////
// Show all selectboxes
//
function showSelectBoxes() {
	// Only for ie6
	if (navigator.userAgent.search(/MSIE 6/) == -1) {
		return;
	}
	
	arrElems = $$('select');
	
	for(idx = 0; idx < arrElems.length; idx++) {
		arrElems[idx].show();	
	}
}

