var showButton = new Image
var hideButton = new Image
showButton.src = '/images/show_button.png'
hideButton.src = '/images/hide_button.png'

function visibility() {
    var screenshot = null;
    if (navigator.userAgent.indexOf('Win') != -1) {
        //win
        screenshot = document.getElementById("screenshot_win");
    } else {
        // mac
        screenshot = document.getElementById("screenshot_mac");
    }
    if (screenshot != null) {
        screenshot.style.display='block';
    }
    var pres = document.getElementsByTagName("pre");
    for (i = 0; i < pres.length; i++) {
        if (pres[i].getAttribute("class")) {
            if (pres[i].getAttribute("class") == "prettyprint") {
                if (pres[i].getAttribute("rel") != "nobutton") {
                    var img = document.createElement("img");
                    var pre = pres[i];
                    img.setAttribute("src", hideButton.src);
                    img.setAttribute("alt", "Hide")
                    img.style.position= "relative";
                    img.style.left= "15px";
                    var kind = document.createElement("span");
                    var txt = document.createTextNode(pre.getAttribute("rel"));
                    kind.appendChild(txt);
                    kind.style.position= "relative";
                    kind.style.left= "20px";
                    kind.style.fontFamily="Fixed, monospace";
                    kind.style.color= "#800";
                    pre.parentNode.insertBefore(img, pre);
                    pre.parentNode.insertBefore(kind, pre);
                    img.onclick = function (event) {
                        return toggle_visibility(this, this.nextSibling.nextSibling);
                    };
                    if(pre.style.display == 'none') {
                        img.src=showButton.src;
                        img.alt="Show";
                    } else {
                        img.alt="Hide";
                    }
                }
            }
        }
    }
}

/**
 * Toggles the visibility of an element referenced by id.
 */
function toggle_visibility(button, block) {
    if(block.style.display == 'none') {
        block.style.display = 'block';
        button.src=hideButton.src;
        button.alt="Hide";
        //block.style.height = "20px";
    } else {
        block.style.display = 'none';
        button.src=showButton.src;
        button.alt="Show";
    }
}