var Counter = function (options) {
    var _this = this;
    this.settings = $.extend(Counter.defaults, options || {});
    this.digits$ = [];
    this.currentNumber = this.settings.startValue;

    this.startValueString = this.settings.startValue.toString();
    this.endValueString = this.settings.endValue.toString();

    this.maxDigits = Math.max(this.startValueString.length, this.endValueString.length);
    this.maxFrames = this.settings.digitFrameCount * 10;
    this.maxFrame = 10 * this.settings.digitFrameCount;

    this.staticImageCount = (function () {
        var intervalString = _this.settings.countInterval.toString(),
            rx = /0/g;
        if (rx.test(intervalString)) {
            return intervalString.match(rx).length - 1;
        }
        return 0;
    } ());

    this.oldIe = $.browser.msie && $.browser.version.substr(0, 1) <= 7;
};

Counter.defaults = {
    image: '/images/digits-3.png',
    separatorImage: '/images/comma.png',
    digitFrameCount: 6,
    digitWidth: 67,
    digitHeight: 92,
    startValue: 0,
    endValue: 25000,
    countInterval: 100,
    interval: 48,
    frameInterval: 7
};

Counter.prototype.getFrameNumber = function (numeral) {
    return numeral * this.settings.digitFrameCount;
};

Counter.prototype.getVerticalPositionFromFrameNumber = function (frameNumber) {
    return -(this.settings.digitHeight * frameNumber);
};

Counter.prototype.setPositionByFrame = function (element$, frameNumber) {
    if (this.oldIe) {
        element$.css({ 'background-position-y': this.getVerticalPositionFromFrameNumber(frameNumber) + 'px' });
    } else {
        element$.css({ 'background-position': '0 ' + this.getVerticalPositionFromFrameNumber(frameNumber) + 'px' });
    }
};

Counter.prototype.getFrame = function (element$) {
    var backgroundPosition = this.oldIe ? element$.css('background-position-y') : element$.css('background-position'),
    spaceIndex = backgroundPosition.indexOf(' '),
    verticalPosition = parseInt(backgroundPosition.substring(spaceIndex), 10);

    return Math.abs(verticalPosition / this.settings.digitHeight);
};

Counter.prototype.getNumeral = function (element$) {
    return this.getFrame(element$) / this.settings.digitFrameCount;
};

Counter.prototype.setPosition = function (element$, val) {
    var frameNumber = this.getFrameNumber(val);
    this.setPositionByFrame(element$, frameNumber);
};

Counter.prototype.createElement = function (index) {
    var idx = this.maxDigits - 1 - index,
        newElement$ = $('<span id="cnt_' + idx + '" class="cntDigit" />');

    if (this.maxDigits - 1 - index <= this.staticImageCount) {
        newElement$.addClass('static');
    }

    return newElement$;
};

Counter.prototype.initializeDigit = function (newElement$) {
    newElement$.css({
        height: this.settings.digitHeight,
        background: 'url(' + this.settings.image + ')',
        width: this.settings.digitWidth,
        display: 'block',
        float: 'left'
    });
};

Counter.prototype.setDigits = function () {
    var i,
        digitArr = this.startValueString.split(''),
        digitArrLength = digitArr.length,
        digitVal;

    for (i = 0; i <= digitArrLength - 1; ++i) {
        digitVal = +digitArr[i];
        if (digitVal > 0) {
            this.setPosition(this.digits$[digitArrLength - i - 1], digitVal);
        }
    }
};

Counter.prototype.initializeDigits = function (element) {
    this.attachDigits(element);
    this.setDigits();
};

Counter.prototype.attachDigits = function (element) {
    var i, newElement$, digitVal;

    for (i = this.maxDigits - 1; i >= 0; i--) {
        newElement$ = this.createElement(i, digitVal);
        this.initializeDigit(newElement$);
        this.digits$.push(newElement$);
        $(element).prepend(newElement$);

        if ((this.maxDigits - i) % 3 === 0) {
            $(element).prepend('<span style="display: block; float: left; width: 22px; height: 99px; background: url(' + this.settings.separatorImage + ') no-repeat 0 0;" />');
        }
    }
};

Counter.prototype.advanceDigitToFrame = function (element$, newFrameNumber) {
    if (newFrameNumber > 10 * this.settings.digitFrameCount) {
        newFrameNumber = 0;
    }
};

Counter.prototype.advanceDigitToNextNumeral = function (index) {
    var numeral = this.getNumeral(this.digits$[index]);
    ++numeral;
    this.advanceDigitToNumeral(index, numeral % 10);
};

Counter.prototype.advanceDigitToNumeral = function (index, numeral) {
    var _this = this,
        element$ = this.digits$[index],
        currentFrame = this.getFrame(element$),
        goalFrame = this.getFrameNumber(numeral),
        frameInterval = (index + 1) * (_this.settings.frameInterval / 2);

    if (currentFrame === _this.maxFrame) {
        currentFrame = 0;
    }

    if (numeral === 0) {
        this.advanceDigitToNextNumeral(index + 1);
    }

    function _advanceFrame() {
        ++currentFrame;
        if (currentFrame <= goalFrame || (goalFrame === 0 && currentFrame <= _this.maxFrame)) {
            _this.setPositionByFrame(element$, currentFrame);
            if (currentFrame < goalFrame || (goalFrame === 0 && currentFrame <= _this.maxFrame)) {
                setTimeout(_advanceFrame, frameInterval);
            }
        }
    }
    _advanceFrame();
};

Counter.prototype.advanceCounterToValue = function (value) {
    var _this = this,
        intervalId,
        lsdIndex = this.staticImageCount + 1;

    intervalId = setInterval(function () {
        _this.currentNumber = _this.currentNumber + _this.settings.countInterval;
        if (_this.currentNumber > value) {
            clearInterval(intervalId);
        } else {
            _this.advanceDigitToNumeral(lsdIndex, (_this.currentNumber / _this.settings.countInterval) % 10);
        }
    }, this.settings.interval);
};

Counter.prototype.start = function () {
    this.advanceCounterToValue(this.settings.endValue);
};

Counter.prototype.init = function (element) {
    this.initializeDigits(element);
};

(function ($) {
    $.fn.counter = function (options) {
        this.each(function () {
            var counter = new Counter(options);
            counter.init(this);
            counter.start();
        });
    };
} (jQuery));

// IE PNG fix multiple filters
(function ($) {
    if (!$) return;
    $.fn.extend({
        fixPNG: function(sizingMethod, forceBG) {
                if (!($.browser.msie)) return this;
                var emptyimg = "/SiteAssets/css/resources/blank.gif"; //Path to empty 1x1px GIF goes here
                sizingMethod = sizingMethod || "scale"; //sizingMethod, defaults to scale (matches image dimensions)
                this.each(function() {
                        var isImg = (forceBG) ? false : jQuery.nodeName(this, "img"),
                                imgname = (isImg) ? this.src : this.currentStyle.backgroundImage,
                                src = (isImg) ? imgname : imgname.substring(5,imgname.length-2);
                        this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + sizingMethod + "')";
                    if (isImg) { this.src = emptyimg; }
                    else { this.style.backgroundImage = "url(" + emptyimg + ")"; }
            });
                return this;
                }
            });
})(jQuery);


//*
// Meridian Animated Banners
//*
Meridian.Publisher = {
    subscribers: {
        any: []
    },
    subscribe: function (fn, type, context) {
        type = type || 'any';
        fn = typeof fn === "function" ? fn : context[fn];

        if (typeof this.subscribers[type] === 'undefined') {
            this.subscribers[type] = [];
        }
        this.subscribers[type].push({ fn: fn, context: context || this });
    },
    fire: function (type, arg) {
        this.notifySubscribers('publish', type, arg);
    },
    notifySubscribers: function (action, type, arg, context) {
        var pubtype = type || 'any',
            subscribers = this.subscribers[pubtype],
            i,
            max = subscribers ? subscribers.length : 0;

        for (i = 0; i < max; i += 1) {
            if (action === 'publish') {
                subscribers[i].fn.call(subscribers[i].context, arg);
            }
        }
    },
    makePublisher: function (o) {
        var i;
        for (i in Meridian.Publisher) {
            if (Meridian.Publisher.hasOwnProperty(i) && typeof Meridian.Publisher[i] === 'function') {
                o[i] = Meridian.Publisher[i];
            }
        }
        o.subscribers = { any: [] };
    }
};

if (typeof Object.create !== 'function') {
    Object.create = function (o) {
        function F() { }
        F.prototype = o;
        return new F();
    };
}

Meridian.AnimatedBanner = function () {
    this._active = false;
    this._beatDuration = 600;
    this.imageUrl = '';
    this.container$ = $('#banner-container');
    this.wrapperSelector = '.aBanner';
};

Meridian.AnimatedBanner.prototype.initialize = function () {
    var that = this,
    	wrapperMarkup,
		navButton$ = $('a[rel="' + this.imageUrl + '"]', Meridian.Banners.$bannerNav);

    if (navButton$.length && navButton$.attr('rel') !== navButton$.attr('href')) {
        this.url = navButton$.attr('href');
    }

    wrapperMarkup = (this.url && this.url.length > 0) ? '<a href="' + this.url + '" class="' + this.wrapperSelector.substring(1) + '" />' : '<div class="' + this.wrapperSelector.substring(1) + '" />';
    this.wrapper$ = $(wrapperMarkup).delegate('div', 'click', function () {
    	location.href = that.url;
    });

    this.loadAssets();
};

Meridian.AnimatedBanner.prototype.loadRates = function () {
    var IDs = {
        variable: 17,
        fixed: 24
    }, rates$, vr, fr, banner = this,
		rates = Meridian.AnimatedBanner.prototype.rates,
		formatRate = function (rate) {
		    var r = ($.isArray(rate) ? rate[0].split('') : rate.split('')),
				i, m = '',
				character,
				width = [32, 26, 36, 30, 35, 31, 34, 31, 33, 32, 12, 40],
				getWidth = function (character) {
				    if (character === '.') {
				        return width[10];
				    } else if (character === '%') {
				        return width[11];
				    } else {
				        return width[+character];
				    }
				};

		    for (i = 0; i < r.length; ++i) {
		        character = r[i];
		        character = (character === '.' ? 'period' : character);
		        character = (character === '%' ? 'percent' : character);
		        m += '<img alt="' + r[i] + '" width="' + getWidth(r[i]) + '" src="/SiteAssets/images/banners/common/' + character + '.png" />';
		    }
		    return m;
		};

    if (!rates) {
        rates = Meridian.AnimatedBanner.prototype.rates = Rates.getAllMortgageRates();
    }
    if (rates) {
        vr = formatRate($.getItemByProperty(rates, 'ID', IDs.variable.toString()).BestRate + '%');
        fr = formatRate($.getItemByProperty(rates, 'ID', IDs.fixed.toString()).BestRate + '%');
        rates$ = $('<div class="variable rate">' + vr + '</div><div class="fixed rate">' + fr + '</div>');
        if (!$('.rate', this.rateBox$).length) {
            this.rateBox$.append(rates$);
        }
    }
};

Meridian.AnimatedBanner.prototype.addElement = function (element$) {
    return element$.appendTo(this.wrapper$);
};

Meridian.AnimatedBanner.prototype.addItem = function (imageUrl, width, height, url) {
    var assetPath = this.assetPath,
		imgSrc = assetPath + imageUrl,
		markup = (function () {
		    var m;
		    if (arguments.length === 2) {
		        url = width;
		    }
		    m = '<img src="' + imgSrc + '"' 
		    	+ (width > 0 ? ' width="' + width + '"' : '') 
		    	+ (height > 0 ? ' height="' + height + '"' : '') 
		    	+ ' />';
		    
			if(url) {
				m = '<a href="' + url + '">' + m + '</a>';
			}	
		    	
		    m = '<div>' + m + '</div>';
		    return m;
		} ()),
		el$ = $(markup);

    if (imageUrl.substring(imageUrl.length - 4) === '.png' && $.browser.msie) {
        if (parseInt($.browser.version, 10) <= 8) {
            el$.find('img').fixPNG();        
        }
    }
    return el$.appendTo(this.wrapper$);
};

Meridian.AnimatedBanner.prototype.enqueue = function () {
    var elem$, obj, dur, delay,
		wrapper$ = this.wrapper$;

    if (arguments.length === 1) {
        wrapper$.queue(arguments[0]);
    } else {
        elem$ = arguments[0];
        obj = arguments[1];
        dur = arguments[2] || this._beatDuration;
        delay = arguments[3];

        wrapper$.queue(function () {
        	if(delay) {
				setTimeout(function () {
					elem$.animate(obj, dur, function () { wrapper$.dequeue(); });
				}, delay);
			} else {
            elem$.animate(obj, dur, function () { wrapper$.dequeue(); });
			}
        });
    }
    return this;
};

Meridian.AnimatedBanner.prototype.show = function (imageUrl) {
    this._active = (this.imageUrl === imageUrl);
    if (this._active === true) {
        this.wrapper$.show();
        this.container$.append(this.wrapper$);
        this.setPositions();
        this.animate();
    }
};

Meridian.AnimatedBanner.prototype.hide = function (imageUrl) {
    this._active = (this.imageUrl === imageUrl);
    if (this._active === true) {
        this.wrapper$.remove().clearQueue();
    }
};

Meridian.BannerController = {
    banners: [],
    bannerLoaded: function (imageUrl) {
        Meridian.BannerController.fire('bannerLoaded', imageUrl);
    },
    bannerUnloaded: function (imageUrl) {
        Meridian.BannerController.fire('bannerUnloaded', imageUrl);
    },
    init: function () {
        var i = 0,
			proto = new Meridian.AnimatedBanner(),
			addBanner = function (options) {
			    var banner = Object.create(proto),
					settings = $.extend({
					    imageUrl: '',
					    assetPath: '',
					    loadAssets: function () { },
					    setPositions: function () { },
					    animate: function () { }
					}, options);

			    banner.imageUrl = settings.imageUrl;
			    banner.url = settings.url;
			    banner.assetPath = settings.assetPath;
			    banner.loadAssets = settings.loadAssets;
			    banner.setPositions = settings.setPositions;
			    banner.animate = settings.animate;
			    banner.initialize();
			    Meridian.BannerController.banners.push(banner);
			};

        Meridian.Banners.bannerLoaded = Meridian.BannerController.bannerLoaded;
        Meridian.Banners.bannerUnloaded = Meridian.BannerController.bannerUnloaded;

        Meridian.Publisher.makePublisher(this);

        addBanner({
            imageUrl: '/SplashBanners/point-giveaway.jpg',
            assetPath: '/SiteAssets/images/banners/point-giveaway/',
            loadAssets: function () {
                this.digitContainer$ = this.addElement($('<div class="digitContainer" />'));
            },
            setPositions: function () {
                this.digitContainer$.css({ left: 208, top: 120 });
            },
            animate: function () {
                this.digitContainer$.empty().counter({
                    image: '/SiteAssets/images/banners/point-giveaway/digits-3.png',
                    separatorImage: '/SiteAssets/images/banners/point-giveaway/comma.png'
                });
            }
        });

        addBanner({
            imageUrl: '/dcu/SplashBanners/point-giveaway.jpg',
            assetPath: '/SiteAssets/images/banners/point-giveaway/',
            loadAssets: function () {
                this.digitContainer$ = this.addElement($('<div class="digitContainer" />'));
            },
            setPositions: function () {
                this.digitContainer$.css({ left: 208, top: 120 });
            },
            animate: function () {
                this.digitContainer$.empty().counter({
                    image: '/SiteAssets/images/banners/point-giveaway/digits-3.png',
                    separatorImage: '/SiteAssets/images/banners/point-giveaway/comma.png'
                });
            }
        });

        addBanner({
            imageUrl: '/SplashBanners/retail-banking.jpg',
            assetPath: '/SiteAssets/images/banners/retail-banking/',
            loadAssets: function () {
                this.mouthSmile$ = this.addItem('mouth-smile.gif', 101, 29);
                this.newOnlineBanking$ = this.addItem('new-online-banking-fs8.png', 222, 57);
                this.comingYourWay$ = this.addItem('coming-your-way-fs8.png', 234, 25);
                this.smileOnYourFace$ = this.addItem('smile-on-your-face-fs8.png', 178, 49);
                this.newFeatures$ = this.addItem('new-features.png', 282, 40);
                
                this.personalizedMessaging$ = this.addItem('personalized-messaging.png', 320, 24);
                this.easierToUse$ = this.addItem('easier-to-use-fs8.png', 166, 20);
                this.improvedLookAndFeel$ = this.addItem('improved-look-and-feel.png', 320, 29);
                this.messageCentre$ = this.addItem('message-centre.png', 320, 27);
                this.openAccountsOnline$ = this.addItem('open-accounts-online-fs8.png', 284, 24);
				this.eStatements$ = this.addItem('estatements.png', 320, 22);
                
				this.imagineThat$ = this.addItem('imagine-that-full-fs8.png', 218, 217);
            },
            setPositions: function () {
                this.mouthSmile$.css({ left: 318, top: 159, opacity: 0 });
                this.newOnlineBanking$.css({ left: 500, top: 108, opacity: 1 });
                this.comingYourWay$.css({ left: 500, top: 183, opacity: 1 });
                this.smileOnYourFace$.css({ left: 500, top: 154, opacity: 0 });
                this.newFeatures$.css({ left: 500, top: 85, opacity: 0 });
                
                this.personalizedMessaging$.css({ left: 500, top: 210, opacity: 0 });
                this.easierToUse$.css({ left: 500, top: 210, opacity: 0 });
                this.improvedLookAndFeel$.css({ left: 500, top: 210, opacity: 0 });
                this.messageCentre$.css({ left: 500, top: 210, opacity: 0 });
                this.openAccountsOnline$.css({ left: 500, top: 210, opacity: 0 });
                this.eStatements$.css({ left: 500, top: 210, opacity: 0 });
                
				this.imagineThat$.css({ left: 805, top: 87, opacity: 0 });
            },
            animate: function () {
                var banner = this,
					beatDuration = banner._beatDuration,
					hiddenY = 210,
					bottomY = 180,
					middleY = 150,
					topY = 120;

				setTimeout(function () {
                    
	                banner.enqueue(banner.mouthSmile$, { opacity: 1 })
						.enqueue(banner.comingYourWay$, { opacity: 0 })
						.enqueue(banner.newOnlineBanking$, { top: 84 })
						.enqueue(banner.smileOnYourFace$, { opacity: 1 })
						.enqueue(function () {
						    setTimeout(function () {
						        banner.newOnlineBanking$.animate({ opacity: 0 }, beatDuration);
						        banner.smileOnYourFace$.animate({ opacity: 0 }, beatDuration, function () { banner.wrapper$.dequeue(); });
						    }, beatDuration * 2);
						})
						.enqueue(banner.newFeatures$, { opacity: 1 })
						.enqueue(function () {
						    banner.personalizedMessaging$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.personalizedMessaging$.animate({ top: middleY }, beatDuration, 'linear');
						    banner.easierToUse$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.personalizedMessaging$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear');
						    banner.easierToUse$.animate({ top: middleY, filter: '' }, beatDuration, 'linear');
						    banner.improvedLookAndFeel$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.easierToUse$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear');
						    banner.improvedLookAndFeel$.animate({ top: middleY }, beatDuration, 'linear');
						    banner.messageCentre$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.improvedLookAndFeel$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear');
						    banner.messageCentre$.animate({ top: middleY }, beatDuration, 'linear');
						    banner.openAccountsOnline$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.messageCentre$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear');
						    banner.openAccountsOnline$.animate({ top: middleY }, beatDuration, 'linear');
						    banner.eStatements$.animate({ top: bottomY, opacity: 1 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.openAccountsOnline$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear');
						    banner.eStatements$.animate({ top: middleY }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						}).enqueue(function () {
						    banner.eStatements$.animate({ top: topY, opacity: 0 }, beatDuration, 'linear', function () { banner.wrapper$.dequeue(); });
						})
						.enqueue(function () {
						    setTimeout(function () {
						        banner.newFeatures$.animate({ opacity: 0 }, beatDuration, function () { banner.wrapper$.dequeue(); });
						    }, beatDuration);
						})
						.enqueue(banner.newOnlineBanking$, { top: 108 })
						.enqueue(banner.newOnlineBanking$, { opacity: 1 })
						.enqueue(banner.comingYourWay$, { opacity: 1 })
						.enqueue(banner.imagineThat$, { opacity: 1 });
                    
                                                  
                    }, beatDuration * 2);


            }
        });

        addBanner({
            imageUrl: '/personal-banking/investments/Banners/smarter-rsp-planning.jpg',
            setPositions: function () {
                var markup = '<map id="investment-map" name="investment-map">';
                markup += '<area shape="circle" coords="654,195,60" href="/personal-banking/investments/products/online-advantage-savings/" alt="RRSP Savings Account" />';
                markup += '<area shape="circle" coords="787,195,60" href="/personal-banking/investments/products/Escalator-GIC/" alt="Escalator GIC" />';
                markup += '<area shape="circle" coords="919,195,60" href="/personal-banking/investments/products/market-secure-gic/" alt="Market Secure GICs" />';
                markup += '<area shape="circle" coords="1049,195,60" href="/personal-banking/investments/plans/tfsa/" alt="TFSA Savings Account" />';
                markup += '</map>';

                $('#banner')
                	.append(markup)
					.find('img')
					.attr({ usemap: '#investment-map' });
			}
		});
					
		addBanner({
			imageUrl: '/SplashBanners/imagine-that-service.jpg', 
			assetPath: '/SiteAssets/images/banners/imagine-that-service/',
			loadAssets: function () {
				this.aBetterMortgageRate$ = this.addItem('a-better-mortgage-rate.png', 350, 32);
				this.so$ = this.addItem('so.png', 41, 32);
				this.you$ = this.addItem('you.png', 63, 32);
				this.pay$ = this.addItem('pay.png', 62, 32);
				this.down$ = this.addItem('down.png', 85, 32);
				this.yourMortgage$ = this.addItem('your-mortgage.png', 233, 32);
				this.faster$ = this.addItem('faster.png', 94, 32);
				this.and$ = this.addItem('and.png', 64, 32);
				this.live$ = this.addItem('live.png', 54, 32);
				this.it$ = this.addItem('it.png', 25, 32);
				this.up$ = this.addItem('up.png', 47, 32);
				this.sooner$ = this.addItem('sooner.png', 113, 32);
				this.imagineThat$ = this.addItem('imagine-that.png', 239, 219);
				this.rateBox$ = this.addItem('rate-box.png', 357, 152);
				this.rateBoxShadow$ = this.addItem('rate-box-shadow.png', 357, 53);
				this.wantToBeMortgageFreeSooner$ = this.addItem('want-to-be-mortgage-free-sooner.png', 402, 29);
				this.justAsk$ = this.addItem('just-ask.png', 97, 29);
				this.yourMoney$ = this.addItem('your-money-your-way-imagine-that.png', 301, 17);
			}, 
			setPositions: function () {
				this.aBetterMortgageRate$.css({ left: 480, top: 100, opacity: 0 });
				this.so$.css({ left: 830, top: 0, opacity: 0 });
				this.you$.css({ left: 871, top: 0, opacity: 0 });
				this.pay$.css({ left: 934, top: 0, opacity: 0 });
				this.down$.css({ left: 996, top: 0, opacity: 0 });
				this.yourMortgage$.css({ left: 480, top: 135, opacity: 0 });
				this.faster$.css({ left: 1288, top: 135, opacity: 0 });
				this.and$.css({ left: 807, top: 348, opacity: 0 });
				this.live$.css({ left: 871, top: 348, opacity: 0 });
				this.it$.css({ left: 925, top: 348, opacity: 0 });
				this.up$.css({ left: 950, top: 348, opacity: 0 });
				this.sooner$.css({ left: 997, top: 135, opacity: 0 });
				this.imagineThat$.css({ left: 194, top: 40, opacity: 0 });
				this.rateBox$.css({ left: 480, top: 0, opacity: 0 });
				this.rateBoxShadow$.css({ left: 480, top: 230, opacity: 0 });
				this.wantToBeMortgageFreeSooner$.css({ left: 1288, top: 221, opacity: 0 });
				this.justAsk$.css({ left: 1288, top: 221, opacity: 0 });
				this.yourMoney$.css({ left: 480, top: 271, opacity: 0 });
			}, 
			animate: function () {
				var banner = this,
					beatDuration = banner._beatDuration;

				this.enqueue(this.aBetterMortgageRate$, { opacity: 1 })
				.enqueue(this.so$, { top: 100, opacity: 1 })
				.enqueue(this.you$, { top: 100, opacity: 1 })
				.enqueue(this.pay$, { top: 100, opacity: 1 })
				.enqueue(this.down$, { top: 100, opacity: 1 })
				.enqueue(this.yourMortgage$, { opacity: 1 })
				.enqueue(this.faster$, { left: 713, opacity: 1 })
				.enqueue(this.and$, { top: 135, opacity: 1 })
				.enqueue(this.live$, { top: 135, opacity: 1 })
				.enqueue(this.it$, { top: 135, opacity: 1 })
				.enqueue(this.up$, { top: 135, opacity: 1 })
				.enqueue(this.sooner$, { opacity: 1 })
				.enqueue(this.imagineThat$, { opacity: 1 })
				.enqueue(function () {
					setTimeout(function() {
						banner.aBetterMortgageRate$.animate({ opacity: 0 }, beatDuration);
						banner.so$.animate({ opacity: 0 }, beatDuration);
						banner.you$.animate({ opacity: 0 }, beatDuration);
						banner.pay$.animate({ opacity: 0 }, beatDuration);
						banner.down$.animate({ opacity: 0 }, beatDuration);
						banner.yourMortgage$.animate({ opacity: 0 }, beatDuration);
						banner.faster$.animate({ opacity: 0 }, beatDuration);
						banner.and$.animate({ opacity: 0 }, beatDuration);
						banner.live$.animate({ opacity: 0 }, beatDuration);
						banner.it$.animate({ opacity: 0 }, beatDuration);
						banner.up$.animate({ opacity: 0 }, beatDuration);
						banner.sooner$.animate({ opacity: 0 }, beatDuration, function () { banner.wrapper$.dequeue(); });					
					}, beatDuration * 2);
				})
				.enqueue(function () {
					banner.loadRates();
					banner.rateBox$.animate({ top: 50, opacity: 1 }, beatDuration);
					banner.rateBoxShadow$.animate({ top: 202, opacity: 1 }, beatDuration, function () { banner.wrapper$.dequeue(); });
				})
				.enqueue(this.wantToBeMortgageFreeSooner$, { left: 480, opacity: 1 })
				.enqueue(this.justAsk$, { left: 903, opacity: 1 })
				.enqueue(this.yourMoney$, { opacity: 1 });
            }
        });        

addBanner({
			imageUrl: '/dcu/SplashBanners/imagine-that-service.jpg', 
			assetPath: '/SiteAssets/images/banners/imagine-that-service/',
			loadAssets: function () {
				this.aBetterMortgageRate$ = this.addItem('a-better-mortgage-rate.png', 350, 32);
				this.so$ = this.addItem('so.png', 41, 32);
				this.you$ = this.addItem('you.png', 63, 32);
				this.pay$ = this.addItem('pay.png', 62, 32);
				this.down$ = this.addItem('down.png', 85, 32);
				this.yourMortgage$ = this.addItem('your-mortgage.png', 233, 32);
				this.faster$ = this.addItem('faster.png', 94, 32);
				this.and$ = this.addItem('and.png', 64, 32);
				this.live$ = this.addItem('live.png', 54, 32);
				this.it$ = this.addItem('it.png', 25, 32);
				this.up$ = this.addItem('up.png', 47, 32);
				this.sooner$ = this.addItem('sooner.png', 113, 32);
				this.imagineThat$ = this.addItem('imagine-that.png', 239, 219);
				this.rateBox$ = this.addItem('rate-box.png', 357, 152);
				this.rateBoxShadow$ = this.addItem('rate-box-shadow.png', 357, 53);
				this.wantToBeMortgageFreeSooner$ = this.addItem('want-to-be-mortgage-free-sooner.png', 402, 29);
				this.justAsk$ = this.addItem('just-ask.png', 97, 29);
				this.yourMoney$ = this.addItem('your-money-your-way-imagine-that.png', 301, 17);
			}, 
			setPositions: function () {
				this.aBetterMortgageRate$.css({ left: 480, top: 100, opacity: 0 });
				this.so$.css({ left: 830, top: 0, opacity: 0 });
				this.you$.css({ left: 871, top: 0, opacity: 0 });
				this.pay$.css({ left: 934, top: 0, opacity: 0 });
				this.down$.css({ left: 996, top: 0, opacity: 0 });
				this.yourMortgage$.css({ left: 480, top: 135, opacity: 0 });
				this.faster$.css({ left: 1288, top: 135, opacity: 0 });
				this.and$.css({ left: 807, top: 348, opacity: 0 });
				this.live$.css({ left: 871, top: 348, opacity: 0 });
				this.it$.css({ left: 925, top: 348, opacity: 0 });
				this.up$.css({ left: 950, top: 348, opacity: 0 });
				this.sooner$.css({ left: 997, top: 135, opacity: 0 });
				this.imagineThat$.css({ left: 194, top: 40, opacity: 0 });
				this.rateBox$.css({ left: 480, top: 0, opacity: 0 });
				this.rateBoxShadow$.css({ left: 480, top: 230, opacity: 0 });
				this.wantToBeMortgageFreeSooner$.css({ left: 1288, top: 221, opacity: 0 });
				this.justAsk$.css({ left: 1288, top: 221, opacity: 0 });
				this.yourMoney$.css({ left: 480, top: 271, opacity: 0 });
			}, 
			animate: function () {
				var banner = this,
					beatDuration = banner._beatDuration;
	
				this.enqueue(this.aBetterMortgageRate$, { opacity: 1 })
				.enqueue(this.so$, { top: 100, opacity: 1 })
				.enqueue(this.you$, { top: 100, opacity: 1 })
				.enqueue(this.pay$, { top: 100, opacity: 1 })
				.enqueue(this.down$, { top: 100, opacity: 1 })
				.enqueue(this.yourMortgage$, { opacity: 1 })
				.enqueue(this.faster$, { left: 713, opacity: 1 })
				.enqueue(this.and$, { top: 135, opacity: 1 })
				.enqueue(this.live$, { top: 135, opacity: 1 })
				.enqueue(this.it$, { top: 135, opacity: 1 })
				.enqueue(this.up$, { top: 135, opacity: 1 })
				.enqueue(this.sooner$, { opacity: 1 })
				.enqueue(this.imagineThat$, { opacity: 1 })
				.enqueue(function () {
					setTimeout(function() {
						banner.aBetterMortgageRate$.animate({ opacity: 0 }, beatDuration);
						banner.so$.animate({ opacity: 0 }, beatDuration);
						banner.you$.animate({ opacity: 0 }, beatDuration);
						banner.pay$.animate({ opacity: 0 }, beatDuration);
						banner.down$.animate({ opacity: 0 }, beatDuration);
						banner.yourMortgage$.animate({ opacity: 0 }, beatDuration);
						banner.faster$.animate({ opacity: 0 }, beatDuration);
						banner.and$.animate({ opacity: 0 }, beatDuration);
						banner.live$.animate({ opacity: 0 }, beatDuration);
						banner.it$.animate({ opacity: 0 }, beatDuration);
						banner.up$.animate({ opacity: 0 }, beatDuration);
						banner.sooner$.animate({ opacity: 0 }, beatDuration, function () { banner.wrapper$.dequeue(); });					
					}, beatDuration * 2);
				})
				.enqueue(function () {
					banner.loadRates();
					banner.rateBox$.animate({ top: 50, opacity: 1 }, beatDuration);
					banner.rateBoxShadow$.animate({ top: 202, opacity: 1 }, beatDuration, function () { banner.wrapper$.dequeue(); });
				})
				.enqueue(this.wantToBeMortgageFreeSooner$, { left: 480, opacity: 1 })
				.enqueue(this.justAsk$, { left: 903, opacity: 1 })
				.enqueue(this.yourMoney$, { opacity: 1 });
			}
		});

        addBanner({
            imageUrl: '/SplashBanners/imagine-that-rsp.jpg',
            assetPath: '/SiteAssets/images/banners/imagine-that-rsp/',
            loadAssets: function () {
                this.a$ = this.addItem('a-fs8.png', 29, 20);
                this.b$ = this.addItem('b-fs8.png', 28, 32);
                this.smile$ = this.addItem('smile-fs8.png', 110, 31);
                this.getYourRsp$ = this.addItem('get-your-rsp-from-point-a-to-point-b-fs8.png', 310, 70);
                this.rspSavingsAccount$ = this.addItem('rsp-savings-account.png', 170, 175);
                this.getTheExpertise$ = this.addItem('get-the-expertise-fs8.png', 253, 43);
                this.imagineThat$ = this.addItem('imagine-that-full-fs8.png', 218, 217);
                
                this.escalatorGic$ = this.addItem('escalator-gic.png', 170, 175);
                this.marketSecureGics$ = this.addItem('market-secure-gics.png', 170, 175);
                this.tfsaSavingsAccount$ = this.addItem('tfsa-savings-account.png', 170, 175);
                
                this.learnMore$ = this.addItem('bt_learn-more-fs8.png', 116, 29);
            },
            setPositions: function () {
                this.a$.css({ left: 232, top: 146, opacity: 0 });
                this.b$.css({ left: 347, top: 136, opacity: 0 });
                this.smile$.css({ left: 248, top: 177, opacity: 0 });
                this.getYourRsp$.css({ left: 448, top: 106, opacity: 0 });
                this.rspSavingsAccount$.css({ left: 229, top: 92, opacity: 0 });
                this.getTheExpertise$.css({ left: 448, top: 182, opacity: 0 });
                this.imagineThat$.css({ left: 805, top: 87, opacity: 0 });

                this.escalatorGic$.css({ left: 229, top: 92, opacity: 0 });
                this.marketSecureGics$.css({ left: 229, top: 92, opacity: 0 });
                this.tfsaSavingsAccount$.css({ left: 229, top: 92, opacity: 0 });
                
                this.learnMore$.css({ left: 448, top: 233, opacity: 0 });
            },
            animate: function () {
                var banner = this,
					beatDuration = banner._beatDuration;

                this.enqueue(this.a$, { opacity: 1 })
					.enqueue(this.b$, { opacity: 1 })
					.enqueue(this.smile$, { opacity: 1 })
					.enqueue(this.getYourRsp$, { opacity: 1 })
					.enqueue(this.getTheExpertise$, { opacity: 1 })
					.enqueue(function () {
					    banner.imagineThat$.animate({ opacity: 1 }, beatDuration);
					    banner.learnMore$.animate({ opacity: 1 }, beatDuration, function () { banner.wrapper$.dequeue(); });
					})
					.enqueue(function () {
					    setTimeout(function () {
						    banner.rspSavingsAccount$.animate({ opacity: 1 }, beatDuration, function () { 
						    	banner.wrapper$.dequeue(); 
						    });
					    }, beatDuration * 2);
					})					
					.enqueue(function () {						
					    setTimeout(function () {
							banner.rspSavingsAccount$.animate({ opacity: 0 }, beatDuration);
						    banner.escalatorGic$.animate({ opacity: 1 }, beatDuration, function () { 
						    	banner.wrapper$.dequeue(); 
						    });
					    }, beatDuration * 5);
					})
					.enqueue(function () {					    
					    setTimeout(function () {
							banner.escalatorGic$.animate({ opacity: 0 }, beatDuration);
						    banner.marketSecureGics$.animate({ opacity: 1 }, beatDuration, function () { 
						    	banner.wrapper$.dequeue(); 
						    });
					    }, beatDuration * 5);
					})
					.enqueue(function () {					
					    setTimeout(function () {
							banner.marketSecureGics$.animate({ opacity: 0 }, beatDuration);					    
						    banner.tfsaSavingsAccount$.animate({ opacity: 1 }, beatDuration, function () { 
						    	banner.wrapper$.dequeue(); 
						    });
					    }, beatDuration * 5);    
					});
					
            }
        });

		addBanner({
            imageUrl: '/SplashBanners/mobile-banking.jpg',
            assetPath: '/SiteAssets/images/banners/mobile-banking/',
            loadAssets: function () {
	            this.comingSpring2012$ = this.addItem('coming-spring-2012.png', 269, 26);
				this.smile$ = this.addItem('smile.gif', 81, 23);
				this.putASmileOnYourFace$ = this.addItem('put-a.png', 177, 48);
				this.imagineThat$ = this.addItem('imagine-that.png', 217, 231);
            },
            setPositions: function () {
            	this.comingSpring2012$.css({ left: 497, top: 173, opacity: 0 });
				this.smile$.css({ left: 323, top: 174, opacity: 0 });
				this.putASmileOnYourFace$.css({ left: 497, top: 153, opacity: 0 });
                this.imagineThat$.css({ left: 805, top: 91, opacity: 0 });
            },
            animate: function () {
                var banner = this,
					beatDuration = banner._beatDuration;

                this.enqueue(this.comingSpring2012$, { opacity: 1 })
                	.enqueue(function () {
                		setTimeout(function() {
			    			banner.comingSpring2012$.animate({ opacity: 0 }, beatDuration, function () { 
						    	banner.wrapper$.dequeue(); 
						    });
	                	}, beatDuration * 5);
	                })
	                .enqueue(this.smile$, { opacity: 1 })
	                .enqueue(this.putASmileOnYourFace$, { opacity: 1 })
	                .enqueue(this.imagineThat$, { opacity: 1 });			
            }
        });
        
       addBanner({
            imageUrl: '/SplashBanners/smarter-rsp-planning.jpg',
            assetPath: '/SiteAssets/images/banners/smarter-rsp-planning/',
            loadAssets: function () {
	            this.equation$ = this.addItem('equation.png', 151, 98);
	            this.smarterRspPlanning$ = this.addItem('smarter-rsp-planning-fs8.png', 243, 155);
   	            this.imagineThat$ = this.addItem('imagine-that.png', 218, 217);
   	            this.shadow$ = this.addItem('shadow.png', 117, 12);
   	            this.greenBubble$ = this.addItem('green-bubble.png', 172, 171/**/, '/personal-banking/investments/products/online-advantage-savings/');
   	            this.blueBubble$ = this.addItem('blue-bubble.png', 173, 171/**/, '/personal-banking/investments/products/Escalator-GIC/');
   	            this.yellowBubble$ = this.addItem('yellow-bubble.png', 172, 171/**/, '/personal-banking/investments/products/market-secure-gic/');
   	            this.purpleBubble$ = this.addItem('purple-bubble.png', 172, 171/**/, '/personal-banking/investments/plans/tfsa/');
   	            
   	            this.wrapper$.wrapInner('<div style="position: absolute; overflow: hidden; top: 28px; left: 179px; width: 927px; height: 295px; display: block; ">');
            },
            setPositions: function () {
            	this.offsetX = 179;
            	this.offsetY = 28;
            	this.left = function (x) {
	            	return x - this.offsetX;
	            };
	            this.top = function (y) {
	            	return y - this.offsetY;
	            };            
            	this.equation$.css({ left: this.left(800), top: this.top(133), opacity: 0 });
            	this.smarterRspPlanning$.css({ left: this.left(448), top: this.top(108), opacity: 0 });
            	this.imagineThat$.css({ left: this.left(805), top: this.top(89), opacity: 0 });
            	this.shadow$.css({ left: this.left(255), top: this.top(258), opacity: 0 });
            	this.greenBubble$.css({ left: this.left(230), top: this.top(-171), opacity: 1 });
            	this.blueBubble$.css({ left: this.left(230), top: this.top(-171), opacity: 1 });
            	this.yellowBubble$.css({ left: this.left(230), top: this.top(-171), opacity: 1 });
            	this.purpleBubble$.css({ left: this.left(230), top: this.top(-171), opacity: 1 });
            },
            animate: function () {
                var banner = this,
                	bannerHeight = 351,
					beatDuration = banner._beatDuration,
					dropIn = function (el$, prev$) {
						prev$ && prev$.animate({ top: banner.top(bannerHeight) }, beatDuration, 'linear');
						banner.shadow$.animate({ opacity: 0 }, 0);
						banner.shadow$.animate({ opacity: 1 }, beatDuration);
					   	el$
					   		.animate({ top: banner.top(94), opacity: 1 }, beatDuration, 'linear')
					   		.effect('bounce', { times: 2, distance: 15 }, beatDuration / 4, function () {
					   			setTimeout(function () {
			                		banner.wrapper$.dequeue();
			                	}, beatDuration * 4);
		                	});
					};
			
                this.enqueue(this.equation$, { opacity: 0 })
                	.enqueue(this.equation$, { left: this.left(236), top: this.top(133), opacity: 1 })
                	.enqueue(this.smarterRspPlanning$, { opacity: 1 })
                	.enqueue(function () {
                		setTimeout(function () {
                			banner.imagineThat$.animate({ opacity: 1 }, beatDuration * 3, function () {
	                			banner.wrapper$.dequeue();                			
                			});
                		}, beatDuration);
                	})
                	.enqueue(this.equation$, { opacity: 0 })
                	.enqueue(function () {
						dropIn(banner.greenBubble$);
                	}).enqueue(function () {
						dropIn(banner.blueBubble$, banner.greenBubble$);					
                	}).enqueue(function () {
						dropIn(banner.yellowBubble$, banner.blueBubble$);
                	}).enqueue(function () {
						dropIn(banner.purpleBubble$, banner.yellowBubble$);
                	});
            }
        });
        
        addBanner({
            imageUrl: '/SplashBanners/travel-insurance.jpg',
            assetPath: '/SiteAssets/images/banners/travel-insurance/',
            loadAssets: function () {
	            this.travelInsurance$ = this.addItem('meridian-travel-insurance.png', 235, 51);
	            this.exclusivelyForMeridianMembers$ = this.addItem('exclusively-for-meridian-members.png', 383, 22);
   	            this.multiTrip$ = this.addItem('multi-trip.png', 304, 52);
   	            this.flexibleSingleTripRates$ = this.addItem('flexible-single-trip-rates.png', 383, 46);
				this.takeFlightPlans$ = this.addItem('take-flight-plans.png', 273, 46);
				this.quickAndEasyApplication$ = this.addItem('quick-and-easy-application.png', 184, 46);
				this.suitCase$ = this.addItem('suitcase.jpg', 395, 212);
            },
            setPositions: function () {
            	this.suitCase$.css({ left: 80, top: 72 });
            	this.travelInsurance$.css({ left: 568, top: 72, opacity: 0 });
            	this.exclusivelyForMeridianMembers$.css({ left: 568, top: 142, opacity: 0 });
            	this.multiTrip$.css({ left: 168, top: 183, opacity: 0 });
            	this.flexibleSingleTripRates$.css({ left: 92, top: 183, opacity: 0 });
            	this.takeFlightPlans$.css({ left: 202, top: 183, opacity: 0 });
            	this.quickAndEasyApplication$.css({ left: 291, top: 183, opacity: 0 });
            },
            animate: function () {
                var banner = this,
					beatDuration = banner._beatDuration * 4;
			
                this.enqueue(this.travelInsurance$, { opacity: 0 }, banner._beatDuration)
                	.enqueue(function () {
                		banner.travelInsurance$.animate({ opacity: 1 }, banner._beatDuration);
               			banner.exclusivelyForMeridianMembers$.animate({ opacity: 1 }, banner._beatDuration, function () {
               				banner.wrapper$.dequeue(); 
               			});
               		})
                	.enqueue(this.multiTrip$, { opacity: 1 }, 0)
                	.enqueue(this.multiTrip$, { left: 568 })
                	.enqueue(this.multiTrip$, { opacity: 0 }, null, beatDuration )
                	.enqueue(this.flexibleSingleTripRates$, { opacity: 1 }, 0)
                	.enqueue(this.flexibleSingleTripRates$, { left: 568 })
                	.enqueue(this.flexibleSingleTripRates$, { opacity: 0 }, null, beatDuration )
                	.enqueue(this.takeFlightPlans$, { opacity: 1 }, 0)
                	.enqueue(this.takeFlightPlans$, { left: 568 })
                	.enqueue(this.takeFlightPlans$, { opacity: 0 }, null, beatDuration )
                	.enqueue(this.quickAndEasyApplication$, { opacity: 1 }, 0)
                	.enqueue(this.quickAndEasyApplication$, { left: 568 })
                	.enqueue(this.quickAndEasyApplication$, { opacity: 0 }, null, beatDuration )
                	;
            }
        });

		addBanner({
            imageUrl: '/SplashBanners/rsp-countdown.jpg',
            setPositions: function () {
				var date,
					markup = '',
					container$ = $('.aBanner');
		
				if(container$.length) {
					date = new Date(2012, 1, 29, 23, 59, 59);
		
					markup += '<span class="day" title="{dl}">{dn}</span>';
					markup += '<span class="hour" title="{hl}">{hn}</span>';
					markup += '<span class="minute" title="{ml}">{mn}</span>';
					markup += '<span class="second" title="{sl}">{sn}</span>';
				
			        container$.countdown('destroy').countdown({
			            until: date,
			            layout: markup,
			            format: 'DHMS'
			        });
			    }
			}
		}); 

        for (i = 0; i < Meridian.BannerController.banners.length; ++i) {
            Meridian.BannerController.subscribe(Meridian.BannerController.banners[i].show, 'bannerLoaded', Meridian.BannerController.banners[i]);
            Meridian.BannerController.subscribe(Meridian.BannerController.banners[i].hide, 'bannerUnloaded', Meridian.BannerController.banners[i]);
        }
    }
};

$(function () {
    Meridian.BannerController.init();
    if(Meridian.Banners.$activeDot) {
	    Meridian.Banners.bannerLoaded(Meridian.Banners.$activeDot.attr("rel"));
	}
	
	if($('img[src*="/personal-banking/investments/Banners/smarter-rsp-planning.jpg"]').length) {
		Meridian.Banners.bannerLoaded('/personal-banking/investments/Banners/smarter-rsp-planning.jpg');
	}
});