var imageBlue = new Image().src = "./images/maps/zoomLevel.gif";
var imageRed = new Image().src = "./images/maps/zoomLevelRed.gif";
var image_dir = "./images/maps/";
var base_name = "map_level";
var extension = ".gif";

function init() {
	var currentLevel = 1;
	loadMap(currentLevel);
}

function updateNavImages() {
	for(loop = 0; loop <= 7; ++loop) {
		document.images["level" + loop].src = imageBlue;
	}
	document.images["level"+currentLevel].src = imageRed;
}

function loadMap(newLevel) {
	if(newLevel == "IN") {
		if(currentLevel > 0) {
			currentLevel -= 1;
		}
	}
	else if (newLevel == "OUT") {
		if(currentLevel < 7) {
			currentLevel += 1;
		}
	}
	else {
		currentLevel = newLevel
	}
	document.images["map"].src = image_dir + base_name + currentLevel + extension;
	updateNavImages();	
}