/*

 * QueryLoader v2 - A simple script to create a preloader for images

 *

 * For instructions read the original post:

 * http://www.gayadesign.com/diy/queryloader2-preload-your-images-with-ease/

 *

 * Copyright (c) 2011 - Gaya Kessler

 *

 * Licensed under the MIT license:

 *   http://www.opensource.org/licenses/mit-license.php

 *

 * Version:  2.2

 * Last update: 03-04-2012

 *

 */

(function($) {





    if (!Array.prototype.indexOf)

	   {

	   Array.prototype.indexOf = function(elt /*, from*/)

             {

             var len  = this.length >>> 0;

             var from = Number(arguments[1]) || 0;

                 from = (from < 0)

                      ? Math.ceil(from)

                      : Math.floor(from);

             if (from < 0)

                 from += len;

 

                 for (; from < len; from++)

                     {

                     if (from in this &&

                     this[from] === elt)

                     return from;

                     }

             return -1;

             };

       }





    var qLimages = new Array;

    var qLdone = 0;

    var qLdestroyed = false;



    var qLimageContainer = "";

    var qLoverlay = "";

    var qLbar = "";

    var qLpercentage = "";

    var qLimageCounter = 0;

    var qLstart = 0;



    var qLoptions = {

        onComplete: function () {},

        backgroundColor: "#000",

        barColor: "#fff",

        barHeight: 1,

        percentage: false,

        deepSearch: true,

        completeAnimation: "fade",

        minimumTime: 500,

        onLoadComplete: function () {

            if (qLoptions.completeAnimation == "grow") {

                var animationTime = 500;

                var currentTime = new Date();

                if ((currentTime.getTime() - qLstart) < qLoptions.minimumTime) {

                    animationTime = (qLoptions.minimumTime - (currentTime.getTime() - qLstart));

                }



                $(qLbar).stop().animate({

                    "width": "100%"

                }, animationTime, function () {

                    $(this).animate({

                        top: "0%",

                        width: "100%",

                        height: "100%"

                    }, 500, function () {

                        $(qLoverlay).fadeOut(500, function () {

                            $(this).remove();

                            qLoptions.onComplete();

                        })

                    });

                });

            } else {

                $(qLoverlay).fadeOut(500, function () {

                    $(qLoverlay).remove();

                    qLoptions.onComplete();

                });

            }

        }

    };



    var afterEach = function () {

        //start timer

        var currentTime = new Date();

        qLstart = currentTime.getTime();



        createPreloadContainer();

        createOverlayLoader();

    };



    var createPreloadContainer = function() {

        qLimageContainer = $("<div></div>").appendTo("body").css({

            display: "none",

            width: 0,

            height: 0,

            overflow: "hidden"

        });

        for (var i = 0; qLimages.length > i; i++) {

            $.ajax({

                url: qLimages[i],

                type: 'HEAD',

                complete: function(data) {

                    if(!qLdestroyed){

                        qLimageCounter++;

                        addImageForPreload(this['url']);

                    }

                }

            });

        }

    };



    var addImageForPreload = function(url) {

        var image = $("<img />").attr("src", url).bind("load", function () {

            completeImageLoading();

        }).appendTo(qLimageContainer);

    };



    var completeImageLoading = function () {

        qLdone++;



        var percentage = (qLdone / qLimageCounter) * 100;

        $(qLbar).stop().animate({

            width: percentage + "%",

            minWidth: percentage + "%"

        }, 200);



        if (qLoptions.percentage == true) {

            $(qLpercentage).text(Math.ceil(percentage) + "%");

        }



        if (qLdone == qLimageCounter) {

            destroyQueryLoader();

        }

    };



    var destroyQueryLoader = function () {

        $(qLimageContainer).remove();

        qLoptions.onLoadComplete();

        qLdestroyed = true;

    };



    var createOverlayLoader = function () {

        qLoverlay = $("<div id='qLoverlay'></div>").css({

            width: "100%",

            height: "100%",

            backgroundColor: qLoptions.backgroundColor,

            backgroundPosition: "fixed",

            position: "fixed",

            zIndex: 666999,

            top: 0,

            left: 0

        }).appendTo("body");

        qLbar = $("<div id='qLbar'></div>").css({

            height: qLoptions.barHeight + "px",

            marginTop: "-" + (qLoptions.barHeight / 2) + "px",

            backgroundColor: qLoptions.barColor,

            width: "0%",

            position: "absolute",

            top: "50%"

        }).appendTo(qLoverlay);

        if (qLoptions.percentage == true) {

            qLpercentage = $("<div id='qLpercentage'></div>").text("0%").css({

                height: "40px",

                width: "100px",

                position: "absolute",

                fontSize: "3em",

                top: "50%",

                left: "50%",

                marginTop: "-" + (59 + qLoptions.barHeight) + "px",

                textAlign: "center",

                marginLeft: "-50px",

                color: qLoptions.barColor

            }).appendTo(qLoverlay);

        }

    };



    var findImageInElement = function (element) {

        var url = "";



        if ($(element).css("background-image") != "none") {

            var url = $(element).css("background-image");

        } else if (typeof($(element).attr("src")) != "undefined" && element.nodeName.toLowerCase() == "img") {

            var url = $(element).attr("src");

        }



        if (url.indexOf("gradient") == -1) {

            url = url.replace(/url\(\"/g, "");

            url = url.replace(/url\(/g, "");

            url = url.replace(/\"\)/g, "");

            url = url.replace(/\)/g, "");



            var urls = url.split(", ");



            for (var i = 0; i < urls.length; i++) {

                if (urls[i].length > 0 && qLimages.indexOf(urls[i]) == -1) {

                    var extra = "";

                    if ($.browser.msie && $.browser.version < 9) {

                        extra = "?" + Math.floor(Math.random() * 3000);

                    }

                    qLimages.push(urls[i] + extra);

                }

            }

        }

    }



    $.fn.queryLoader2 = function(options) {

        if(options) {

            $.extend(qLoptions, options );

        }



        this.each(function() {

            findImageInElement(this);

            if (qLoptions.deepSearch == true) {

                $(this).find("*:not(script)").each(function() {

                    findImageInElement(this);

                });

            }

        });



        afterEach();



        return this;

    };



})(jquery);

