2013-10-04 02:45:36 +02:00
|
|
|
/*!
|
|
|
|
* Ideal Steps
|
|
|
|
*/
|
|
|
|
(function($, win, doc, undefined) {
|
|
|
|
|
|
|
|
var plugin = {};
|
|
|
|
|
|
|
|
plugin.name = 'idealsteps';
|
|
|
|
|
|
|
|
plugin.defaults = {
|
|
|
|
nav: '.idealsteps-nav',
|
|
|
|
navItems: 'li',
|
|
|
|
buildNavItems: true,
|
|
|
|
wrap: '.idealsteps-wrap',
|
|
|
|
step: '.idealsteps-step',
|
|
|
|
activeClass: 'idealsteps-step-active',
|
|
|
|
before: null,
|
|
|
|
after: null,
|
|
|
|
fadeSpeed: 0
|
|
|
|
};
|
|
|
|
|
|
|
|
plugin.methods = {
|
|
|
|
|
|
|
|
_init: function() {
|
|
|
|
|
|
|
|
var self = this,
|
|
|
|
active = this.opts.activeClass;
|
|
|
|
|
|
|
|
this.$el = $(this.el);
|
|
|
|
|
|
|
|
this.$nav = this.$el.find(this.opts.nav);
|
|
|
|
this.$navItems = this.$nav.find(this.opts.navItems);
|
|
|
|
|
|
|
|
this.$wrap = this.$el.find(this.opts.wrap);
|
|
|
|
this.$steps = this.$wrap.find(this.opts.step);
|
|
|
|
|
|
|
|
if (this.opts.buildNavItems) this._buildNavItems();
|
|
|
|
|
|
|
|
this.$steps.hide().first().show();
|
|
|
|
this.$navItems.removeClass(active).first().addClass(active);
|
|
|
|
|
2013-10-06 13:16:43 +02:00
|
|
|
this.$navItems.click(function(e) {
|
|
|
|
e.preventDefault();
|
2013-10-04 02:45:36 +02:00
|
|
|
self.go(self.$navItems.index(this));
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
|
|
|
_buildNavItems: function() {
|
|
|
|
|
|
|
|
var self = this,
|
|
|
|
isCustom = typeof this.opts.buildNavItems == 'function',
|
|
|
|
item = function(val){ return '<li><a href="#" tabindex="-1">'+ val +'</a></li>'; },
|
|
|
|
items;
|
|
|
|
|
|
|
|
items = isCustom ?
|
|
|
|
this.$steps.map(function(i){ return item(self.opts.buildNavItems.call(self, i)) }).get() :
|
|
|
|
this.$steps.map(function(i){ return item(++i); }).get();
|
|
|
|
|
|
|
|
this.$navItems = $(items.join(''));
|
|
|
|
|
|
|
|
this.$nav.append($('<ul/>').append(this.$navItems));
|
|
|
|
},
|
|
|
|
|
|
|
|
_getCurIdx: function() {
|
|
|
|
return this.$steps.index(this.$steps.filter(':visible'));
|
|
|
|
},
|
|
|
|
|
|
|
|
go: function(idx) {
|
|
|
|
|
|
|
|
var active = this.opts.activeClass,
|
|
|
|
fadeSpeed = this.opts.fadeSpeed;
|
|
|
|
|
|
|
|
if (typeof idx == 'function') idx = idx.call(this, this._getCurIdx());
|
|
|
|
|
|
|
|
if (idx >= this.$steps.length) idx = 0;
|
|
|
|
if (idx < 0) idx = this.$steps.length-1;
|
|
|
|
|
|
|
|
if (this.opts.before) this.opts.before.call(this, idx);
|
|
|
|
|
|
|
|
this.$navItems.removeClass(active).eq(idx).addClass(active);
|
|
|
|
this.$steps.fadeOut(fadeSpeed).eq(idx).fadeIn(fadeSpeed);
|
|
|
|
|
|
|
|
if (this.opts.after) this.opts.after.call(this, idx);
|
|
|
|
},
|
|
|
|
|
|
|
|
prev: function() {
|
|
|
|
this.go(this._getCurIdx() - 1);
|
|
|
|
},
|
|
|
|
|
|
|
|
next: function() {
|
|
|
|
this.go(this._getCurIdx() + 1);
|
|
|
|
},
|
|
|
|
|
|
|
|
first: function() {
|
|
|
|
this.go(0);
|
|
|
|
},
|
|
|
|
|
|
|
|
last: function() {
|
|
|
|
this.go(this.$steps.length-1);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
require('../../plugin')(plugin);
|
|
|
|
|
|
|
|
}(jQuery, window, document));
|