(function($) {
    $.fn.imgBackground = function(options){
        var base = $(this);
        var image = null;

        var defaults = {};
        base.init = function() {
            base.options = $.extend({}, defaults, options);
        };

        base.init();

        return base.each(function(){
            $(document).ready(function(){
                image = draw(options.imgsrc, base);
            });
        });
    };

    function draw(src, element) {
        var img = new Image();

        img.onload = function() {
            $(element).append(img);
            $(img).fadeIn();
        };

        img.src = src;
        return img;
    }

    $.fn.browserClass = function() {
        var base = $(this);
        var browser = $.browser;
        var browser_name = "";

         return base.each(function(){
            $(document).ready(function(){
                if ( browser.webkit ) {
                    browser_name = "webkit";
                }
                else if( browser.mozilla ) {
                    browser_name = "mozilla";
                }
                else if( browser.opera ) {
                    browser_name = "opera";
                }
                base.addClass(browser_name);
            });
        });
    };

    $.fn.eventsDropdown = function() {
        var base = $(this);
        var form = base.find('form');
        var dropdown = base.find('select');

        return base.each(function(){
            dropdown.change(function(){
                form.submit();
            });
        });
    };

    $.fn.gallerize = function(options) {
        var base = $(this);

        base.options = options;

        base.getImages = function(element) {
            return $(element).find('img');
        };

        base.resize = function(image, dimensions) {
            var src = null;
            if ( image.jquery === undefined ) {
                src = image.src;
            }
            else {
                src = image.attr('src');
            }

            var img = new Image();
            img.src = src;

            var width = img.width;
            var height = img.height;

            if( dimensions.width > width && dimensions.height > height){
                return {
                    width: image.width + 'px',
                    height: image.height + 'px'
                };
            }
            else if( width > height ) {
                return {
                    width: dimensions.width + 'px',
                    height: 'auto'
                };
            }
            else {
                return {
                    width: 'auto',
                    height: dimensions.height + 'px'
                };
            }
        };

        base.buildHTML = function(images) {
            var gHTML = '<div class="gallery"><div class="gallery-main-image"><div class="left-arrow"><div></div></div><div class="right-arrow"><div></div></div>';

            images.each(function(index, image){

                var dimensions = null;

                if ( index === 0 ) { //first iteration
                    dimensions = base.resize(image, {width: base.options.full_width, height: base.options.full_height});
                    gHTML += '<img src="' + $(image).attr('src') + '" style="width:' + dimensions.width + ';height:' + dimensions.height + ';" /></div><ul>';
                    dimensions = base.resize(image, {width: base.options.thumb_width, height: base.options.thumb_height});
                    gHTML += '<li class="selected"><div></div><img src="' + $(image).attr('src') + '" style="width:' + dimensions.width + ';height:' + dimensions.height + ';" /></li>';
                }
                else {
                    dimensions = base.resize(image, {width: base.options.thumb_width, height: base.options.thumb_height});
                    gHTML += '<li><div></div><img src="' + $(image).attr('src') + '" style="width:' + dimensions.width + ';height:' + dimensions.height + ';" /></li>';
                }
            });

            return gHTML + '</ul></div>';
        };

        return base.each(function(){
            $(document).ready(function(){
                var images = base.getImages(base);
                var html = base.buildHTML(images);
                base.after(html);
                base.remove();
            });

            $('.gallery li div').live('click', function(){
                var image = $(this).parent().find('img');
                var gallery_div = image.parents('.gallery').find('.gallery-main-image');
                image.parent().parent().parent().find('.selected').removeClass('selected');
                image.parent().addClass('selected');

                if ( gallery_div.length > 0 ) { // make sure we have something to work with
                    var old_imgs = gallery_div.children('img');
                    old_imgs.remove();

                    var dimensions = base.resize(image, {width: base.options.full_width, height: base.options.full_height});
                    gallery_div.append('<img src="' + image.attr('src') + '" style="width:' + dimensions.width + ';height:' + dimensions.height + ';" />');
                }
            });

            $('.gallery .left-arrow, .gallery .right-arrow').live('mouseenter', function(){
                $('.gallery .left-arrow div, .gallery .right-arrow div').show();
            });

            $('.gallery .left-arrow, .gallery .right-arrow').live('mouseleave', function(){
                $('.gallery .left-arrow div, .gallery .right-arrow div').hide();
            });

            $('.gallery .left-arrow, .gallery .right-arrow').live('click', function(){
                var _this = $(this);
                var list = _this.parent().parent().find('ul');
                var current = list.find('.selected');
                if(_this.hasClass('left-arrow')) {
                    if(current.prev().length === 0) {
                        list.children().last().find('div').trigger('click');
                    }
                    else {
                        current.prev().find('div').trigger('click');
                    }
                }
                else {
                    if(current.next().length === 0) {
                        list.children().first().find('div').trigger('click');
                    }
                    else {
                        current.next().find('div').trigger('click');
                    }

                }
            });
        });
    };
})(jQuery);

(function($){
    $("body").browserClass();
    $(".home #backgroundImage").imgBackground({imgsrc: background_image});
    $("#events-selection").eventsDropdown();

    var gallery_options = {
        thumb_width: 40,
        thumb_height: 27,

        full_width: 500,
        full_height: 333
    };
    $.each($(".gallery"), function(){
        $(this).gallerize(gallery_options);
    });
})(jQuery);