function initialVisual() {
	var divs = document.getElementsByTagName("div");
    for (var i=0; i<divs.length; i++ ) {
        if (divs[i].className.indexOf("initial") == -1) {
			continue;
		} else {
			divs[i].style.display = "block";
		}
    }
}

function showSection(id) {
    var divs = document.getElementsByTagName("div");
    for (var i=0; i<divs.length; i++ ) {
        if (divs[i].className.indexOf("section") == -1) continue;
        if (divs[i].getAttribute("id") != id) {
            divs[i].style.display = "none";
        } else {
            divs[i].style.display = "block";
			// jquery effect
			$(divs[i]).fadeIn(500);
        }
    }
}

function prepareVisualNav() {
    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
	if (!document.getElementById("visual_nav")) return false;
	if (!document.getElementById("main_visual")) return false;
	
	var visualnav = document.getElementById("visual_nav");
    var links = visualnav.getElementsByTagName("a");
    
    for (var i=0; i<links.length; i++ ) {
		var sectionId = links[i].getAttribute("href").split("#")[1];
        if (!document.getElementById(sectionId)) continue;
		
        document.getElementById(sectionId).style.display = "none";
        
        links[i].destination = sectionId;
        links[i].onclick = function() {
            showSection(this.destination);
            return false;
        }
    }
	
	var mainvisual = document.getElementById("main_visual");
	var links2 = mainvisual.getElementsByTagName("a");
	
	for (var i=0; i<links2.length; i++ ) {
		if (links2[i].className == "visual_close") {
			links2[i].onclick = function() {
				showSection("visual_nav");
				return false;
			}
		}
	}
	
	initialVisual();
}

// call using jquery to get fade effect
$(document).ready(prepareVisualNav);