if (document.getElementsByTagName && document.getElementsByClassName) {
    // Create a link to the Javascript-only stylesheet, which will primarily hide the hidden text

    var $link_element1 = document.createElement('link');
    $link_element1.setAttribute("rel", "stylesheet");
    $link_element1.setAttribute("href", "../css/javascript_only.css");
    $link_element1.setAttribute("media", "screen");


    // Append this stylesheet link to the document
    var $head_element = document.getElementsByTagName('head')[0];
    $head_element.appendChild($link_element1);


}
function prepareEnlarger() {

    if (!document.getElementsByTagName) return false;
    if (!document.getElementById) return false;
    if (!document.getElementsByClassName('enlarge')) return false;

    var $enlargeables = document.getElementsByClassName('enlarge');
    // array for preloading imgs
    preImages = new Array();

    for (var $i = 0; $i < $enlargeables.length; $i++) {
        var $enlargeable = $enlargeables[$i];
        // get name of img

        var $ref = $enlargeable.getAttribute('href');
        $enlargeable.setAttribute('href', '#');
        // get image src
        $url = $ref.split('/');
        $ref = $url[($url.length) - 1];
        $enlargeable.setAttribute('rel', $ref);
        var $captionHolder = document.createElement('p');
        var $caption = document.createTextNode('+');
        $captionHolder.appendChild($caption);
        $enlargeable.appendChild($captionHolder);
        $captionHolder.style.display = "none";
        // preload medium img
        preImages[$i] = new Image()
        preImages[$i].src = '../img/medium/' + $ref;

        $enlargeable.onclick = function(link) {
            if ($('toggle')) {
                if ($('toggle').style.display == 'none') {
                    $('toggle').style.display = 'block';
                }
            }

            //enlarge
            $('frame').setStyle({ opacity: 0.01 })

            $('frame').src = '../img/medium/' + this.getAttribute('rel');


            new Effect.Appear($('frame'), { duration: .5 })

            if (this.hasClassName('noPanorama')) {
                if ($('toggle')) { $('toggle').style.display = 'none'; }
            }



            $('frame').setAttribute('rel', this.getAttribute('rel'));
            // transfer title to main image
            $('frame').setAttribute('title', this.childNodes[0].getAttribute('title'));
            if ($('dj')) {
                // switch biog text
                if (this.getAttribute('rel') == 'dj_russell.jpg') {
                    $('cm').style.display = "none";
                    $('cmCaption').style.display = "none";
                    new Effect.Appear($('dj'));
                    new Effect.Appear($('djCaption'))
                    // $('dj').style.display="block";
                } else {
                    $('dj').style.display = "none";
                    $('djCaption').style.display = "none";
                    // $('other').style.display="block";
                    new Effect.Appear($('cm'));
                    new Effect.Appear($('cmCaption'));


                }
            }
            return false;
        }
        $enlargeable.onmouseover = function() {
            //popup	
            this.childNodes[1].style.display = "block";

        }
        $enlargeable.onmouseout = function() {
            this.childNodes[1].style.display = "none";
        }


    }





}

function init() {
    if ($('extra') && $('frame')) {
        // add loading background image to #extra
        var extra = $('extra');
        var extra_inner = document.createElement('div');
        extra_inner.setAttribute('id', 'extra_inner');

        while (extra.hasChildNodes()) {
            child = extra.removeChild(extra.firstChild);
            extra_inner.appendChild(child);
        }

        extra.appendChild(extra_inner);
    }

    if ($('toggle')) {
        // create panorama container for inner pages

        var panorama = document.createElement('div');
        panorama.setAttribute('id', 'panorama');
        var main = $('main');
        if (main.getElementsByTagName("DIV").length > 0) {
            for (var i = 0; i < main.getElementsByTagName("DIV").length; i++) {
                var child = main.getElementsByTagName("DIV")[i];
                main.removeChild(child);
                panorama.appendChild(child);
            }
        }

        main.appendChild(panorama);


        var toggle_link = $('toggle_link');
        while (toggle_link.hasChildNodes()) {
            child = toggle_link.removeChild(toggle_link.firstChild);
            extra_inner.appendChild(child);
        }
        extra_inner.removeChild(toggle_link);

        //redirect toggle link to function

        // var d=getAttribute('href', toggle_link);
        //toggle_link.setAttribute('href', '#');


        $('toggle').onclick = function() {
            togglePic();

        }



        // save original caption	
        captionOriginal = $('teasers_copy').innerHTML;
    }


    if ($('thumbs')) {
        prepareEnlarger();
    }
}


var captionOriginal = "";
Event.observe(window, 'load', init, false);



function togglePic() {
    var toggle = $('toggle');

    if (toggle.innerHTML == 'enlarge image') {
        var caption = $('frame').getAttribute('title');
        $('panorama').style.backgroundImage = "";
        $('main').style.backgroundImage = "";
        if (!$('main').hasClassName('panorama')) {
            $('main').addClassName('panorama');
        }

        $('panorama').style.backgroundImage = "url('../img/panoramas/" + $('frame').getAttribute('rel') + "')";

        if ($('teasers_copy')) {
            $('teasers_copy').innerHTML = '<p>' + caption + '</p>';
        }
        toggle.innerHTML = 'click to reduce';


        return false;

    } else {
        if (!$('main').removeClassName('panorama')) {
            // $('main').setAttribute('className', '', false);
            $('main').removeClassName('panorama');
        }
        $('panorama').style.backgroundImage = "none";


        toggle.innerHTML = 'enlarge image';

        $('teasers_copy').innerHTML = captionOriginal;
        return false;
    }

}
