/*
* Lazy Load - jQuery plugin for lazy loading images
*
* Copyright (c) 2007-2009 Mika Tuupola
*   Updated by Jeremy Pollock to consume less bandwidth
*
* Licensed under the MIT license:
*   http://www.opensource.org/licenses/mit-license.php
*
* Project home:
*   http://www.appelsiini.net/projects/lazyload
*
* Version:  1.4.0
*   With updates - Version:  1.4.1
*
*/
(function($) {

    $.fn.lazyload = function(options) {
        var settings = {
            threshold: 0,
            failurelimit: 0,
            event: "scroll",
            effect: "show",
            container: window
        };

        if (options) {
            $.extend(settings, options);
        }

        var checkAndReveal = function(event) {
            var counter = 0;
            elements.each(function() {
                if (!$.belowthefold(this, settings) && !$.rightoffold(this, settings)) {
                    $(this).trigger("appear");
                } else {
                    // order of operations - prefix increment comes before evaluation of >
                    if (++counter > settings.failurelimit) {
                        return false;
                    }
                }
            });
            /* Remove image from array so it is not looped next time. */
            var temp = $.grep(elements, function(element) {
                return !element.loaded;
            });
            elements = $(temp);
        }

        /* Fire one scroll event per scroll. Not one scroll event per image. */
        var elements = this;
        if ("scroll" == settings.event) {
            $(settings.container).bind("scroll", checkAndReveal);
        }

        var returnValue = this.each(function() {
            var self = this;
            if (("scroll" != settings.event || $.belowthefold(self, settings) || $.rightoffold(self, settings)) && !$(self).attr('src')) {
                if (settings.placeholder) {
                    $(self).attr("src", settings.placeholder);
                } else {
                    $(self).removeAttr("src");
                }
                self.loaded = false;
            } else if ($(self).attr('src')) {
                self.loaded = true;
            }

            /* When appear is triggered load original image. */
            $(self).one("appear", function() {
                if (!this.loaded) {
                    self.loaded = true;
                    $(self).attr("src", $(self).attr("original"));
                };
            });

            /* When wanted event is triggered load original image */
            /* by triggering appear.                              */
            if ("scroll" != settings.event) {
                $(self).bind(settings.event, function(event) {
                    if (!self.loaded) {
                        $(self).trigger("appear");
                    }
                });
            }
        });

        // in case there are images already visible that need revealing
        checkAndReveal();

        return returnValue;
    };

    /* Convenience methods in jQuery namespace.           */
    /* Use as  $.belowthefold(element, {threshold : 100, container : window}) */

    $.belowthefold = function(element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).height() + $(window).scrollTop();
        }
        else {
            var fold = $(settings.container).offset().top + $(settings.container).height();
        }
        return fold <= $(element).offset().top - settings.threshold;
    };

    $.rightoffold = function(element, settings) {
        if (settings.container === undefined || settings.container === window) {
            var fold = $(window).width() + $(window).scrollLeft();
        }
        else {
            var fold = $(settings.container).offset().left + $(settings.container).width();
        }
        return fold <= $(element).offset().left - settings.threshold;
    };

    /* Custom selectors for your convenience.   */
    /* Use as $("img:below-the-fold").something() */

    $.extend($.expr[':'], {
        "below-the-fold": "$.belowthefold(a, {threshold : 0, container: window})",
        "above-the-fold": "!$.belowthefold(a, {threshold : 0, container: window})",
        "right-of-fold": "$.rightoffold(a, {threshold : 0, container: window})",
        "left-of-fold": "!$.rightoffold(a, {threshold : 0, container: window})"
    });

})(jQuery);

// initialize the lazy load behavior on page load
$(document).ready(
    function() {
        $('div.productImage a img').lazyload({
            threshold: 1000,
            placeholder: '/Images/grey.gif'
        });
    }
);

// hack for iPad, disabling lazyload
$(document).ready(
    function() {
        var iPadUserAgentMatch = navigator.userAgent.match(/\biPad\b/i)
        if(iPadUserAgentMatch != null && iPadUserAgentMatch.length) {
            $('div.productImage a img').each(
                function(index, img) {
                    img.loaded = true;
                    $(img).attr('src', $(img).attr('original'));
                }
            );
        }
    }
);


