/// <reference path="jquery-1.3.2-vsdoc2.js" />

var lightbox = {
    settings: {
        minSize: 100,
        containerMargin: 10,
        fadeIn: 500,
        delay: 200
    },

    containerElement: null,
    imageElement: null,
    saveElement: null,
    backgroundElement: null,
    loaderElement: null,
    nextLinkElement: null,
    prevLinkElement: null,

    _images: [],
    _offset: 0,
    _timerId: null,

    setup: function(bg, container, images) {
        lightbox.backgroundElement = $(bg);
        lightbox.containerElement = $(container);
        lightbox.imageElement = lightbox.containerElement.find('.image');
        lightbox.saveElement = lightbox.containerElement.find('.link');
        lightbox.loaderElement = lightbox.containerElement.find('.loader');
//        lightbox.nextLinkElement = lightbox.containerElement.find('.nextImage');
//        lightbox.prevLinkElement = lightbox.containerElement.find('.prevImage');

//        lightbox.imageElement.hover(function() {
//            lightbox.nextLinkElement.fadeIn();
//            lightbox.prevLinkElement.fadeIn();
//        }, function() {
//            lightbox.nextLinkElement.fadeOut();
//            lightbox.prevLinkElement.fadeOut();            
//        });

//        lightbox.nextLinkElement.click(function() { lightbox.skip(1); })
//        lightbox.prevLinkElement.click(function() { lightbox.skip(-1); })

        lightbox.containerElement.css({ zIndex: lightbox.backgroundElement.css('zIndex') + 1 });

        $(window).resize(lightbox._resize);

        lightbox._images = images;
    },

    show: function(arg) {
        var index, url, image;
        if (typeof arg == 'number') {
            lightbox._offset = index = arg;
        } else if (typeof arg == 'string') {
            url = arg;
        }

        image = url || lightbox._images[lightbox._offset];

        lightbox.imageElement.css({ width: null, height: null }).attr('src', '');
        lightbox.imageElement.one('load', function(ev) {
            if (lightbox._timerId) {
                clearTimeout(lightbox._timerId);
            }
            lightbox._timerId = null;

            lightbox.loaderElement.hide();
            lightbox.imageElement.hide();

            lightbox.containerElement.show();

            lightbox._scaleToFit();
            lightbox.imageElement.fadeIn(lightbox.settings.fadeIn);

            lightbox._center();
        }).attr('src', image);

//        lightbox.nextLinkElement.toggle(!url && lightbox._offset < lightbox._images.length - 1);
//        lightbox.prevLinkElement.toggle(!url && lightbox._offset > 0);

        lightbox.backgroundElement.show();
        lightbox.saveElement.attr('href', image);

        lightbox._timerId = setTimeout(function() {
            lightbox._timerId = null;
            lightbox.imageElement.hide();
            lightbox.loaderElement.show();

            lightbox._center();
            lightbox.containerElement.show();
        }, lightbox.settings.delay);
    },

    close: function() {
        lightbox.backgroundElement.hide();
        lightbox.containerElement.hide();
    },

    skip: function(offset) {
        offset = (offset + lightbox._offset) % lightbox._images.length;
        lightbox.show(offset);
    },

    _scaleToFit: function() {
        var screen = { width: $(window).width(), height: $(window).height() };
        var container = { width: lightbox.containerElement.outerWidth(), height: lightbox.containerElement.outerHeight() };
        var image = { width: lightbox.imageElement.width(), height: lightbox.imageElement.height() };

        var margins = {
            x: (container.width - image.width) + lightbox.settings.containerMargin * 2,
            y: (container.height - image.height) + lightbox.settings.containerMargin * 2
        };

        if (container.width < (screen.width - margins.x) && container.height < (screen.height - margins.y))
            return;

        var factors = { img: image.width / image.height, scr: screen.width / screen.height };

        var target;
        if (factors.img > factors.scr) {
            var w = Math.max((screen.width - margins.x), lightbox.settings.minSize);
            target = { width: w, height: w / factors.img };
        } else {
            var h = Math.max((screen.height - margins.y), lightbox.settings.minSize);
            target = { width: h * factors.img, height: h };
        }

        lightbox.imageElement.css(target);
    },

    _center: function() {
        var screen = { width: $(window).width(), height: $(window).height() };
        var container = { width: lightbox.containerElement.outerWidth(), height: lightbox.containerElement.outerHeight() };
        var doc = {
            width: Math.max(screen.width, $(document).width()),
            height: Math.max(screen.height, $(document).height())
        };
        var windowScroll = { top: $(window).scrollTop(), left: $(window).scrollLeft() };

        lightbox.backgroundElement.css({ top: 0, left: 0, width: doc.width, height: doc.height });

        lightbox.containerElement.css({
            top: (screen.height - container.height) / 2 + windowScroll.top,
            left: (screen.width - container.width) / 2 + windowScroll.left
        });

    },

    _resize: function(ev) {
        if (lightbox.containerElement.css('display') == 'none')
            return;

        lightbox.imageElement.css({ width: null, height: null });
        lightbox._scaleToFit();
        lightbox._center();
    }
};