var alreadyRunning = false;
var actualImage;

var blendgrau = 200;
var blendbild = 300;

urls = new Array();
names = new Array();
urlnames = new Array();

function loadGaleryImages(urlString, nameString) {
    urls = urlString.split(",");
    names = nameString.split(",");
    //urlnames = urlText.split(",");
}

$('document').ready(function () {
    //set opacity
    $('#galeryGrau').add('#galeryDivpic').fadeTo(0, 0.0);



    $('.galerieImage').each(function (i) {


        $(this).click(function () {


            if (alreadyRunning == false) {
                alreadyRunning = true;
                actualImage = $(this).children('img').attr('name');

                $('#galeryGrau').css('visibility', 'visible');
                $('#galeryDivpic').css('visibility', 'visible');
                $('#pictext').remove();
                picurl = urls[actualImage];
                picurl = picurl.replace("width=596", "height=396");
                //alert(picurl);
                $('#galeryPic').attr('src', picurl);
                //alert(urls[actualImage]);
                $('#galeryPictitel').html(names[actualImage]);
                //$('#galeryFooter').append('<div id="pictext">&nbsp;' + urlnames[actualImage] + '</div>');
                $('#galeryFooter').css("height", "auto");
                $('#galeryHeader').css("height", "auto");
                //$('#pictext').css("height", "auto");
                //$('#galeryFooter img:not(:last-of-type)').after(urlnames[actualImage]);

                $('#galeryDivpic').fadeTo(blendbild, 1);
                $('#galeryGrau').fadeTo(blendgrau, 0.5);
                alreadyRunning = false;

                var windowWidth = document.documentElement.clientWidth;
                var windowHeight = document.documentElement.clientHeight;
                //var popupHeight = $('#galeryDivpic').height();
                var popupHeight = 533;
                var popupWidth = $('#galeryContainerPic').width();

                //alert(popupHeight);
                //alert(popupWidth);

                var browser = $.client.browser

                if (browser == "Explorer") {

                    $('#galeryContainerPic').css({
                        "top": windowHeight / 2 - popupHeight / 2,
                        "left": windowWidth / 2 - popupWidth / 2
                    });
                }
                else {
                    $('#galeryContainerPic').css({
                        "position": "absolute",
                        "top": windowHeight / 2 - popupHeight / 2,
                        "left": windowWidth / 2 - popupWidth / 2
                    });
                }
            }

        });


    });
    $('#previous').click(function () {
        if (actualImage == 0) {
            actualImage = urls.length - 1;
        } else {
            actualImage--;
        }
        picurl = urls[actualImage];
        picurl = picurl.replace("width=596", "height=396");
        //alert(picurl);
        $('#galeryPic').attr('src', picurl);
        $('#galeryPictitel').html(names[actualImage]);
        $('#pictext').remove();
        //$('#galeryFooter').append('<div id="pictext">&nbsp;' + urlnames[actualImage] + '</div>');
        $('#galeryFooter').css("height", "auto");
        $('#galeryHeader').css("height", "auto");
    });
    $('#next').click(function () {
        if (actualImage == urls.length - 1) {
            actualImage = 0;
        } else {
            actualImage++;
        }
        picurl = urls[actualImage];
        picurl = picurl.replace("width=596", "height=396");
        //alert(picurl);
        $('#galeryPic').attr('src', picurl);
        $('#galeryPictitel').html(names[actualImage]);
        $('#pictext').remove();
        //$('#galeryFooter').append('<div id="pictext">&nbsp;' + urlnames[actualImage] + '</div>');
        $('#galeryFooter').css("height", "auto");
        $('#galeryHeader').css("height", "auto");
    });
    $('#allImages').add('#galeryPic').click(function () {

        if (alreadyRunning == false) {
            alreadyRunning = true;
            $('#galeryDivpic').fadeTo(blendgrau, 0.0, function () {
                $('#galeryDivpic').css('visibility', 'hidden');
            });
            $('#galeryGrau').fadeTo(blendbild, 0.0, function () {
                $('#galeryGrau').css('visibility', 'hidden');
            });

            alreadyRunning = false;
        }
    });

    $('#galeryGrau').click(function () {

        if (alreadyRunning == false) {
            alreadyRunning = true;
            $('#galeryDivpic').fadeTo(blendgrau, 0.0, function () {
                $('#galeryDivpic').css('visibility', 'hidden');
            });
            $('#galeryGrau').fadeTo(blendbild, 0.0, function () {
                $('#galeryGrau').css('visibility', 'hidden');
            });

            alreadyRunning = false;
        }
    });
});