//Background position animation
(function ($) {
    $.extend($.fx.step, {
        backgroundPosition: function (fx) {
            if (fx.state === 0 && typeof fx.end == 'string') {
                var start = $.curCSS(fx.elem, 'backgroundPosition');
                start = toArray(start);
                fx.start = [start[0], start[2]];
                var end = toArray(fx.end);
                fx.end = [end[0], end[2]];
                fx.unit = [end[1], end[3]];
            }
            var nowPosX = [];
            nowPosX[0] = ((fx.end[0] - fx.start[0]) * fx.pos) + fx.start[0] + fx.unit[0];
            nowPosX[1] = ((fx.end[1] - fx.start[1]) * fx.pos) + fx.start[1] + fx.unit[1];
            fx.elem.style.backgroundPosition = nowPosX[0] + ' ' + nowPosX[1];

            function toArray(strg) {
                strg = strg.replace(/left|top/g, '0px');
                strg = strg.replace(/right|bottom/g, '100%');
                strg = strg.replace(/([0-9\.]+)(\s|\)|$)/g, "$1px$2");
                var res = strg.match(/(-?[0-9\.]+)(px|\%|em|pt)\s(-?[0-9\.]+)(px|\%|em|pt)/);
                return [parseFloat(res[1], 10), res[2], parseFloat(res[3], 10), res[4]];
            }
        }
    });
})(jQuery);
//Background stretch
;
(function ($) {
    $.backstretch = function (src, options, callback) {
        var defaultSettings = {
            centeredX: true,
            centeredY: true,
            speed: 0
        },
            container = $("#backstretch"),
            settings = container.data("settings") || defaultSettings,
            existingSettings = container.data('settings'),
            rootElement = ("onorientationchange" in window) ? $(document) : $(window),
            imgRatio, bgImg, bgWidth, bgHeight, bgOffset, bgCSS;
        if (options && typeof options == "object") $.extend(settings, options);
        if (options && typeof options == "function") callback = options;
        $(document).ready(_init);
        return this;

        function _init() {
            if (src) {
                var img;
                if (container.length == 0) {
                    container = $("<div />").attr("id", "backstretch").css({
                        left: 0,
                        top: 0,
                        position: "fixed",
                        overflow: "hidden",
                        zIndex: -999999,
                        margin: 0,
                        padding: 0,
                        height: "100%",
                        width: "100%"
                    });
                } else {
                    container.find("img").addClass("deleteable");
                }
                img = $("<img />").css({
                    position: "absolute",
                    display: "none",
                    margin: 0,
                    padding: 0,
                    border: "none",
                    zIndex: -999999
                }).bind("load", function (e) {
                    var self = $(this),
                        imgWidth, imgHeight;
                    self.css({
                        width: "auto",
                        height: "auto"
                    });
                    imgWidth = this.width || $(e.target).width();
                    imgHeight = this.height || $(e.target).height();
                    imgRatio = imgWidth / imgHeight;
                    _adjustBG(function () {
                        self.fadeIn(settings.speed, function () {
                            container.find('.deleteable').remove();
                            if (typeof callback == "function") callback();
                        });
                    });
                }).appendTo(container);
                if ($("body #backstretch").length == 0) {
                    $("body").append(container);
                }
                container.data("settings", settings);
                img.attr("src", src);
                $(window).resize(_adjustBG);
            }
        }

        function _adjustBG(fn) {
            try {
                bgCSS = {
                    left: 0,
                    top: 0
                }
                bgWidth = rootElement.width();
                bgHeight = bgWidth / imgRatio;
                if (bgHeight >= rootElement.height()) {
                    bgOffset = (bgHeight - rootElement.height()) / 2;
                    if (settings.centeredY) $.extend(bgCSS, {
                        top: "-" + bgOffset + "px"
                    });
                } else {
                    bgHeight = rootElement.height();
                    bgWidth = bgHeight * imgRatio;
                    bgOffset = (bgWidth - rootElement.width()) / 2;
                    if (settings.centeredX) $.extend(bgCSS, {
                        left: "-" + bgOffset + "px"
                    });
                }
                $("#backstretch, #backstretch img:not(.deleteable)").width(bgWidth).height(bgHeight).filter("img").css(bgCSS);
            } catch (err) {}
            if (typeof fn == "function") fn();
        }
    };
})(jQuery);
(function ($) {
    $.BGP = function (options) {
        //Set the default
        var defaults = {
            backgroundStretch: "",
            backImage: "",
            midImage: "",
            foreImage: "",
            backTime: 0,
            midTime: 0,
            foreTime: 0,
            backEase: '',
            midEase: '',
            foreEase: '',
            backX: "0px",
            backY: "0px",
            midX: "0px",
            midY: "0px",
            foreX: "0px",
            foreY: "0px",
            effect: "backgroundPosition",
            slideShow: false,
            slideShowSpeed: 1000,
            slideShowInterval: 5000,
            slideShowImages: ["images/bokeh1.jpg", "images/bokeh2.jpg", "images/bokeh3.jpg", "images/bokeh4.jpg", "images/bokeh5.jpg"]
        }
        var options2 = $.extend(defaults, options);
        return $(document).each(function () {
            var o = options2;
            //Images
            var backgroundStretch = o.backgroundStretch;
            var backImage = o.backImage;
            var midImage = o.midImage;
            var foreImage = o.foreImage;
            //Timing
            var backTime = o.backTime;
            var midTime = o.midTime;
            var foreTime = o.foreTime;
            //Easing
            var backEase = o.backEase;
            var midEase = o.midEase;
            var foreEase = o.foreEase;
            //X & Y Coor.
            var backX = o.backX;
            var backY = o.backY;
            var midX = o.midX;
            var midY = o.midY;
            var foreX = o.foreX;
            var foreY = o.foreY;
            //Slide show variables
            var slideShow = o.slideShow;
            var slideShowSpeed = o.slideShowSpeed;
            var slideShowInterval = o.slideShowInterval;
            var images = o.slideShowImages;
            //effects
            var effect = o.effect;
            //backgroundPosition

            function midgroundFunc() {

                var $midground = $("#midground");

                if (effect == "backgroundPosition") {
                    $midground.css({
                        backgroundPosition: '0px 0px'
                    });
                    $midground.animate({
                        backgroundPosition: "(" + midX + " " + midY + ")"
                    }, midTime, midEase);
                } else if (effect == "fade") {

                    $midground.hide(function () {

                        $(this).fadeIn(midTime, function () {

                            $(this).fadeOut(midTime);

                        });

                    });

                }
            }

            function foregroundFunc() {

                var $foreground = $('#foreground');

                if (effect == "backgroundPosition") {
                    $foreground.css({
                        backgroundPosition: '0px 0px'
                    });
                    $foreground.animate({
                        backgroundPosition: "(" + foreX + " " + foreY + ")"
                    }, foreTime, foreEase);
                } else if (effect == "fade") {

                    $foreground.hide(function () {

                        $(this).fadeIn(foreTime, function () {

                            $(this).fadeOut(foreTime);

                        });

                    });

                }
            }

            function backgroundFunc() {

                var $backGround = $('#back');

                if (effect == "backgroundPosition") {
                    $backGround.css({
                        backgroundPosition: '0px 0px'
                    });
                    $backGround.animate({
                        backgroundPosition: "(" + backX + " " + backY + ")"
                    }, backTime, backEase);
                } else if (effect == "fade") {

                    $backGround.hide(function () {

                        $(this).fadeIn(foreTime, function () {

                            $(this).fadeOut(foreTime);

                        });

                    });

                }
            }
            $(document).ready(function () {

                var $foreground = $('#foreground');
                var $midground = $("#midground");
                var $backGround = $('#back');

                if (slideShow == false) {
                    $midground.css({
                        backgroundImage: 'url(' + midImage + ')'
                    });
                    $foreground.css({
                        backgroundImage: 'url(' + foreImage + ')'
                    });
                    $backGround.css({
                        backgroundImage: 'url(' + backImage + ')'
                    });
                    $.backstretch(backgroundStretch);
                    midgroundFunc();
                    foregroundFunc();
                    backgroundFunc();


                    //---------------------------------------------------
                    //===MUST HANDLE INTERVAL TIMING HERE FOR EACH EFFECT
                    //---------------------------------------------------
                    if (effect == "backgroundPosition") {
                        setInterval(midgroundFunc, midTime + 100);
                        setInterval(foregroundFunc, foreTime + 100);
                        setInterval(backgroundFunc, backTime + 100);
                    }



                } else {
                    $(images).each(function () {
                        $('<img/>')[0].src = this;
                    });
                    var index = 0;
                    $.backstretch(images[index], {
                        speed: slideShowSpeed
                    });
                    setInterval(function () {
                        index = (index >= images.length - 1) ? 0 : index + 1;
                        $.backstretch(images[index]);
                    }, slideShowInterval);
                    $midground.css({
                        backgroundImage: 'url(' + midImage + ')'
                    });
                    $foreground.css({
                        backgroundImage: 'url(' + foreImage + ')'
                    });
                    $backGround.css({
                        backgroundImage: 'url(' + backImage + ')'
                    });
                    $.backstretch(backgroundStretch);
                    midgroundFunc();
                    foregroundFunc();
                    backgroundFunc();


                    //---------------------------------------------------
                    //===MUST HANDLE INTERVAL TIMING HERE FOR EACH EFFECT
                    //---------------------------------------------------
                    if (effect == "backgroundPosition") {
                        setInterval(midgroundFunc, midTime + 100);
                        setInterval(foregroundFunc, foreTime + 100);
                        setInterval(backgroundFunc, backTime + 100);
                    } else {
                        setInterval(midgroundFunc, midTime + midTime + 100);
                        setInterval(foregroundFunc, foreTime + foreTime + 100);
                        setInterval(backgroundFunc, backTime + backTime + 100);
                    }
                }
            });
        }); //end BGP
    };
})(jQuery);