fuelux-rails 2.1.3 → 2.2.0.beta.1
Sign up to get free protection for your applications and to get access to all the features.
- 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
|