| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- /**
- <b>Spinner</b>. A wrapper for FuelUX spinner element.
- It's just a wrapper so you still need to include FuelUX spinner script first.
- */
- (function($ , undefined) {
- //a wrapper for fuelux spinner
- function Ace_Spinner(element , options) {
- var max = options.max
- max = (''+max).length
- var width = parseInt(Math.max((max * 20 + 40) , 90))
- var $element = $(element);
- $element.addClass('spinbox-input form-control').wrap('<div class="ace-spinner middle">')
- var $parent_div = $element.closest('.ace-spinner').spinbox(options).wrapInner("<div class='input-group'></div>")
- var $spinner = $parent_div.data('fu.spinbox');
-
- if(options.on_sides)
- {
- $element
- .before('<div class="spinbox-buttons input-group-btn">\
- <button type="button" class="btn spinbox-down btn-xs '+options.btn_down_class+'">\
- <i class="'+ ace.vars['icon'] + options.icon_down+'"></i>\
- </button>\
- </div>')
- .after('<div class="spinbox-buttons input-group-btn">\
- <button type="button" class="btn spinbox-up btn-xs '+options.btn_up_class+'">\
- <i class="'+ ace.vars['icon'] + options.icon_up+'"></i>\
- </button>\
- </div>');
- $parent_div.addClass('touch-spinner')
- $parent_div.css('width' , width+'px')
- }
- else {
- $element
- .after('<div class="spinbox-buttons input-group-btn">\
- <button type="button" class="btn spinbox-up btn-xs '+options.btn_up_class+'">\
- <i class="'+ ace.vars['icon'] + options.icon_up+'"></i>\
- </button>\
- <button type="button" class="btn spinbox-down btn-xs '+options.btn_down_class+'">\
- <i class="'+ ace.vars['icon'] + options.icon_down+'"></i>\
- </button>\
- </div>')
- if(ace.vars['touch'] || options.touch_spinner) {
- $parent_div.addClass('touch-spinner')
- $parent_div.css('width' , width+'px')
- }
- else {
- $element.next().addClass('btn-group-vertical');
- $parent_div.css('width' , width+'px')
- }
- }
- $parent_div.on('changed', function(){
- $element.trigger('change')//trigger the input's change event
- });
- this._call = function(name, arg) {
- $spinner[name](arg);
- }
- }
- $.fn.ace_spinner = function(option, value) {
- var retval;
- var $set = this.each(function() {
- var $this = $(this);
- var data = $this.data('ace_spinner');
- var options = typeof option === 'object' && option;
- if (!data) {
- options = $.extend({}, $.fn.ace_spinner.defaults, option);
- $this.data('ace_spinner', (data = new Ace_Spinner(this, options)));
- }
- if (typeof option === 'string') retval = data._call(option, value);
- });
- return (retval === undefined) ? $set : retval;
- }
-
- $.fn.ace_spinner.defaults = {
- 'icon_up' : 'fa fa-chevron-up',
- 'icon_down': 'fa fa-chevron-down',
-
- 'on_sides': false,
- 'btn_up_class': '',
- 'btn_down_class' : '',
-
- 'max' : 999,
- 'touch_spinner': false
- }
- })(window.jQuery);
|