/**
 * Imgbox 1.0 (Requires -my- _a_ center-plugin)
 *
 * Open links that point to images in the same scope in the "ImgBox"
 * Also groupds images in the same scope and adds navigation
 *
 * Usage: jQuery('#random-images, #holiday-photos').imgbox();
 *
 * @class imgbox
 * @param {Object} conf, custom config-object
 *
 * Copyright (c) 2008 Andreas Lagerkvist (andreaslagerkvist.com)
 * Released under a GNU General Public License v3 (http://creativecommons.org/licenses/by/3.0/)
 */
jQuery.fn.imgbox = function(conf) {
        // Config for plug-in
        var config = {
                id: 'imgbox',                           // Id of imgbox container
                show: 'show',                           // Show-animation for imgbox
                hide: 'hide',                           // Hide-animation for imgbox
                speed: 0,                                       // Animation-speed
                loadingText: 'Loading...'
        };
        config = jQuery.extend(config, conf);

        // These are LinksThatPointToImages
        var ltpti = 'a[href$=".jpg"], a[href$=".bmp"], a[href$=".gif"], a[href$=".png"]';

        // Create imgbox container, loader and underlay if not already created
        if(!jQuery('#' +config.id).length) {
                jQuery('<div id="' +config.id +'"></div>').appendTo('body').hide();
                jQuery('<div id="' +config.id +'-loading">' +config.loadingText +'</div>').appendTo('body').hide();
        //      jQuery('<div id="' +config.id +'-underlay"></div>').appendTo('body').css({position: 'fixed', left: '0', top: '0', width: '100%', height: '100%', backgroundColor: '#000', opacity: '0.8', zIndex: '10'}).hide();
        }

        var doImgbox = function() {
                // Create list of images in this scope that will be used as navigation in this "album"
                var loi = ''

                var applyImgbox = function() {
                        // Get information to display in imgbox
                        var href                = jQuery(this).attr('href'), 
                                title           = jQuery(this).attr('title'), 
                                alt                     = jQuery(this).find('img').attr('alt'), 
                                imgTitle        = (title === undefined) ? '' : '<h2>' +title +'</h2>', 
                                imgSrc          = (href === undefined) ? '' : '<p class="image"><img src="' +href +'" alt="" /></p>', 
                                imgDesc         = (alt === undefined) ? '' : '<p class="description">' +alt +'</p>', 
                                imgboxHtml      = imgTitle +imgSrc +imgDesc;

                        // Hide loading, display imgbox and run self on #imgbox (so the list of images acts
                        // as navigation) also add .selected class to currently displayed image in list of images
                        var displayImgbox = function() {
                                jQuery('#' +config.id +'-loading').hide();
                                jQuery('#' +config.id).html(imgboxHtml)[config.show](config.speed);

                        };

                        // Preload image
                        var preload = new Image();
                        preload.src = jQuery(this).attr('href');

                        if(preload.complete) {
                        //      jQuery('#' +config.id +'-underlay').show();
                                displayImgbox();
                        }
                        else {
                        //      jQuery('#' +config.id +'-underlay').show();
                                jQuery('#' +config.id +'-loading').show();

                                preload.onload = function() {
                                        displayImgbox();
                                };
                        }

                        return false;
                };

                var removeImgbox = function() {
					jQuery('#' +config.id)[config.hide](config.speed);
					jQuery('#' +config.id +'-loading').hide();
				}
                // Apply imgbox click-event to all links in the scope, but first unbind same
                // function in case plugin is run twice (after ajax-generated content for example)
                jQuery(this).find(ltpti).hover(applyImgbox,removeImgbox);
        };

        // Always return each...
        return this.each(doImgbox);
};

