2016-05-03 11:26:42 +00:00
|
|
|
( function ( mw, $ ) {
|
2016-05-26 10:30:12 +00:00
|
|
|
var PointerView = function ( pointer, id ) {
|
2016-05-10 12:42:05 +00:00
|
|
|
this.pointer = pointer;
|
2016-05-13 10:29:05 +00:00
|
|
|
this.id = id;
|
2016-05-03 11:26:42 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
$.extend( PointerView.prototype, {
|
|
|
|
/**
|
|
|
|
* @type {string}
|
|
|
|
*/
|
2016-05-13 10:29:05 +00:00
|
|
|
id: '',
|
2016-05-03 11:26:42 +00:00
|
|
|
|
2016-05-10 12:42:05 +00:00
|
|
|
/**
|
|
|
|
* @type {Pointer}
|
|
|
|
*/
|
|
|
|
|
2016-05-03 11:26:42 +00:00
|
|
|
/**
|
|
|
|
* @type {jQuery}
|
|
|
|
*/
|
|
|
|
$html: null,
|
|
|
|
|
|
|
|
initialize: function () {
|
2016-06-03 08:55:17 +00:00
|
|
|
this.$html = $( '<div>' )
|
|
|
|
.attr( 'id', this.id )
|
|
|
|
.addClass( 'mw-pointer mw-pointer-cursor' );
|
2016-05-03 11:26:42 +00:00
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @return {jQuery}
|
|
|
|
*/
|
|
|
|
render: function () {
|
|
|
|
this.initialize();
|
|
|
|
return this.getElement();
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* @return {jQuery}
|
|
|
|
*/
|
|
|
|
getElement: function () {
|
|
|
|
return this.$html;
|
|
|
|
},
|
|
|
|
|
2016-05-26 10:30:12 +00:00
|
|
|
isUpperPointer: function () {
|
2016-05-30 10:06:44 +00:00
|
|
|
return this.getElement().hasClass( 'mw-upper-pointer' );
|
2016-05-26 10:30:12 +00:00
|
|
|
},
|
|
|
|
|
2016-05-03 11:26:42 +00:00
|
|
|
getOffset: function () {
|
2016-05-26 10:30:12 +00:00
|
|
|
return this.isUpperPointer() ? 16 : 0;
|
2016-05-10 12:42:05 +00:00
|
|
|
},
|
|
|
|
|
2016-05-10 14:01:39 +00:00
|
|
|
animateTo: function ( posInPx, duration ) {
|
2016-05-20 10:42:01 +00:00
|
|
|
return this.getElement().animate( { left: posInPx }, duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
},
|
|
|
|
|
2016-05-10 14:01:39 +00:00
|
|
|
slideToPosition: function ( slider, duration ) {
|
2016-05-12 15:19:14 +00:00
|
|
|
var relativePos = this.pointer.getPosition() - slider.getFirstVisibleRevisionIndex();
|
2016-05-26 09:50:51 +00:00
|
|
|
return this.animateTo( ( relativePos - 1 ) * slider.getView().revisionWidth, duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
},
|
|
|
|
|
2016-05-10 14:01:39 +00:00
|
|
|
slideToSide: function ( slider, posBeforeSlider, duration ) {
|
2016-05-10 12:42:05 +00:00
|
|
|
if ( posBeforeSlider ) {
|
2016-05-26 09:50:51 +00:00
|
|
|
return this.animateTo( this.getOffset() - 2 * slider.getView().revisionWidth, duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
} else {
|
2016-05-26 09:50:51 +00:00
|
|
|
return this.animateTo( slider.getRevisionsPerWindow() * slider.getView().revisionWidth + this.getOffset(), duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
}
|
|
|
|
},
|
|
|
|
|
2016-05-10 14:01:39 +00:00
|
|
|
slideToSideOrPosition: function ( slider, duration ) {
|
2016-05-12 15:19:14 +00:00
|
|
|
var firstVisibleRev = slider.getFirstVisibleRevisionIndex(),
|
2016-05-10 12:42:05 +00:00
|
|
|
posBeforeSlider = this.pointer.getPosition() < firstVisibleRev,
|
2016-05-12 15:19:14 +00:00
|
|
|
isVisible = !posBeforeSlider && this.pointer.getPosition() <= firstVisibleRev + slider.getRevisionsPerWindow();
|
2016-05-10 12:42:05 +00:00
|
|
|
if ( isVisible ) {
|
2016-05-20 10:42:01 +00:00
|
|
|
return this.slideToPosition( slider, duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
} else {
|
2016-05-20 10:42:01 +00:00
|
|
|
return this.slideToSide( slider, posBeforeSlider, duration );
|
2016-05-10 12:42:05 +00:00
|
|
|
}
|
2016-05-03 11:26:42 +00:00
|
|
|
}
|
|
|
|
} );
|
|
|
|
|
|
|
|
mw.libs.revisionSlider = mw.libs.revisionSlider || {};
|
|
|
|
mw.libs.revisionSlider.PointerView = PointerView;
|
|
|
|
}( mediaWiki, jQuery ) );
|