/*
* jQuery Backstretch
* Version 1.1
* http://srobbin.com/jquery-plugins/jquery-backstretch/
*
* Add a dynamically-resized background image to the page
*
* Copyright (c) 2010 Scott Robbin (srobbin.com)
* Dual licensed under the MIT and GPL licenses.
*/

(function (jQuery) {

    jQuery.backstretch = function (src, options, callback) {
        var settings = {
            centeredX: false,         // Should we center the image on the X axis?
            centeredY: false,         // Should we center the image on the Y axis?
            speed: 1500                // fadeIn speed for background after image loads (e.g. "fast" or 500)
        },
        rootElement = ("onorientationchange" in window) ? jQuery(document) : jQuery(window), // hack to acccount for iOS position:fixed shortcomings
        imgRatio, bgImg, bgWidth, bgHeight, bgOffset, bgCSS;

        // Extend the settings with those the user has provided
        if (options && typeof options == "object") jQuery.extend(settings, options);

        // Initialize
        jQuery(document).ready(_init);

        // For chaining
        return this;

        function _init() {
            // Prepend image, wrapped in a DIV, with some positioning and zIndex voodoo
            if (src) {
                var container = jQuery("<div />").attr("id", "backstretch")
                                            .css({ left: 0, top: 0, position: "fixed", overflow: "hidden", zIndex: -9999 }),
                    img = jQuery("<img />").css({ position: "relative", display: "none" })
                                      .bind("load", function (e) {
                                          var self = jQuery(this);
                                          imgRatio = jQuery(e.target).width() / jQuery(e.target).height();

                                          _adjustBG(function () {
                                              self.fadeIn(settings.speed, function () {
                                                  if (typeof callback == "function") callback();
                                              });
                                          });
                                      })
                                      .appendTo(container);

                jQuery("body").prepend(container);
                img.attr("src", src); // Hack for IE img onload event

                // Adjust the background size when the window is resized or orientation has changed (iOS)
                jQuery(window).resize(_adjustBG);
            }
        }

        function _adjustBG(fn) {
            bgCSS = { left: 0, top: 0 }
            bgWidth = rootElement.width();
            bgHeight = bgWidth / imgRatio;

            // Make adjustments based on image ratio
            // Note: Offset code provided by Peter Baker (http://ptrbkr.com/). Thanks, Peter!
            if (bgHeight >= rootElement.height()) {
                bgOffset = (bgHeight - rootElement.height()) / 2;
                if (settings.centeredY) jQuery.extend(bgCSS, { top: "-" + bgOffset + "px" });
            } else {
                bgHeight = rootElement.height();
                bgWidth = bgHeight * imgRatio;
                bgOffset = (bgWidth - rootElement.width()) / 2;
                if (settings.centeredX) jQuery.extend(bgCSS, { left: "-" + bgOffset + "px" });
            }

            jQuery("#backstretch img").width(bgWidth).height(bgHeight).css(bgCSS);

            // Executed the passed in function, if necessary
            if (typeof fn == "function") fn();
        }
    };

})(jQuery);