$(function() {
    if (slides) {
        var slidesLength = slides.length;
        var container = window.document.getElementById("slideshow1");
        var img = {};
        var a = {};
        for (var i = 0; (i < slidesLength && slides[i] !== undefined); i+=2) {
            img = window.document.createElement("IMG");
            img.width = "554";
            img.height = "292";
            img.alt = "";
            img.src = "/media/img/slideshow/" + slides[i];
            a = window.document.createElement("A");
            a.href = slides[i + 1];
            a.target = "_blank";
            a.appendChild(img);
            container.appendChild(a);
        }
    } 

    // NUMBER BUTTONS
    var bc = $('#buttonContainer'); 
    var $container = $('#slideshow1').cycle({
        timeout: 6000,
        speed: 1500,
        before: setButtonColor
    });

    $container.children().each(function(i) { 
        this.id = "_a" + (i+1);
        $('<input type="button" value="'+(i+1)+'" id="input_a'+(i+1)+'" />').appendTo(bc).click(function() { 
            $container.cycle(i); 
            resetButtonColor(i);
            return false; 
        });  
    }); 

    function setButtonColor() {
        var container = {}; 
        var inputs = {};
        var input = window.document.getElementById("input" + this.id);
        var input_prev = {};
        var end = 0;
        var color1 = "#FFFFFF";
        var color2 = "#000000";
        if (input !== null) {
            input.style.backgroundColor = color1;
            input.style.color = color2;
            input_prev = input.previousSibling;
            if (input_prev !== null && input_prev.nodeType === 1) {
                input_prev.style.backgroundColor = color2;
                input_prev.style.color = color1;
            } else if (input.value === "1") { 
                container = window.document.getElementById("buttonContainer");
                inputs = container.getElementsByTagName("INPUT");
                end = inputs.length - 1;
                input = inputs.item(end);
                input.style.backgroundColor = color2;
                input.style.color = color1;   
            }
        }
    }

    function resetButtonColor(i) {
        var container = window.document.getElementById("buttonContainer");
        var inputs = container.getElementsByTagName("INPUT");
        var inputsLength = inputs.length;
        for (var j = 0; j < inputsLength; j++) {
            if (j !== i) {
                inputs[j].style.backgroundColor = "#000000";
                inputs[j].style.color = "#FFFFFF";  
            }
        }
    }

    // <<PREVIOUS NEXT>> BUTTONS
    /*$('#slideshow1 img:first').fadeIn(500);
    $('#slideshow1').cycle({
        timeout: 6000,
        speed: 1500,
    	delay: -1500,
        before: function() {
            $('#caption').html(this.alt);
        },
        prev: '#prev',
        next: '#next'
    });*/
});