(function () {

    var $ = jQuery,
        Abstract = wri.widget.Abstract;

    var BannerSequence = wri.widget.BannerSequence = function () {



        Abstract.apply(this, arguments);
    };
    BannerSequence.prototype = new Abstract({
        className: "BannerSequence",
        container: null,
        ulBanners: null,
        ulControls: null,
        ulOverlays: null,
        _settings: {
            cookie: {
                name: "WRIBannerSeq",
                domain: "",
                path: window.location.pathname,
                expires: "",
                secure: false
            },
            ajax: {
                url: "/home/banner.xml",
                dataType: "xml",
                cache: false //IE7 doesn't load on revisit when cache is enabled, for some reason
            },
            displaySequence: {
                autoPlay: true,
                displayTime: 5000
            }
        },
        init: function () {
            //Create the ul containers and control buttons
            var I = this,
                        ulBanners = this.ulBanners = $("<ul class='banners'/>").appendTo(this.container),
                        ulOverlays = this.ulOverlays = $("<ul class='overlays' />").appendTo(this.container),
                        ulControls = this.ulControls = $("<ul class='controls' />").appendTo(this.container),
                    liPrev = $("<li class='item-prev' data-control=''><a><span></span>Previous</a></li>").appendTo(ulControls),
                        liPlay = $("<li class='item-play'><a><span></span>Play</a></li>").appendTo(ulControls),
                        liPause = $("<li class='item-pause'><a><span></span>Pause</a></li>").appendTo(ulControls),
                        liNext = $("<li class='item-next'><a><span></span>Next</a></li>").appendTo(ulControls);

            this.settings("displaySequence", {
                ul: ulBanners
            });

            this.bind("loadSuccess", this.onLoadSuccess);

            liPrev.click(function () { I.displaySequence.prev(); });
            liPlay.click(function () { I.displaySequence.play(); });
            liPause.click(function () { I.displaySequence.pause(); });
            liNext.click(function () { I.displaySequence.next(); });

            return this;
        },
        onLoadSuccess: function (evt, request) {

            var I = this,
                xml = $(request.responseXML).children("banners"),
                overlays = xml.children("overlay"),
                banners = xml.children("banner");

            //Create the overlays
            overlays.each(function (o, node) {
                var $node = $(node),
                            overlay = $("<li class='item-" + o + "'/>").hide().appendTo(I.ulOverlays),
                            img = $("<img src='" + $node.attr("src").replace(/^\/htdocs\//, "/") + "'/>").appendTo(overlay);
                img.load(function (evt) {
                    overlay.fadeIn("slow");
                });
            });

            //Get the previous view cookie
            var cookieSet = I.settings("cookie"),
                seqCookie = tbelt.util.cookie(cookieSet.name),
                prevOrder = (seqCookie == null || !seqCookie.length) ? [] : seqCookie.split(","),
                order = [];

            //Record the original index of each banner
            banners.each(function (b, banner) {
                $(banner).attr("oindex", b);
            });

            //Only randomize the sequence if we have a previous order cookie
            if (prevOrder.length) {
                banners.sort(function (a, b) {
                    return Math.round(Math.random() - Math.round(Math.random()));
                });
            }

            //Set the sequence cookie
            banners.each(function (b, banner) {
                var $banner = $(banner);
                order.push($banner.attr("oindex"));
            });

            tbelt.util.cookie(cookieSet.name, order.join(","), cookieSet);
            //console.log(prevOrder.join(","));
            //console.log(order.join(","));

            //Create the banners
            banners.each(function (b, banner) {
                var node = $(banner),
                    duration = node.attr("duration") ? parseInt(node.attr("duration")) * 1000 : I.settings("sequence", "displayTime"),
                    banner = $("<li class='item-" + b + "' data-displayTime='" + duration + "'/>").hide().appendTo(I.ulBanners),
                    img = $("<img src='" + node.attr("src") + "'/>").appendTo(banner);
                //$("<a href='#" + b + "'></a>").insertBefore(img).wrap(img);
            });

            var sequence = this.displaySequence = new esf.widget.DisplaySequence(this.settings("displaySequence"));

        }

    });

})();