jquery-ui-sliderAccess.js
3.04 KB
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
/*
* jQuery UI Slider Access
* By: Trent Richardson [http://trentrichardson.com]
* Version 0.3
* Last Modified: 10/20/2012
*
* Copyright 2011 Trent Richardson
* Dual licensed under the MIT and GPL licenses.
* http://trentrichardson.com/Impromptu/GPL-LICENSE.txt
* http://trentrichardson.com/Impromptu/MIT-LICENSE.txt
*
*/
var jQuery = require("jquery");
(function($){
$.fn.extend({
sliderAccess: function(options){
options = options || {};
options.touchonly = options.touchonly !== undefined? options.touchonly : true; // by default only show it if touch device
if(options.touchonly === true && !("ontouchend" in document)){
return $(this);
}
return $(this).each(function(i,obj){
var $t = $(this),
o = $.extend({},{
where: 'after',
step: $t.slider('option','step'),
upIcon: 'ui-icon-plus',
downIcon: 'ui-icon-minus',
text: false,
upText: '+',
downText: '-',
buttonset: true,
buttonsetTag: 'span',
isRTL: false
}, options),
$buttons = $('<'+ o.buttonsetTag +' class="ui-slider-access">'+
'<button data-icon="'+ o.downIcon +'" data-step="'+ (o.isRTL? o.step : o.step*-1) +'">'+ o.downText +'</button>'+
'<button data-icon="'+ o.upIcon +'" data-step="'+ (o.isRTL? o.step*-1 : o.step) +'">'+ o.upText +'</button>'+
'</'+ o.buttonsetTag +'>');
$buttons.children('button').each(function(j, jobj){
var $jt = $(this);
$jt.button({
text: o.text,
icons: { primary: $jt.data('icon') }
})
.click(function(e){
var step = $jt.data('step'),
curr = $t.slider('value'),
newval = curr += step*1,
minval = $t.slider('option','min'),
maxval = $t.slider('option','max'),
slidee = $t.slider("option", "slide") || function(){},
stope = $t.slider("option", "stop") || function(){};
e.preventDefault();
if(newval < minval || newval > maxval){
return;
}
$t.slider('value', newval);
slidee.call($t, null, { value: newval });
stope.call($t, null, { value: newval });
});
});
// before or after
$t[o.where]($buttons);
if(o.buttonset){
$buttons.removeClass('ui-corner-right').removeClass('ui-corner-left').buttonset();
$buttons.eq(0).addClass('ui-corner-left');
$buttons.eq(1).addClass('ui-corner-right');
}
// adjust the width so we don't break the original layout
var bOuterWidth = $buttons.css({
marginLeft: ((o.where === 'after' && !o.isRTL) || (o.where === 'before' && o.isRTL)? 10:0),
marginRight: ((o.where === 'before' && !o.isRTL) || (o.where === 'after' && o.isRTL)? 10:0)
}).outerWidth(true) + 5;
var tOuterWidth = $t.outerWidth(true);
$t.css('display','inline-block').width(tOuterWidth-bOuterWidth);
});
}
});
})(jQuery);