fuelux-rails 2.1.3 → 2.2.0.beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/COPYING +28 -0
- data/README.md +59 -0
- data/THIRD-PARTY +25 -0
- data/lib/fuelux-rails/version.rb +1 -1
- data/vendor/assets/images/form.png +0 -0
- data/vendor/assets/javascripts/fuelux/checkbox.js +106 -0
- data/vendor/assets/javascripts/fuelux/combobox.js +122 -11
- data/vendor/assets/javascripts/fuelux/datagrid.js +7 -3
- data/vendor/assets/javascripts/fuelux/loader.js +1045 -43
- data/vendor/assets/javascripts/fuelux/pillbox.js +2 -1
- data/vendor/assets/javascripts/fuelux/radio.js +106 -0
- data/vendor/assets/javascripts/fuelux/search.js +1 -2
- data/vendor/assets/javascripts/fuelux/select.js +166 -0
- data/vendor/assets/javascripts/fuelux/spinner.js +2 -3
- data/vendor/assets/javascripts/fuelux/tree.js +166 -0
- data/vendor/assets/javascripts/fuelux/util.js +26 -0
- data/vendor/assets/javascripts/fuelux/wizard.js +154 -0
- data/vendor/assets/javascripts/fuelux.js +6 -0
- data/vendor/toolkit/fuelux/checkbox.less +52 -0
- data/vendor/toolkit/fuelux/combobox.less +0 -0
- data/vendor/toolkit/fuelux/datagrid.less +0 -0
- data/vendor/toolkit/fuelux/pillbox.less +0 -0
- data/vendor/toolkit/fuelux/radio.less +52 -0
- data/vendor/toolkit/fuelux/select.less +17 -0
- data/vendor/toolkit/fuelux/spinner.less +0 -0
- data/vendor/toolkit/fuelux/tree.less +97 -0
- data/vendor/toolkit/fuelux/wizard.less +147 -0
- data/vendor/toolkit/fuelux.less +7 -0
- metadata +20 -7
- data/MIT-LICENSE +0 -20
- data/README.rdoc +0 -3
@@ -0,0 +1,106 @@
|
|
1
|
+
/*
|
2
|
+
* Fuel UX Radio
|
3
|
+
* https://github.com/ExactTarget/fuelux
|
4
|
+
*
|
5
|
+
* Copyright (c) 2012 ExactTarget
|
6
|
+
* Licensed under the MIT license.
|
7
|
+
*/
|
8
|
+
|
9
|
+
!function ($) {
|
10
|
+
|
11
|
+
// RADIO CONSTRUCTOR AND PROTOTYPE
|
12
|
+
|
13
|
+
var Radio = function (element, options) {
|
14
|
+
this.$element = $(element);
|
15
|
+
this.options = $.extend({}, $.fn.radio.defaults, options);
|
16
|
+
|
17
|
+
// cache elements
|
18
|
+
this.$label = this.$element.parent();
|
19
|
+
this.$icon = this.$label.find('i');
|
20
|
+
this.$radio = this.$label.find('input[type=radio]');
|
21
|
+
this.groupName = this.$radio.attr('name');
|
22
|
+
|
23
|
+
// set default state
|
24
|
+
this.setState(this.$radio);
|
25
|
+
|
26
|
+
// handle events
|
27
|
+
this.$radio.on('change', $.proxy(this.itemchecked, this));
|
28
|
+
};
|
29
|
+
|
30
|
+
Radio.prototype = {
|
31
|
+
|
32
|
+
constructor: Radio,
|
33
|
+
|
34
|
+
setState: function ($radio, resetGroupState) {
|
35
|
+
var checked = $radio.is(':checked');
|
36
|
+
var disabled = $radio.is(':disabled');
|
37
|
+
|
38
|
+
// set state of radio
|
39
|
+
if (checked === true) {
|
40
|
+
this.$icon.addClass('checked');
|
41
|
+
}
|
42
|
+
if (disabled === true) {
|
43
|
+
this.$icon.addClass('disabled');
|
44
|
+
}
|
45
|
+
},
|
46
|
+
|
47
|
+
resetGroup: function () {
|
48
|
+
// reset all radio buttons in group
|
49
|
+
$('input[name=' + this.groupName + ']').next().removeClass('checked');
|
50
|
+
},
|
51
|
+
|
52
|
+
enable: function () {
|
53
|
+
this.$radio.attr('disabled', false);
|
54
|
+
this.$icon.removeClass('disabled');
|
55
|
+
},
|
56
|
+
|
57
|
+
disable: function () {
|
58
|
+
this.$radio.attr('disabled', true);
|
59
|
+
this.$icon.addClass('disabled');
|
60
|
+
},
|
61
|
+
|
62
|
+
itemchecked: function (e) {
|
63
|
+
var radio = $(e.target);
|
64
|
+
|
65
|
+
this.resetGroup();
|
66
|
+
this.setState(radio);
|
67
|
+
}
|
68
|
+
};
|
69
|
+
|
70
|
+
|
71
|
+
// RADIO PLUGIN DEFINITION
|
72
|
+
|
73
|
+
$.fn.radio = function (option, value) {
|
74
|
+
var methodReturn;
|
75
|
+
|
76
|
+
var $set = this.each(function () {
|
77
|
+
var $this = $(this);
|
78
|
+
var data = $this.data('radio');
|
79
|
+
var options = typeof option === 'object' && option;
|
80
|
+
|
81
|
+
if (!data) $this.data('radio', (data = new Radio(this, options)));
|
82
|
+
if (typeof option === 'string') methodReturn = data[option](value);
|
83
|
+
});
|
84
|
+
|
85
|
+
return (methodReturn === undefined) ? $set : methodReturn;
|
86
|
+
};
|
87
|
+
|
88
|
+
$.fn.radio.defaults = {};
|
89
|
+
|
90
|
+
$.fn.radio.Constructor = Radio;
|
91
|
+
|
92
|
+
|
93
|
+
// RADIO DATA-API
|
94
|
+
|
95
|
+
$(function () {
|
96
|
+
$(window).on('load', function () {
|
97
|
+
//$('i.radio').each(function () {
|
98
|
+
$('.radio-custom > input[type=radio]').each(function () {
|
99
|
+
var $this = $(this);
|
100
|
+
if ($this.data('radio')) return;
|
101
|
+
$this.radio($this.data());
|
102
|
+
});
|
103
|
+
});
|
104
|
+
});
|
105
|
+
|
106
|
+
}(window.jQuery);
|
@@ -0,0 +1,166 @@
|
|
1
|
+
/*
|
2
|
+
* Fuel UX Select
|
3
|
+
* https://github.com/ExactTarget/fuelux
|
4
|
+
*
|
5
|
+
* Copyright (c) 2012 ExactTarget
|
6
|
+
* Licensed under the MIT license.
|
7
|
+
*/
|
8
|
+
|
9
|
+
!function ($) {
|
10
|
+
|
11
|
+
// SELECT CONSTRUCTOR AND PROTOTYPE
|
12
|
+
|
13
|
+
var Select = function (element, options) {
|
14
|
+
this.$element = $(element);
|
15
|
+
this.options = $.extend({}, $.fn.select.defaults, options);
|
16
|
+
this.$element.on('click', 'a', $.proxy(this.itemclicked, this));
|
17
|
+
this.$button = this.$element.find('.btn');
|
18
|
+
this.$label = this.$element.find('.dropdown-label');
|
19
|
+
this.setDefaultSelection();
|
20
|
+
|
21
|
+
if (options.resize === 'auto') {
|
22
|
+
this.resize();
|
23
|
+
}
|
24
|
+
};
|
25
|
+
|
26
|
+
Select.prototype = {
|
27
|
+
|
28
|
+
constructor: Select,
|
29
|
+
|
30
|
+
itemclicked: function (e) {
|
31
|
+
this.$selectedItem = $(e.target).parent();
|
32
|
+
this.$label.text(this.$selectedItem.text());
|
33
|
+
|
34
|
+
// pass object including text and any data-attributes
|
35
|
+
// to onchange event
|
36
|
+
var data = this.selectedItem();
|
37
|
+
|
38
|
+
// trigger changed event
|
39
|
+
this.$element.trigger('changed', data);
|
40
|
+
|
41
|
+
e.preventDefault();
|
42
|
+
},
|
43
|
+
|
44
|
+
resize: function() {
|
45
|
+
var el = $('#selectTextSize')[0];
|
46
|
+
|
47
|
+
// create element if it doesn't exist
|
48
|
+
// used to calculate the length of the longest string
|
49
|
+
if(!el) {
|
50
|
+
$('<div/>').attr({id:'selectTextSize'}).appendTo('body');
|
51
|
+
}
|
52
|
+
|
53
|
+
var width = 0;
|
54
|
+
var newWidth = 0;
|
55
|
+
|
56
|
+
// iterate through each item to find longest string
|
57
|
+
this.$element.find('a').each(function () {
|
58
|
+
var $this = $(this);
|
59
|
+
var txt = $this.text();
|
60
|
+
var $txtSize = $('#selectTextSize');
|
61
|
+
$txtSize.text(txt);
|
62
|
+
newWidth = $txtSize.outerWidth();
|
63
|
+
if(newWidth > width) {
|
64
|
+
width = newWidth;
|
65
|
+
}
|
66
|
+
});
|
67
|
+
|
68
|
+
this.$label.width(width);
|
69
|
+
},
|
70
|
+
|
71
|
+
selectedItem: function() {
|
72
|
+
var txt = this.$selectedItem.text();
|
73
|
+
return $.extend({ text: txt }, this.$selectedItem.data());
|
74
|
+
},
|
75
|
+
|
76
|
+
selectByText: function(text) {
|
77
|
+
var selector = 'li a:fuelTextExactCI(' + text + ')';
|
78
|
+
this.selectBySelector(selector);
|
79
|
+
},
|
80
|
+
|
81
|
+
selectByValue: function(value) {
|
82
|
+
var selector = 'li[data-value=' + value + ']';
|
83
|
+
this.selectBySelector(selector);
|
84
|
+
},
|
85
|
+
|
86
|
+
selectByIndex: function(index) {
|
87
|
+
// zero-based index
|
88
|
+
var selector = 'li:eq(' + index + ')';
|
89
|
+
this.selectBySelector(selector);
|
90
|
+
},
|
91
|
+
|
92
|
+
selectBySelector: function(selector) {
|
93
|
+
var item = this.$element.find(selector);
|
94
|
+
|
95
|
+
this.$selectedItem = item;
|
96
|
+
this.$label.text(this.$selectedItem.text());
|
97
|
+
},
|
98
|
+
|
99
|
+
setDefaultSelection: function() {
|
100
|
+
var selector = 'li[data-selected=true]:first';
|
101
|
+
var item = this.$element.find(selector);
|
102
|
+
if(item.length === 0) {
|
103
|
+
// select first item
|
104
|
+
this.selectByIndex(0);
|
105
|
+
}
|
106
|
+
else {
|
107
|
+
// select by data-attribute
|
108
|
+
this.selectBySelector(selector);
|
109
|
+
item.removeData('selected');
|
110
|
+
item.removeAttr('data-selected');
|
111
|
+
}
|
112
|
+
},
|
113
|
+
|
114
|
+
enable: function() {
|
115
|
+
this.$button.removeClass('disabled');
|
116
|
+
},
|
117
|
+
|
118
|
+
disable: function() {
|
119
|
+
this.$button.addClass('disabled');
|
120
|
+
}
|
121
|
+
|
122
|
+
};
|
123
|
+
|
124
|
+
|
125
|
+
// SELECT PLUGIN DEFINITION
|
126
|
+
|
127
|
+
$.fn.select = function (option,value) {
|
128
|
+
var methodReturn;
|
129
|
+
|
130
|
+
var $set = this.each(function () {
|
131
|
+
var $this = $(this);
|
132
|
+
var data = $this.data('select');
|
133
|
+
var options = typeof option === 'object' && option;
|
134
|
+
|
135
|
+
if (!data) $this.data('select', (data = new Select(this, options)));
|
136
|
+
if (typeof option === 'string') methodReturn = data[option](value);
|
137
|
+
});
|
138
|
+
|
139
|
+
return (methodReturn === undefined) ? $set : methodReturn;
|
140
|
+
};
|
141
|
+
|
142
|
+
$.fn.select.defaults = {};
|
143
|
+
|
144
|
+
$.fn.select.Constructor = Select;
|
145
|
+
|
146
|
+
|
147
|
+
// SELECT DATA-API
|
148
|
+
|
149
|
+
$(function () {
|
150
|
+
|
151
|
+
$(window).on('load', function () {
|
152
|
+
$('.select').each(function () {
|
153
|
+
var $this = $(this);
|
154
|
+
if ($this.data('select')) return;
|
155
|
+
$this.select($this.data());
|
156
|
+
});
|
157
|
+
});
|
158
|
+
|
159
|
+
$('body').on('mousedown.select.data-api', '.select', function (e) {
|
160
|
+
var $this = $(this);
|
161
|
+
if ($this.data('select')) return;
|
162
|
+
$this.select($this.data());
|
163
|
+
});
|
164
|
+
});
|
165
|
+
|
166
|
+
}(window.jQuery);
|
@@ -0,0 +1,166 @@
|
|
1
|
+
/*
|
2
|
+
* Fuel UX Tree
|
3
|
+
* https://github.com/ExactTarget/fuelux
|
4
|
+
*
|
5
|
+
* Copyright (c) 2012 ExactTarget
|
6
|
+
* Licensed under the MIT license.
|
7
|
+
*/
|
8
|
+
|
9
|
+
!function ($) {
|
10
|
+
|
11
|
+
// TREE CONSTRUCTOR AND PROTOTYPE
|
12
|
+
|
13
|
+
var Tree = function (element, options) {
|
14
|
+
this.$element = $(element);
|
15
|
+
this.options = $.extend({}, $.fn.tree.defaults, options);
|
16
|
+
|
17
|
+
this.$element.on('click', '.tree-item', $.proxy( function(ev) { this.selectItem(ev.currentTarget); } ,this));
|
18
|
+
this.$element.on('click', '.tree-folder-header', $.proxy( function(ev) { this.selectFolder(ev.currentTarget); }, this));
|
19
|
+
|
20
|
+
this.render();
|
21
|
+
};
|
22
|
+
|
23
|
+
Tree.prototype = {
|
24
|
+
constructor: Tree,
|
25
|
+
|
26
|
+
render: function () {
|
27
|
+
this.populate(this.$element);
|
28
|
+
},
|
29
|
+
|
30
|
+
populate: function ($el) {
|
31
|
+
var self = this;
|
32
|
+
var loader = $el.parent().find('.tree-loader:eq(0)');
|
33
|
+
|
34
|
+
loader.show();
|
35
|
+
this.options.dataSource.data($el.data(), function (items) {
|
36
|
+
loader.hide();
|
37
|
+
|
38
|
+
$.each( items.data, function(index, value) {
|
39
|
+
var $entity;
|
40
|
+
|
41
|
+
if(value.type === "folder") {
|
42
|
+
$entity = self.$element.find('.tree-folder:eq(0)').clone().show();
|
43
|
+
$entity.find('.tree-folder-name').html(value.name);
|
44
|
+
$entity.find('.tree-loader').html(self.options.loadingHTML);
|
45
|
+
$entity.find('.tree-folder-header').data(value);
|
46
|
+
} else if (value.type === "item") {
|
47
|
+
$entity = self.$element.find('.tree-item:eq(0)').clone().show();
|
48
|
+
$entity.find('.tree-item-name').html(value.name);
|
49
|
+
$entity.data(value);
|
50
|
+
}
|
51
|
+
|
52
|
+
if($el.hasClass('tree-folder-header')) {
|
53
|
+
$el.parent().find('.tree-folder-content:eq(0)').append($entity);
|
54
|
+
} else {
|
55
|
+
$el.append($entity);
|
56
|
+
}
|
57
|
+
});
|
58
|
+
|
59
|
+
self.$element.trigger('loaded');
|
60
|
+
});
|
61
|
+
},
|
62
|
+
|
63
|
+
selectItem: function (el) {
|
64
|
+
var $el = $(el);
|
65
|
+
var $all = this.$element.find('.tree-selected');
|
66
|
+
var data = [];
|
67
|
+
|
68
|
+
if (this.options.multiSelect) {
|
69
|
+
$.each($all, function(index, value) {
|
70
|
+
var $val = $(value);
|
71
|
+
if($val[0] !== $el[0]) {
|
72
|
+
data.push( $(value).data() );
|
73
|
+
}
|
74
|
+
});
|
75
|
+
} else if ($all[0] !== $el[0]) {
|
76
|
+
$all.removeClass('tree-selected')
|
77
|
+
.find('i').removeClass('icon-ok').addClass('tree-dot');
|
78
|
+
data.push($el.data());
|
79
|
+
}
|
80
|
+
|
81
|
+
if($el.hasClass('tree-selected')) {
|
82
|
+
$el.removeClass('tree-selected');
|
83
|
+
$el.find('i').removeClass('icon-ok').addClass('tree-dot');
|
84
|
+
} else {
|
85
|
+
$el.addClass ('tree-selected');
|
86
|
+
$el.find('i').removeClass('tree-dot').addClass('icon-ok');
|
87
|
+
if (this.options.multiSelect) {
|
88
|
+
data.push( $el.data() );
|
89
|
+
}
|
90
|
+
}
|
91
|
+
|
92
|
+
if(data.length) {
|
93
|
+
this.$element.trigger('selected', {info: data});
|
94
|
+
}
|
95
|
+
|
96
|
+
},
|
97
|
+
|
98
|
+
selectFolder: function (el) {
|
99
|
+
var $el = $(el);
|
100
|
+
var $par = $el.parent();
|
101
|
+
|
102
|
+
if($el.find('.icon-folder-close').length) {
|
103
|
+
if ($par.find('.tree-folder-content').children().length) {
|
104
|
+
$par.find('.tree-folder-content:eq(0)').show();
|
105
|
+
} else {
|
106
|
+
this.populate( $el );
|
107
|
+
}
|
108
|
+
|
109
|
+
$par.find('.icon-folder-close:eq(0)')
|
110
|
+
.removeClass('icon-folder-close')
|
111
|
+
.addClass('icon-folder-open');
|
112
|
+
|
113
|
+
this.$element.trigger('opened', $el.data());
|
114
|
+
} else {
|
115
|
+
if(this.options.cacheItems) {
|
116
|
+
$par.find('.tree-folder-content:eq(0)').hide();
|
117
|
+
} else {
|
118
|
+
$par.find('.tree-folder-content:eq(0)').empty();
|
119
|
+
}
|
120
|
+
|
121
|
+
$par.find('.icon-folder-open:eq(0)')
|
122
|
+
.removeClass('icon-folder-open')
|
123
|
+
.addClass('icon-folder-close');
|
124
|
+
|
125
|
+
this.$element.trigger('closed', $el.data());
|
126
|
+
}
|
127
|
+
},
|
128
|
+
|
129
|
+
selectedItems: function () {
|
130
|
+
var $sel = this.$element.find('.tree-selected');
|
131
|
+
var data = [];
|
132
|
+
|
133
|
+
$.each($sel, function (index, value) {
|
134
|
+
data.push($(value).data());
|
135
|
+
});
|
136
|
+
return data;
|
137
|
+
}
|
138
|
+
};
|
139
|
+
|
140
|
+
|
141
|
+
// TREE PLUGIN DEFINITION
|
142
|
+
|
143
|
+
$.fn.tree = function (option, value) {
|
144
|
+
var methodReturn;
|
145
|
+
|
146
|
+
var $set = this.each(function () {
|
147
|
+
var $this = $(this);
|
148
|
+
var data = $this.data('tree');
|
149
|
+
var options = typeof option === 'object' && option;
|
150
|
+
|
151
|
+
if (!data) $this.data('tree', (data = new Tree(this, options)));
|
152
|
+
if (typeof option === 'string') methodReturn = data[option](value);
|
153
|
+
});
|
154
|
+
|
155
|
+
return (methodReturn === undefined) ? $set : methodReturn;
|
156
|
+
};
|
157
|
+
|
158
|
+
$.fn.tree.defaults = {
|
159
|
+
multiSelect: false,
|
160
|
+
loadingHTML: '<div>Loading...</div>',
|
161
|
+
cacheItems: true
|
162
|
+
};
|
163
|
+
|
164
|
+
$.fn.tree.Constructor = Tree;
|
165
|
+
|
166
|
+
}(window.jQuery);
|
@@ -0,0 +1,26 @@
|
|
1
|
+
/*
|
2
|
+
* Fuel UX Utilities
|
3
|
+
* https://github.com/ExactTarget/fuelux
|
4
|
+
*
|
5
|
+
* Copyright (c) 2012 ExactTarget
|
6
|
+
* Licensed under the MIT license.
|
7
|
+
*/
|
8
|
+
|
9
|
+
!function ($) {
|
10
|
+
|
11
|
+
// custom case-insensitive match expression
|
12
|
+
function fuelTextExactCI(elem, text) {
|
13
|
+
return (elem.textContent || elem.innerText || $(elem).text() || '').toLowerCase() === (text || '').toLowerCase();
|
14
|
+
}
|
15
|
+
|
16
|
+
$.expr[':'].fuelTextExactCI = $.expr.createPseudo ?
|
17
|
+
$.expr.createPseudo(function (text) {
|
18
|
+
return function (elem) {
|
19
|
+
return fuelTextExactCI(elem, text);
|
20
|
+
};
|
21
|
+
}) :
|
22
|
+
function (elem, i, match) {
|
23
|
+
return fuelTextExactCI(elem, match[3]);
|
24
|
+
};
|
25
|
+
|
26
|
+
}(window.jQuery);
|
@@ -0,0 +1,154 @@
|
|
1
|
+
/*
|
2
|
+
* Fuel UX Wizard
|
3
|
+
* https://github.com/ExactTarget/fuelux
|
4
|
+
*
|
5
|
+
* Copyright (c) 2012 ExactTarget
|
6
|
+
* Licensed under the MIT license.
|
7
|
+
*/
|
8
|
+
|
9
|
+
!function ($) {
|
10
|
+
|
11
|
+
// WIZARD CONSTRUCTOR AND PROTOTYPE
|
12
|
+
|
13
|
+
var Wizard = function (element, options) {
|
14
|
+
this.$element = $(element);
|
15
|
+
this.options = $.extend({}, $.fn.wizard.defaults, options);
|
16
|
+
this.currentStep = 1;
|
17
|
+
this.numSteps = this.$element.find('li').length;
|
18
|
+
this.$prevBtn = this.$element.find('button.btn-prev');
|
19
|
+
this.$nextBtn = this.$element.find('button.btn-next');
|
20
|
+
this.nextText = this.$nextBtn.text();
|
21
|
+
|
22
|
+
// handle events
|
23
|
+
this.$prevBtn.on('click', $.proxy(this.previous, this));
|
24
|
+
this.$nextBtn.on('click', $.proxy(this.next, this));
|
25
|
+
this.$element.on('click', 'li.complete', $.proxy(this.stepclicked, this));
|
26
|
+
};
|
27
|
+
|
28
|
+
Wizard.prototype = {
|
29
|
+
|
30
|
+
constructor: Wizard,
|
31
|
+
|
32
|
+
setState: function() {
|
33
|
+
var canMoveNext = (this.currentStep + 1 <= this.numSteps);
|
34
|
+
var lastStep = (this.currentStep === this.numSteps);
|
35
|
+
var canMovePrev = (this.currentStep > 1);
|
36
|
+
var firstStep = (this.currentStep === 1);
|
37
|
+
|
38
|
+
// disable buttons based on current step
|
39
|
+
this.$prevBtn.attr('disabled', (firstStep === true || canMovePrev === false));
|
40
|
+
this.$nextBtn.attr('disabled', (lastStep === true || canMoveNext === false));
|
41
|
+
|
42
|
+
// change button text of last step, if specified
|
43
|
+
var data = this.$nextBtn.data();
|
44
|
+
if(data && data.last) {
|
45
|
+
this.lastText = data.last;
|
46
|
+
if(typeof this.lastText !== 'undefined') {
|
47
|
+
var text = (lastStep !== true) ? this.nextText : this.lastText;
|
48
|
+
this.$nextBtn
|
49
|
+
.contents()
|
50
|
+
.filter(function() {
|
51
|
+
return this.nodeType === 3;
|
52
|
+
}).replaceWith(text);
|
53
|
+
}
|
54
|
+
}
|
55
|
+
|
56
|
+
// reset classes for all steps
|
57
|
+
var $steps = this.$element.find('li');
|
58
|
+
$steps.removeClass('active').removeClass('complete');
|
59
|
+
$steps.find('span.badge').removeClass('badge-info').removeClass('badge-success');
|
60
|
+
|
61
|
+
// set class for all previous steps
|
62
|
+
var prevSelector = 'li:lt(' + (this.currentStep - 1) + ')';
|
63
|
+
var $prevSteps = this.$element.find(prevSelector);
|
64
|
+
$prevSteps.addClass('complete');
|
65
|
+
$prevSteps.find('span.badge').addClass('badge-success');
|
66
|
+
|
67
|
+
// set class for current step
|
68
|
+
var currentSelector = 'li:eq(' + (this.currentStep - 1) + ')';
|
69
|
+
var $currentStep = this.$element.find(currentSelector);
|
70
|
+
$currentStep.addClass('active');
|
71
|
+
$currentStep.find('span.badge').addClass('badge-info');
|
72
|
+
|
73
|
+
// set display of target element
|
74
|
+
var target = $currentStep.data().target;
|
75
|
+
$('.step-pane').removeClass('active');
|
76
|
+
$(target).addClass('active');
|
77
|
+
|
78
|
+
this.$element.trigger('changed');
|
79
|
+
},
|
80
|
+
|
81
|
+
stepclicked: function(e) {
|
82
|
+
var li = $(e.currentTarget);
|
83
|
+
|
84
|
+
var index = $('.steps li').index(li);
|
85
|
+
this.currentStep = (index + 1);
|
86
|
+
this.setState();
|
87
|
+
},
|
88
|
+
|
89
|
+
previous: function() {
|
90
|
+
var canMovePrev = (this.currentStep > 1);
|
91
|
+
if(canMovePrev) {
|
92
|
+
var e = $.Event('change');
|
93
|
+
this.$element.trigger(e, {step:this.currentStep, direction:'previous'});
|
94
|
+
if (e.isDefaultPrevented()) return;
|
95
|
+
|
96
|
+
this.currentStep -= 1;
|
97
|
+
this.setState();
|
98
|
+
}
|
99
|
+
},
|
100
|
+
|
101
|
+
next: function() {
|
102
|
+
var canMoveNext = (this.currentStep + 1 <= this.numSteps);
|
103
|
+
if(canMoveNext) {
|
104
|
+
var e = $.Event('change');
|
105
|
+
this.$element.trigger(e, {step:this.currentStep, direction:'next'});
|
106
|
+
|
107
|
+
if (e.isDefaultPrevented()) return;
|
108
|
+
|
109
|
+
this.currentStep += 1;
|
110
|
+
this.setState();
|
111
|
+
}
|
112
|
+
},
|
113
|
+
|
114
|
+
selectedItem: function(val) {
|
115
|
+
return {
|
116
|
+
step: this.currentStep
|
117
|
+
};
|
118
|
+
}
|
119
|
+
};
|
120
|
+
|
121
|
+
|
122
|
+
// WIZARD PLUGIN DEFINITION
|
123
|
+
|
124
|
+
$.fn.wizard = function (option,value) {
|
125
|
+
var methodReturn;
|
126
|
+
|
127
|
+
var $set = this.each(function () {
|
128
|
+
var $this = $(this);
|
129
|
+
var data = $this.data('wizard');
|
130
|
+
var options = typeof option === 'object' && option;
|
131
|
+
|
132
|
+
if (!data) $this.data('wizard', (data = new Wizard(this, options)));
|
133
|
+
if (typeof option === 'string') methodReturn = data[option](value);
|
134
|
+
});
|
135
|
+
|
136
|
+
return (methodReturn === undefined) ? $set : methodReturn;
|
137
|
+
};
|
138
|
+
|
139
|
+
$.fn.wizard.defaults = {};
|
140
|
+
|
141
|
+
$.fn.wizard.Constructor = Wizard;
|
142
|
+
|
143
|
+
|
144
|
+
// WIZARD DATA-API
|
145
|
+
|
146
|
+
$(function () {
|
147
|
+
$('body').on('mousedown.wizard.data-api', '.wizard', function () {
|
148
|
+
var $this = $(this);
|
149
|
+
if ($this.data('wizard')) return;
|
150
|
+
$this.wizard($this.data());
|
151
|
+
});
|
152
|
+
});
|
153
|
+
|
154
|
+
}(window.jQuery);
|
@@ -1,5 +1,11 @@
|
|
1
|
+
//= require fuelux/util
|
1
2
|
//= require fuelux/combobox
|
2
3
|
//= require fuelux/datagrid
|
3
4
|
//= require fuelux/pillbox
|
4
5
|
//= require fuelux/search
|
5
6
|
//= require fuelux/spinner
|
7
|
+
//= require fuelux/radio
|
8
|
+
//= require fuelux/select
|
9
|
+
//= require fuelux/tree
|
10
|
+
//= require fuelux/search
|
11
|
+
//= require fuelux/wizard
|