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.
@@ -6,7 +6,7 @@
6
6
  * Licensed under the MIT license.
7
7
  */
8
8
 
9
- !function($){
9
+ !function ($) {
10
10
 
11
11
  // PILLBOX CONSTRUCTOR AND PROTOTYPE
12
12
 
@@ -66,3 +66,4 @@
66
66
  });
67
67
 
68
68
  }(window.jQuery);
69
+
@@ -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);
@@ -6,8 +6,7 @@
6
6
  * Licensed under the MIT license.
7
7
  */
8
8
 
9
- !function($){
10
-
9
+ !function ($) {
11
10
 
12
11
  // SEARCH CONSTRUCTOR AND PROTOTYPE
13
12
 
@@ -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);
@@ -6,8 +6,7 @@
6
6
  * Licensed under the MIT license.
7
7
  */
8
8
 
9
- !function($){
10
-
9
+ !function ($) {
11
10
 
12
11
  // SPINNER CONSTRUCTOR AND PROTOTYPE
13
12
 
@@ -180,4 +179,4 @@
180
179
  });
181
180
  });
182
181
 
183
- }(window.jQuery);
182
+ }(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