Push slider (rejected work for client UI)

jquery.push-slider.js

(function ($) {
  /**
	* 
	*/
	$.fn.pushSlider = function (options, callback) {
		var settings = {
			initialSlide: 0,
			duration: 840
		};
		$.extend(true, settings, options);
		callback = ($.isFunction(callback)) ? callback : function () { };

		var $el, $container, $slides, $frame, caption = {};

		var methods = {
			init: function () {
				//console.log('init');
				if ($slides.length > 1) {
					$.data($el, "currentSlide", settings.initialSlide);
					var fadeRate = settings.duration / 2
					$slides.each(function (i, v) {
						var $this = $(this);
						var $overlay = $("<span>", {
							"class": "overlay ir",
							text: "overlay"
						}).appendTo($this);
						//if (i === settings.initialSlide) { $overlay.hide(); }
					}).hover(function () {
						//mouseover
						if (!$el.hasClass('animating')) {
							$('.overlay', $(this)).fadeOut(fadeRate / 5);
						}
					}, function () {
						//mouseout
						if (!$el.hasClass('animating')) {
							$('.overlay', $(this)).fadeIn(fadeRate / 3);
						}
					}).find('a').bind('click', function (e) {
						e.preventDefault();
						if (!$el.hasClass('animating')) {
							$el.addClass('animating');
							methods.advance($(this).parent().index());
						}
						return false;
					});
					this.buildCaption(this.captionText($('img', $slides.eq(settings.initialSlide)).attr('alt'))).appendTo($el);
					this.buildFrame().appendTo($el);
					this.buildControl().appendTo($el);
				}
			},
			buildControl: function () {
				//console.log('buildControl');
				return $("<a>", {
					href: "#!/next",
					"class": "control ir",
					text: "Next",
					click: function (e) {
						e.preventDefault();
						$el.addClass('animating');
						methods.advance();
						return false;
					}
				});
			},
			buildCaption: function (obj) {
				//console.log('buildCaption');
				var $caption = $('<div>', { 'class': "caption" });
				caption.$name = $('<h4>', { text: obj.name }).appendTo($caption);
				caption.$title = $('<h5>', { text: obj.title }).appendTo($caption);
				return $caption;
			},
			buildFrame: function () {
				//console.log('buildFrame');
				$frame = $("<a>", {
					"class": "frame ir",
					href: $slides.eq(settings.initialSlide).find('a').attr('href'),
					text: "Slide Frame"
				});
				return $frame;
			},
			captionText: function (str) {
				//console.log('captionText');
				var captionArray = str.split(" | ")
				return {
					name: captionArray[0],
					title: captionArray[1]
				};
			},
			advance: function (steps, duration) {
				steps = (typeof steps == 'undefined') ? 1 : steps;
				duration = (typeof duration == 'undefined') ? settings.duration / steps : duration;
				//console.log('advance: steps - ' + steps + ', duration - ' + duration);
				var $current = methods.getSlides().first();
				var $clone = $current.clone(true, true).css({ width: 0 }).appendTo($container);
				$current.animate({ width: 0 }, duration, function () {
					$(this).hide().remove();
				});
				$clone.animate({ width: settings.slides.x }, duration, function () {
					//console.log('callback');
					if (--steps == 0) {
						//console.log('remove class');
						var $now = methods.getSlides().first();
						$('.overlay', $el).removeAttr('style');
						$frame.attr('href', $('a', $now).attr('href'));
						var textObj = methods.captionText($('img', $now).attr('alt'));
						caption.$name.text(textObj.name);
						caption.$title.text(textObj.title);
						$el.removeClass('animating');
					} else {
						methods.advance(steps, duration);
					}
				});
			},
			getSlides: function () {
				return $('.slide', $el);
			},
			update: function (index) {
				//console.log("update indicator: " + index);
				$.data($el, 'currentSlide', index);
				$children.eq(index).siblings().hide();
				$(indicators[index]).addClass("current").siblings('li').removeClass("current");
			}
		};

		return this.each(function () {
			$el = $(this);
			$slides = methods.getSlides();
			settings.x = $el.width();
			settings.slides = {};
			settings.slides.x = $slides.eq(0).width();
			$container = $(".custom-widget-content", $el).width(settings.slides.x * $slides.length);
			methods.init();
		});
	};
})(jQuery);