/**
 * List of all regions available.
 */
var regions = Array('Europe', 'Americas', 'Asia', 'Africa');

/**
 * Get a DOM element by ID.
 *
 * @param {String} id the element of the id
 * @returns {Element} the element if found or null if not
 */
function getObject(sID) {
	var obj = null;
	if (document.getElementById && document.getElementById(sID)) {
		obj = document.getElementById(sID);
	} else if (document.all && document.all(sID)) {
		obj = document.all(sID);
	}
	if (obj == undefined || obj == null) {
		return null;
	} else {
		return obj;
	}
}

/**
 * Opens a window for the specified URL with the given dimensions.
 *
 * @param {String} url the URL for the new window
 * @param {int} width the width of the new window in pixels
 * @param {int} height the height of the new window in pixels
 */
function openWindow(url, width, height) {
	window.open(url, '', 'width=' + width + ',height=' + height);
}

/**
 * Toggles the DOM element with the given ID. If visible is not specified, 
 * the DOM element is displayed if hidden and shown if not.
 *
 * @param {String} id the ID of the DOM element
 * @param {Boolean} visible optional state to toggle to
 */
function toggle(id, visible) {
	var obj = getObject(id);
	if (obj) {
		if ((obj.style.display == "none" && visible == null) || visible) {
			obj.style.display = "";
		} else if (visible == null || visible == false) {
			obj.style.display = "none";
		}
	}
}

/**
 * Switches to the specified region.
 *
 * @param {String} region the region to switch to
 */
function switchRegion(region) {

	// Select the new region
	region = region.toLowerCase();
	toggle(region + '_globe');
	toggle(region + '_centers');
	toggleRegionLabel(region, true);

	// Hide all other regions
	for (var i=0; i<regions.length; i++) {
		var region_name = regions[i].toLowerCase();
		if (region != region_name) {
			toggle(region_name + '_globe', false);
			toggle(region_name + '_centers', false);
			toggleRegionLabel(region_name, false);
		}
	}
}

/**
 * Toggles a region label to the specified status.
 *
 * @param {String} region the region to toggle
 * @param (Boolean} selected true to mark as selected, false otherwise
 */
function toggleRegionLabel(region, selected) {
	var obj = getObject(region + '_label');
	if (obj) {
		if (selected) {
			obj.style.color = 'red';
			obj.style.background = '#ccc';
		} else {
			obj.style.color = '';
			obj.style.background = 'white';
		}
	}
}

/**
 * Navigates to the page for the selected center.
 *
 * @param {Element} list the list with the selected center
 */
function openCenter(list) {
	var selectedCenter = list.options[list.selectedIndex].value;
	if (selectedCenter.length > 0) {
		window.location.href = 'http://www.inlingua.com/centers/centers.asp?' + 
			'RefCtr=' + selectedCenter;
	}
}