Skip to content

Commit d89b8f0

Browse files
scottgonzalezscottgonzalez
committed
Slider: Remove uses of self var; use new APIs or that var.
1 parent 653673e commit d89b8f0

File tree

1 file changed

+51
-71
lines changed

1 file changed

+51
-71
lines changed

‎ui/jquery.ui.slider.js

Lines changed: 51 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@ $.widget( "ui.slider", $.ui.mouse, {
3636

3737
_create: function() {
3838
var i,
39-
self = this,
4039
o = this.options,
4140
existingHandles = this.element.find( ".ui-slider-handle" ).addClass( "ui-state-default ui-corner-all" ),
4241
handle = "<a class='ui-slider-handle ui-state-default ui-corner-all' href='#'></a>",
@@ -83,7 +82,7 @@ $.widget( "ui.slider", $.ui.mouse, {
8382
handles.push( handle );
8483
}
8584

86-
this.handles = existingHandles.add( $( handles.join( "" ) ).appendTo( self.element ) );
85+
this.handles = existingHandles.add( $( handles.join( "" ) ).appendTo( this.element ) );
8786

8887
this.handle = this.handles.eq( 0 );
8988

@@ -114,17 +113,10 @@ $.widget( "ui.slider", $.ui.mouse, {
114113
$( this ).data( "ui-slider-handle-index", i );
115114
});
116115

117-
this.handles
118-
.keydown(function( event ) {
119-
var index = $( this ).data( "ui-slider-handle-index" ),
120-
allowed,
121-
curVal,
122-
newVal,
123-
step;
124-
125-
if ( self.options.disabled ) {
126-
return;
127-
}
116+
this._bind( this.handles, {
117+
keydown: function( event ) {
118+
var allowed, curVal, newVal, step,
119+
index = $( event.target ).data( "ui-slider-handle-index" );
128120

129121
switch ( event.keyCode ) {
130122
case $.ui.keyCode.HOME:
@@ -136,66 +128,66 @@ $.widget( "ui.slider", $.ui.mouse, {
136128
case $.ui.keyCode.DOWN:
137129
case $.ui.keyCode.LEFT:
138130
event.preventDefault();
139-
if ( !self._keySliding ) {
140-
self._keySliding = true;
141-
$( this ).addClass( "ui-state-active" );
142-
allowed = self._start( event, index );
131+
if ( !this._keySliding ) {
132+
this._keySliding = true;
133+
$( event.target ).addClass( "ui-state-active" );
134+
allowed = this._start( event, index );
143135
if ( allowed === false ) {
144136
return;
145137
}
146138
}
147139
break;
148140
}
149141

150-
step = self.options.step;
151-
if ( self.options.values && self.options.values.length ) {
152-
curVal = newVal = self.values( index );
142+
step = this.options.step;
143+
if ( this.options.values && this.options.values.length ) {
144+
curVal = newVal = this.values( index );
153145
} else {
154-
curVal = newVal = self.value();
146+
curVal = newVal = this.value();
155147
}
156148

157149
switch ( event.keyCode ) {
158150
case $.ui.keyCode.HOME:
159-
newVal = self._valueMin();
151+
newVal = this._valueMin();
160152
break;
161153
case $.ui.keyCode.END:
162-
newVal = self._valueMax();
154+
newVal = this._valueMax();
163155
break;
164156
case $.ui.keyCode.PAGE_UP:
165-
newVal = self._trimAlignValue( curVal + ( (self._valueMax() - self._valueMin()) / numPages ) );
157+
newVal = this._trimAlignValue( curVal + ( (this._valueMax() - this._valueMin()) / numPages ) );
166158
break;
167159
case $.ui.keyCode.PAGE_DOWN:
168-
newVal = self._trimAlignValue( curVal - ( (self._valueMax() - self._valueMin()) / numPages ) );
160+
newVal = this._trimAlignValue( curVal - ( (this._valueMax() - this._valueMin()) / numPages ) );
169161
break;
170162
case $.ui.keyCode.UP:
171163
case $.ui.keyCode.RIGHT:
172-
if ( curVal === self._valueMax() ) {
164+
if ( curVal === this._valueMax() ) {
173165
return;
174166
}
175-
newVal = self._trimAlignValue( curVal + step );
167+
newVal = this._trimAlignValue( curVal + step );
176168
break;
177169
case $.ui.keyCode.DOWN:
178170
case $.ui.keyCode.LEFT:
179-
if ( curVal === self._valueMin() ) {
171+
if ( curVal === this._valueMin() ) {
180172
return;
181173
}
182-
newVal = self._trimAlignValue( curVal - step );
174+
newVal = this._trimAlignValue( curVal - step );
183175
break;
184176
}
185177

186-
self._slide( event, index, newVal );
187-
})
188-
.keyup(function( event ) {
189-
var index = $( this ).data( "ui-slider-handle-index" );
190-
191-
if ( self._keySliding ) {
192-
self._keySliding = false;
193-
self._stop( event, index );
194-
self._change( event, index );
195-
$( this ).removeClass( "ui-state-active" );
196-
}
178+
this._slide( event, index, newVal );
179+
},
180+
keyup: function( event ) {
181+
var index = $( event.target ).data( "ui-slider-handle-index" );
197182

198-
});
183+
if ( this._keySliding ) {
184+
this._keySliding = false;
185+
this._stop( event, index );
186+
this._change( event, index );
187+
$( event.target ).removeClass( "ui-state-active" );
188+
}
189+
}
190+
});
199191

200192
this._refreshValue();
201193

@@ -223,16 +215,9 @@ $.widget( "ui.slider", $.ui.mouse, {
223215
},
224216

225217
_mouseCapture: function( event ) {
226-
var o = this.options,
227-
position,
228-
normValue,
229-
distance,
230-
closestHandle,
231-
self,
232-
index,
233-
allowed,
234-
offset,
235-
mouseOverHandle;
218+
var position, normValue, distance, closestHandle, index, allowed, offset, mouseOverHandle,
219+
that = this,
220+
o = this.options;
236221

237222
if ( o.disabled ) {
238223
return false;
@@ -247,9 +232,8 @@ $.widget( "ui.slider", $.ui.mouse, {
247232
position = { x: event.pageX, y: event.pageY };
248233
normValue = this._normValueFromMouse( position );
249234
distance = this._valueMax() - this._valueMin() + 1;
250-
self = this;
251235
this.handles.each(function( i ) {
252-
var thisDistance = Math.abs( normValue - self.values(i) );
236+
var thisDistance = Math.abs( normValue - that.values(i) );
253237
if ( distance > thisDistance ) {
254238
distance = thisDistance;
255239
closestHandle = $( this );
@@ -271,7 +255,7 @@ $.widget( "ui.slider", $.ui.mouse, {
271255
}
272256
this._mouseSliding = true;
273257

274-
self._handleIndex = index;
258+
this._handleIndex = index;
275259

276260
closestHandle
277261
.addClass( "ui-state-active" )
@@ -594,36 +578,32 @@ $.widget( "ui.slider", $.ui.mouse, {
594578
},
595579

596580
_refreshValue: function() {
597-
var oRange = this.options.range,
581+
var lastValPercent, valPercent, value, valueMin, valueMax,
582+
oRange = this.options.range,
598583
o = this.options,
599-
self = this,
584+
that = this,
600585
animate = ( !this._animateOff ) ? o.animate : false,
601-
valPercent,
602-
_set = {},
603-
lastValPercent,
604-
value,
605-
valueMin,
606-
valueMax;
586+
_set = {};
607587

608588
if ( this.options.values && this.options.values.length ) {
609589
this.handles.each(function( i, j ) {
610-
valPercent = ( self.values(i) - self._valueMin() ) / ( self._valueMax() - self._valueMin() ) * 100;
611-
_set[ self.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
590+
valPercent = ( that.values(i) - that._valueMin() ) / ( that._valueMax() - that._valueMin() ) * 100;
591+
_set[ that.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
612592
$( this ).stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate );
613-
if ( self.options.range === true ) {
614-
if ( self.orientation === "horizontal" ) {
593+
if ( that.options.range === true ) {
594+
if ( that.orientation === "horizontal" ) {
615595
if ( i === 0 ) {
616-
self.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { left: valPercent + "%" }, o.animate );
596+
that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { left: valPercent + "%" }, o.animate );
617597
}
618598
if ( i === 1 ) {
619-
self.range[ animate ? "animate" : "css" ]( { width: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
599+
that.range[ animate ? "animate" : "css" ]( { width: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
620600
}
621601
} else {
622602
if ( i === 0 ) {
623-
self.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { bottom: ( valPercent ) + "%" }, o.animate );
603+
that.range.stop( 1, 1 )[ animate ? "animate" : "css" ]( { bottom: ( valPercent ) + "%" }, o.animate );
624604
}
625605
if ( i === 1 ) {
626-
self.range[ animate ? "animate" : "css" ]( { height: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
606+
that.range[ animate ? "animate" : "css" ]( { height: ( valPercent - lastValPercent ) + "%" }, { queue: false, duration: o.animate } );
627607
}
628608
}
629609
}
@@ -636,7 +616,7 @@ $.widget( "ui.slider", $.ui.mouse, {
636616
valPercent = ( valueMax !== valueMin ) ?
637617
( value - valueMin ) / ( valueMax - valueMin ) * 100 :
638618
0;
639-
_set[ self.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
619+
_set[ this.orientation === "horizontal" ? "left" : "bottom" ] = valPercent + "%";
640620
this.handle.stop( 1, 1 )[ animate ? "animate" : "css" ]( _set, o.animate );
641621

642622
if ( oRange === "min" && this.orientation === "horizontal" ) {

0 commit comments

Comments
 (0)