fuel-ux-spinner源码

之前使用到了bootstrap的一个插件,但是没有api,所以直接把源码拷贝出来备份一下。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
/*
* Fuel UX Spinner
* https://github.com/ExactTarget/fuelux
*
* Copyright (c) 2012 ExactTarget
* Licensed under the MIT license.
*/
!function($) {
var Spinner = function(element, options) {
this.$element = $(element),
this.options = $.extend({}, $.fn.spinner.defaults, options),
this.$input = this.$element.find(".spinner-input"),
this.$element.on("keyup", this.$input, $.proxy(this.change, this)),
this.options.hold ? (this.$element.on("mousedown", ".spinner-up", $.proxy(function() {
this.startSpin(!0)
}, this)),
this.$element.on("mouseup", ".spinner-up, .spinner-down", $.proxy(this.stopSpin, this)),
this.$element.on("mouseout", ".spinner-up, .spinner-down", $.proxy(this.stopSpin, this)),
this.$element.on("mousedown", ".spinner-down", $.proxy(function() {
this.startSpin(!1)
}, this))) : (this.$element.on("click", ".spinner-up", $.proxy(function() {
this.step(!0)
}, this)),
this.$element.on("click", ".spinner-down", $.proxy(function() {
this.step(!1)
}, this))),
this.switches = {
count: 1,
enabled: !0
},
this.switches.speed = "medium" === this.options.speed ? 300 : "fast" === this.options.speed ? 100 : 500,
this.lastValue = null,
this.render(),
this.options.disabled && this.disable()
};
Spinner.prototype = {
constructor: Spinner,
render: function() {
var inputValue = this.$input.val();
inputValue ? this.value(inputValue) : this.$input.val(this.options.value),
this.$input.attr("maxlength", (this.options.max + "").split("").length)
},
change: function() {
var value = this.$input.val();
value / 1 ? this.options.value = value / 1 : (value = value.replace(/[^0-9]/g, ""),
this.$input.val(value),
this.options.value = value / 1),
this.triggerChangedEvent()
},
stopSpin: function() {
clearTimeout(this.switches.timeout),
this.switches.count = 1,
this.triggerChangedEvent()
},
triggerChangedEvent: function() {
var value = this.value();
value !== this.lastValue && (this.lastValue = value,
this.$element.trigger("changed", value),
this.$element.trigger("change"))
},
startSpin: function(t) {
if (!this.options.disabled) {
var i = this.switches.count;
1 === i ? (this.step(t),
i = 1) : i = 3 > i ? 1.5 : 8 > i ? 2.5 : 4,
this.switches.timeout = setTimeout($.proxy(function() {
this.iterator(t)
}, this), this.switches.speed / i),
this.switches.count++
}
},
iterator: function(e) {
this.step(e),
this.startSpin(e)
},
step: function(e) {
var t = this.options.value
, i = e ? this.options.max : this.options.min;
if (e ? i > t : t > i) {
var s = t + (e ? 1 : -1) * this.options.step;
(e ? s > i : i > s) ? this.value(i) : this.value(s)
} else if (this.options.cycle) {
var n = e ? this.options.min : this.options.max;
this.value(n)
}
},
value: function(value) {
return !isNaN(parseFloat(value)) && isFinite(value) ? (value = parseFloat(value),
this.options.value = value,
this.$input.val(value),
this) : this.options.value
},
disable: function() {
this.options.disabled = !0,
this.$input.attr("disabled", ""),
this.$element.find("button").addClass("disabled")
},
enable: function() {
this.options.disabled = !1,
this.$input.removeAttr("disabled"),
this.$element.find("button").removeClass("disabled")
}
},
$.fn.spinner = function(i, s) {
var n, a = this.each(function() {
var a = $(this)
, o = a.data("spinner")
, r = "object" == typeof i && i;
o || a.data("spinner", o = new Spinner(this,r)),
"string" == typeof i && (n = o[i](s))
});
return void 0 === n ? a : n
}
,
$.fn.spinner.defaults = {
value: 1,
min: 1,
max: 999,
step: 1,
hold: !0,
speed: "medium",
disabled: !1
},
$.fn.spinner.Constructor = Spinner,
$(function() {
$("body").on("mousedown.spinner.data-api", ".spinner", function() {
var t = $(this);
t.data("spinner") || t.spinner(t.data())
})
})
}(window.jQuery);