var box1_selectedIndex;
var box2_selectedIndex;
var box1, box2;

function changeBox1(index) {
	box1_selectedIndex = index;
	writeBox1();
	initBox2();
}


function writeBox1() {
	boxArray = box1Array;
	strHTML = "";
	for (x=0;x<boxArray.length;x++) {
		if (x==box1_selectedIndex) {
			strHTML += "&nbsp;&nbsp;- <span class='right_ext_lks_sel'>"
			+ boxArray[x].substring(boxArray[x].indexOf("::")+2)
			+ "</span><br>";
		}
		else {
			strHTML += "&nbsp;&nbsp;- <a href='JavaScript:void(null)' onClick='changeBox1(" + x + ");return(false)'>"
			+ boxArray[x].substring(boxArray[x].indexOf("::")+2)
			+ "</a><br> ";
		}
	}
	box1.innerHTML = strHTML;
}


function writeBox2() {
	boxArray = box2Array[box1_selectedIndex];
	strHTML = "";
	for (x=0;x<boxArray.length;x++) {
		if (x==box2_selectedIndex) {
			strHTML += "&nbsp;&nbsp;- <span class='right_ext_lks_sel'>"
			+ boxArray[x].substring(boxArray[x].indexOf("::")+2)
			+ "</span> <br> ";
		}
		else {
			strHTML += "&nbsp;&nbsp;- <a href='JavaScript:void(null)' onClick='showContent(" + x + ");return(false)'>"
				+ boxArray[x].substring(boxArray[x].indexOf("::")+2)
				+ "</a> <br> ";
		}
	}
	box2.innerHTML = strHTML;
}

function initBoxes() {
	box1 = document.getElementById("divBox1");
	box2 = document.getElementById("divBox2");
	box1_selectedIndex = 0;
	writeBox1();
	initBox2();
}



function initBox2() {
	box2_selectedIndex = 0;
	showContent(0);
}

function showContent(index) {
	box2_selectedIndex = index;
	writeBox2();
	document.getElementById("dinContent").innerHTML = "<img alt='imagem gráfica' src='" + contentPath
		+ box2Array[box1_selectedIndex][box2_selectedIndex].substring(0,box2Array[box1_selectedIndex][box2_selectedIndex].indexOf("::"))
		+ "'>";
	document.getElementById("dinHeader").innerHTML = "&nbsp;" +  box1Array[box1_selectedIndex].substring(box1Array[box1_selectedIndex].indexOf("::")+2,100) + " &ndash; " + box2Array[box1_selectedIndex][box2_selectedIndex].substring(box2Array[box1_selectedIndex][box2_selectedIndex].indexOf("::")+2,100);
}