ShopModule = function()
{
	this.CloseClickDelegate = Function.createDelegate(this, this.btnClose_Click);
	this.rotateIntervalDelegate = Function.createDelegate(this, this.onRotateInterval);
	this.HideOfferAnimCompleteDelegate = Function.createDelegate(this, this.onHideOfferAnimComplete);
	
	this._btnExpand = jQuery(".moreOffers");
	this._btnExpand.addClass("hidden");
	jQuery(".moreOffers .btnMoreOffers").attr("href", "javascript:void(0)").click(ShopModule.Expand);

	var sender = this;
	jQuery("body").click(function()
	{
		if (sender.IsExpanded)
			sender.btnClose_Click();
	});

	
	
	this.EnableExpand = false;
	this.IsExpanded = false;
	this.PauseAutoRotate = false;
	this.offerCount = jQuery(".content .section").length;
	this.autoRotateIntervalTime = 12000;
}

ShopModule.prototype = 
{
	
	initialize: function()
	{
		this.initActiveOffer();
		
		if (this.get_AllowExpand())
			this.enableExpand();
		
		if (this.get_AllowAutoRotate())
			this.startAutoRotate();
	},
	
	initActiveOffer: function ()
	{
		this.activeOfferElem = jQuery(".content .section:eq(0)");
		jQuery(".content .section:last").addClass("last"); 
		
		if (!this.get_AllowAutoRotate())
		{
			this.animShowOffer(this.activeOfferElem);
		}
	},
	
	enableExpand: function ()
	{
		// init props
		this.EnableExpand = true;
		this.expandedWidth = this.calcTotalWidth();
		this._btnExpand.removeClass("hidden");
		
		// assign elements
		this.btnClose = document.getElementById("close");

		// add handlers
		$addHandler(this.btnClose, "click", this.CloseClickDelegate);
	},
	
	activateNextOffer: function ()
	{
		// reset offer states
		jQuery(".content .section").removeClass("active");
		jQuery(".content .section").removeClass("last");

		// move current offer elem to back of stack
		var cur = this.activeOfferElem;
		cur.addClass("last");
		cur.appendTo(cur.parent());

		// update active offer
		this.activeOfferElem = jQuery(".content .section:eq(0)");
		this.activeOfferElem.addClass("last");
		
		// animate new offer into view
		this.animShowOffer(this.activeOfferElem);

		// *** TRACKING
		// trackingStuff(this.activeOfferElem);
	},
	
	animShowOffer: function (offer)
	{
		var img = offer.find(".offerIcon");
		var blurb = offer.find(".blurb");
		var title = offer.find("h4");
		var button = offer.find(".button");
		
		// reset for animation
		img.css({ "bottom": -150});
		title.css({ "bottom": -150 });
		blurb.css({ "bottom": -150 });
		button.css({ "bottom": -50 });
		offer.addClass("active");

		var sender = this;
		this.animOfferElemIn(img, 200);
		setTimeout(function() { sender.animOfferElemIn.apply(sender, [title, 100]); }, 200);
		setTimeout(function() { sender.animOfferElemIn.apply(sender, [blurb, 100]); }, 250);
		setTimeout(function() { sender.animOfferElemIn.apply(sender, [button, 100]); }, 300);
	},
	
	animOfferElemIn: function (elem, duration)
	{
		elem.css({ "display":"block" });
		//elem.css({"opacity":1});
		elem.animate({ bottom:"10" }, {duration:duration})
			.animate({ bottom: "0" }, { duration: 100, queue: true, easing:"linear" });
	},
	
	animHideOffer: function (offer, callbackDelegate)
	{
		var img = offer.find(".offerIcon");
		var blurb = offer.find(".blurb");
		var title = offer.find("h4");
		var button = offer.find(".button");

		var sender = this;
		this.animOfferElemOut(img, 200);
		setTimeout(function() { sender.animOfferElemOut.apply(sender, [title, 100]); }, 100);
		setTimeout(function() { sender.animOfferElemOut.apply(sender, [blurb, 100]); }, 150);
		setTimeout(function() { sender.animOfferElemOut.apply(sender, [button, 100, callbackDelegate]); }, 200);
	},

	animOfferElemOut: function(elem, duration, callback)
	{
		//elem.animate({opacity:0}, {duration:duration, complete:callback});
		elem.css("dislay", "none");
		if (callback != null)
			callback.apply();
	},
	
	expand: function ()
	{
		jQuery(".shopModule .box").css("width", this.expandedWidth);
		jQuery(".shopModule .box").removeClass("hidden");
		jQuery(".shopModule .content").addClass("expanded");
		jQuery(".shopModule .content").css("width", this.expandedWidth - 30);
		jQuery(".shopModule #close").removeClass("hidden");
		jQuery(".content .section:first").removeClass("last");
		jQuery(".content .section:last").addClass("last");

		var sender = this;
		jQuery(".shopModule .content").click(function(event) { 
			if (sender.IsExpanded) 
				event.stopPropagation(); 
		});
		
		
		this._btnExpand.addClass("hidden");
		this.IsExpanded = true;
		this.autoRotate = false;
		this.animExpand();
	},
	
	animExpand: function ()
	{
		// start first node anim immediate
		this.animShowOffer(jQuery(".content .section:eq(1)"), 1);

		// anim rest of offer nodes
		for (var i = 2; i < this.offerCount; i++)
		{
			this.expandOffer(i);
		}
	},
	
	expandOffer: function (i)
	{
		var sender = this;
		var offer = jQuery(".content .section:eq(" + i + ")");
		setTimeout(function() { sender.animShowOffer.apply(sender, [offer]); }, 100 * i);
	},
	
	collapse: function ()
	{
		jQuery(".box").css("width", 180);
		jQuery(".shopModule .content").removeClass("expanded");
		jQuery(".shopModule .content").css("width", 180);
		jQuery(".shopModule .box").addClass("hidden");
		jQuery(".shopModule #close").addClass("hidden");
		jQuery(".content .section").removeClass("active");
		this._btnExpand.removeClass("hidden");
		this.IsExpanded = false;
		this.startAutoRotate();
	},
	
	startAutoRotate: function ()
	{
		this.autoRotate = true;
		this.onRotateInterval();
	},
    
    calcTotalWidth:function ()
    {
    	var padding = 25;
    	var margin = 15;
    	var totalPadding = (padding * this.offerCount) + (margin * 2);
    	var itemWidth = parseInt(jQuery(".content .section:first").width());

    	return (itemWidth * this.offerCount) + totalPadding;
    },
    
    pause: function ()
    {
		this.PauseAutoRotate = true;
    },
    
    unpause: function ()
    {
		this.PauseAutoRotate = false;
		if (this.autoRotate && this.get_AllowAutoRotate() && !this.IsExpanded)
			this.startAutoRotate();
    },



    //////////////////
    // Events
    //////////////////

    btnClose_Click: function()
    {
    	this.EnableExpand = false;
    	this.collapse();
    },

    onRotateInterval: function()
    {
		clearInterval(this.rotateInterval);
    	if (this.autoRotate && !this.PauseAutoRotate)
    	{
    		this.rotateInterval = setInterval(this.rotateIntervalDelegate, this.autoRotateIntervalTime);
    		this.animHideOffer(this.activeOfferElem, this.HideOfferAnimCompleteDelegate);
    	}
    },
    
    onHideOfferAnimComplete: function ()
    {
		this.activateNextOffer();
    },



    //////////////////
    // Properties
    //////////////////
    
    get_AllowExpand: function ()
    {
		return (this.offerCount > 1);
	},
	
	get_AllowAutoRotate: function ()
	{
		return (this.offerCount > 1);
	}
}



//////////////////
// Static functions
//////////////////

ShopModule.Initialize = function()
{
	ShopModule._staticInstance = new ShopModule();
	ShopModule._staticInstance.initialize();
}

ShopModule.StopAutoRotate = function()
{
	ShopModule._staticInstance.pause();
}

ShopModule.StartAutoRotate = function()
{
	ShopModule._staticInstance.unpause();
}

ShopModule.OnDataLoad = function()
{
	// called when visitorContent data load has completed.
	//ShopModule.Initialize();
}

ShopModule.Expand = function (e)
{
	e.stopPropagation(); 
	ShopModule._staticInstance.expand();

	// *** TRACKING
	// moretracking(jQuery(".content .section"));
}

jQuery(document).ready(function ()
{
	ShopModule.Initialize();
});