(function($) {
	function BannerScenario(obj, opts) {
		var defaults = {
			sels: {
				with_background: ".with_background",
				header: ".header",
				text:   ".text",
				hr:     ".hr",
				more:   ".more"
			}
		};
		this.obj = obj;
		this.opts = $.extend(defaults, opts);
	}

	BannerScenario.prototype.extend = function(opts) {
		this.opts = $.extend(this.opts, opts);
	}

	BannerScenario.prototype.init = function(banner) {
		this.banner = banner;
		$(banner).find(
			[
			this.opts.sels.with_background,
			this.opts.sels.header,
			this.opts.sels.text,
			this.opts.sels.hr,
			this.opts.sels.more
			].join(", ")
			).css("visibility", "hidden");
	}

	BannerScenario.prototype.animate = function(callback) {
		var instance = this;
		async.series([
			function(callback) {
				$(instance.banner).find(instance.opts.sels.with_background)
				.css({
					visibility: "visible",
					opacity: 0
				}).animate({
					opacity: 1
				}, {
					duration: 333,
					easing:   "swing",
					complete: function() {
						$(this).css("opacity", "");
						callback();
					}
				}
				);
			},
			function(callback) {
				var header = $(instance.banner).find(instance.opts.sels.header);
				header.css("marginTop", "");
				var marginTop = Number(header.css("marginTop").replace("px", ""));
				header.css({
					visibility: "visible",
					opacity: 0,
					marginTop: (marginTop - 40) + "px",
					marginBottom: 0
				}).animate({
					opacity: 1,
					marginTop: marginTop + "px"
				}, {
					duration: 333,
					easing:   "swing",
					complete: function() {
						$(this).css("opacity", "");
						callback();
					}
				}
				);
			},
			function(callback) {
				setTimeout(function() {
					callback();
				}, 167);
			},
			function(callback) {
				var text = $(instance.banner).find(instance.opts.sels.text);
				text.css("marginTop", "");
				var marginTop = Number(text.css("marginTop").replace("px", ""));
				text.css({
					visibility: "visible",
					opacity: 0,
					marginTop: (marginTop - 30) + "px"
				}).animate({
					opacity: 0.5,
					marginTop: (marginTop + 20) + "px"
				}, {
					duration: 200,
					easing:   "swing",
					complete: function() {
						callback();
					}
				}
				);
			},
			function(callback) {
				var hr = $(instance.banner).find(instance.opts.sels.hr);
				hr.css("marginTop", "");
				var marginTop = Number(hr.css("marginTop").replace("px", ""));
				hr.css({
					visibility: "visible",
					opacity: 0,
					marginTop: (marginTop - 20) + "px"
				}).animate({
					opacity: 1,
					marginTop: (marginTop + 10) + "px"
				}, {
					duration: 233,
					easing:   "swing",
					complete: function() {
						callback();
					}
				}
				);

				var text = $(instance.banner).find(instance.opts.sels.text);
				marginTop = Number(text.css("marginTop").replace("px", ""));
				text.animate({
					marginTop: (marginTop - 20) + "px",
					opacity: 1
				}, {
					duration: 233,
					easing:   "swing"
				}
				);
			},
			function(callback) {
				setTimeout(function() {
					callback();
				}, 100);
			},
			function(callback) {
				var more = $(instance.banner).find(instance.opts.sels.more);
				more.css("marginLeft", "");
				var marginLeft = Number(more.css("marginLeft").replace("px", ""));
				more.css({
					visibility: "visible",
					opacity: 0,
					marginLeft: (marginLeft - 50) + "px"
				}).animate({
					opacity: 1,
					marginLeft: marginLeft + "px"
				}, {
					duration: 400,
					easing:   "swing",
					complete: function() {
						$(this).css("opacity", "");
						callback();
					}
				}
				);
			}
			], function() {
				if($.isFunction(callback)) {
					callback();
				}
			});
	}

	BannerScenario.prototype.revert_animate = function(callback) {
		var instance = this;

		(function() {
			var header = $(instance.banner).find(instance.opts.sels.header);
			header
			.animate({
				opacity: 0,
				marginTop: "-40px",
				marginBottom: "40px"
			}, {
				duration: 333,
				easing:   "swing"
			}
			);
		})();

		setTimeout(function() {
			$(instance.banner).find(instance.opts.sels.more)
			.animate({
				opacity: 0,
				marginLeft: "-50px"
			}, {
				duration: 167,
				easing:   "swing"
			});

			var text = $(instance.banner).find(instance.opts.sels.text);
			text
			.animate({
				opacity: 0
			}, {
				duration: 167,
				easing:   "swing"
			});

			$(instance.banner).find(instance.opts.sels.hr)
			.animate({
				opacity: 0
			}, {
				duration: 167,
				easing:   "swing"
			});

			$(instance.banner).find(instance.opts.sels.with_background)
			.animate({
				opacity: 0
			}, {
				duration: 167,
				easing:   "swing",
				complete: function() {
					callback();
				}
			});
		}, 200);
	}

	$.fn.extend({
		BannerScenario: function(opts) {
			return this.each(
				function() {
					this.bsc = new BannerScenario(this, opts);
				});
		},
		BannerScenarioExtend: function(opts) {
			return this.each(
				function() {
					if(!this.bsc) {
						return;
					}
					this.bsc.extend(opts);
				});
		},
		BannerScenarioInit: function(banner) {
			return this.each(
				function() {
					if(!this.bsc) {
						return;
					}
					this.bsc.init(banner);
				});
		},
		BannerScenarioAnimate: function(callback) {
			return this.each(
				function() {
					if(!this.bsc) {
						return;
					}
					this.bsc.animate(callback);
				});
		},
		BannerScenarioRevertAnimate: function(callback) {
			return this.each(
				function() {
					if(!this.bsc) {
						return;
					}
					this.bsc.revert_animate(callback);
				});
		}
	});
})(jQuery);
