mirror of
https://github.com/WordPress/WordPress.git
synced 2024-08-20 04:43:21 +02:00
9d6988a221
* Refines the UI to make it clearer and easier to use * Introduces weighted tickmarks * Fixes comparison bugs. See #23497 props adamsilverstein git-svn-id: http://core.svn.wordpress.org/trunk@23769 1a063a9b-81f0-0310-95a4-ce76da25c4cd
791 lines
24 KiB
JavaScript
791 lines
24 KiB
JavaScript
window.wp = window.wp || {};
|
|
|
|
(function($) {
|
|
wp.revisions = {
|
|
|
|
views : {},
|
|
|
|
Model : Backbone.Model.extend({
|
|
idAttribute : 'ID',
|
|
urlRoot : ajaxurl + '?action=revisions-data' +
|
|
'&show_autosaves=true&show_split_view=true&nonce=' + wpRevisionsSettings.nonce,
|
|
defaults: {
|
|
ID : 0,
|
|
revision_date_author : '',
|
|
revision_date_author_short: '',
|
|
revisiondiff : '<div class="diff-loading"><div class="spinner"></div></div>',
|
|
restoreaction : '',
|
|
revision_from_date_author : '',
|
|
revision_toload : false,
|
|
lines_added : 0,
|
|
lines_deleted : 0,
|
|
scope_of_changes : 'none',
|
|
previous_revision_id : 0
|
|
},
|
|
|
|
url : function() {
|
|
if ( 1 === REVAPP._compareoneortwo ) {
|
|
return this.urlRoot +
|
|
'&single_revision_id=' + this.id +
|
|
'&compare_to=' + this.get( 'previous_revision_id' ) +
|
|
'&post_id=' + wpRevisionsSettings.post_id;
|
|
} else {
|
|
return this.urlRoot +
|
|
'&single_revision_id=' + this.id;
|
|
}
|
|
|
|
}
|
|
|
|
}),
|
|
|
|
app: _.extend({}, Backbone.Events),
|
|
|
|
App : Backbone.Router.extend({
|
|
_revisionDifflView : null,
|
|
_revisions : null,
|
|
_left_handle_revisions : null,
|
|
_right_handle_revisions : null,
|
|
_revisionsInteractions : null,
|
|
_revisionsOptions : null,
|
|
_left_diff : 1,
|
|
_right_diff : 1,
|
|
_autosaves : true,
|
|
_show_split_view : true,
|
|
_compareoneortwo : 1,
|
|
_left_model_loading : false, //keep track of model loads
|
|
_right_model_loading : false, //disallow slider interaction, also repeat loads, while loading
|
|
_tickmarkView : null, //the slider tickmarks
|
|
_has_tooltip : false,
|
|
|
|
routes : {
|
|
},
|
|
|
|
reload_toload_revisions : function( model_collection, reverse_direction ) {
|
|
var self = this;
|
|
var revisions_to_load = model_collection.where( { revision_toload : true } );
|
|
var delay=0;
|
|
//match slider to passed revision_id
|
|
_.each( revisions_to_load, function( the_model ) {
|
|
if ( the_model.get( 'ID' ) == wpRevisionsSettings.revision_id ) {
|
|
self._right_diff = self._revisions.indexOf( the_model ) + 1;
|
|
}
|
|
|
|
});
|
|
_.each( revisions_to_load, function( the_model ) {
|
|
the_model.urlRoot = model_collection.url;
|
|
_.delay( function() {
|
|
the_model.fetch( {
|
|
update : true,
|
|
add : false,
|
|
remove : false,
|
|
success : function( model ) {
|
|
model.set( 'revision_toload', 'false' );
|
|
|
|
//stop spinner when all models are loaded
|
|
if ( 0 === model_collection.where( { revision_toload : true } ).length )
|
|
self.stop_model_loading_spinner();
|
|
|
|
self._tickmarkView.render();
|
|
|
|
var total_changes = model.get( 'lines_added' ) + model.get( 'lines_deleted');
|
|
var scope_of_changes = 'vsmall';
|
|
|
|
// Note: hard coded scope of changes
|
|
// TODO change to dynamic based on range of values
|
|
if ( total_changes > 1 && total_changes <= 3 ) {
|
|
scope_of_changes = 'small';
|
|
} else if(total_changes > 3 && total_changes <= 5 ) {
|
|
scope_of_changes = 'med';
|
|
} else if(total_changes > 5 && total_changes <= 10 ) {
|
|
scope_of_changes = 'large';
|
|
} else if(total_changes > 10 ) {
|
|
scope_of_changes = 'vlarge';
|
|
}
|
|
model.set( 'scope_of_changes', scope_of_changes );
|
|
if ( 0 !== self._right_diff &&
|
|
model.get( 'ID' ) === self._revisions.at( self._right_diff - 1 ).get( 'ID' ) ) {
|
|
//reload if current model refreshed
|
|
self._revisionView.render();
|
|
}
|
|
|
|
}
|
|
} );
|
|
}, delay ) ;
|
|
delay = delay + 150; //stagger model loads to avoid hammering server with requests
|
|
}
|
|
);
|
|
},
|
|
|
|
start_left_model_loading : function() {
|
|
this._left_model_loading = true;
|
|
$('.revisiondiffcontainer').addClass('leftmodelloading');
|
|
},
|
|
|
|
stop_left_model_loading : function() {
|
|
this._left_model_loading = false;
|
|
},
|
|
|
|
start_right_model_loading : function() {
|
|
this._right_model_loading = true;
|
|
$('.revisiondiffcontainer').addClass('rightmodelloading');
|
|
},
|
|
|
|
stop_right_model_loading : function() {
|
|
this._right_model_loading = false;
|
|
},
|
|
|
|
stop_model_loading_spinner : function() {
|
|
$('.revisiondiffcontainer').removeClass('rightmodelloading');
|
|
$('.revisiondiffcontainer').removeClass('leftmodelloading');
|
|
},
|
|
|
|
reloadmodel : function() {
|
|
if ( 2 === this._compareoneortwo ) {
|
|
this.reloadleftright();
|
|
} else {
|
|
this.reloadmodelsingle();
|
|
}
|
|
},
|
|
|
|
//load the models for the single handle mode
|
|
reloadmodelsingle : function() {
|
|
var self = this;
|
|
self._revisions.url = ajaxurl + '?action=revisions-data&compare_to=' + wpRevisionsSettings.post_id +
|
|
'&show_autosaves=' + self._autosaves +
|
|
'&show_split_view=' + self._show_split_view +
|
|
'&nonce=' + wpRevisionsSettings.nonce;
|
|
self.start_right_model_loading();
|
|
self._revisions.fetch({ //reload revision data
|
|
success : function() {
|
|
console.log('loaded');
|
|
//self.stop_right_model_loading();
|
|
//REVAPP._right_diff -= 1;
|
|
var revisioncount = self._revisions.length;
|
|
self._revisionView.model = self._revisions;
|
|
self._revisionView.render();
|
|
self.reload_toload_revisions( self._revisions );
|
|
self._tickmarkView.model = self._revisions;
|
|
self._tickmarkView.render();
|
|
$( '#slider' ).slider( 'option', 'max', revisioncount-1 ); //TODO test this, if autsave option changed
|
|
$( '#slider' ).slider( 'value', self._right_diff - 1 ).trigger( 'slide' );
|
|
|
|
},
|
|
|
|
error : function () {
|
|
self.stop_right_model_loading();
|
|
}
|
|
|
|
});
|
|
},
|
|
|
|
//load the models for the left handle
|
|
reloadleft : function() {
|
|
var self = this;
|
|
self.start_left_model_loading();
|
|
self._left_handle_revisions = new wp.revisions.Collection();
|
|
|
|
self._left_handle_revisions.url =
|
|
ajaxurl +
|
|
'?action=revisions-data&compare_to=' + self._revisions.at( self._right_diff - 1 ).get( 'ID' ) +
|
|
'&post_id=' + wpRevisionsSettings.post_id +
|
|
'&show_autosaves=' + REVAPP._autosaves +
|
|
'&show_split_view=' + REVAPP._show_split_view +
|
|
'&nonce=' + wpRevisionsSettings.nonce +
|
|
'&right_handle_at=' + ( self._right_diff );
|
|
|
|
self._left_handle_revisions.fetch({
|
|
|
|
success : function(){
|
|
self.stop_left_model_loading();
|
|
self.reload_toload_revisions( self._left_handle_revisions );
|
|
self._tickmarkView.model = self._left_handle_revisions;
|
|
$( '#slider' ).slider( 'option', 'max', self._revisions.length );
|
|
// ensure right handle not beyond length, in particular if viewing autosaves is switched from on to off
|
|
// the number of models in the collection might get shorter, this ensures right handle is not beyond last model
|
|
if ( self._right_diff > self._revisions.length )
|
|
self._right_diff = self._revisions.length;
|
|
},
|
|
|
|
error : function () {
|
|
self.stop_left_model_loading();
|
|
}
|
|
});
|
|
},
|
|
|
|
//load the models for the right handle
|
|
reloadright : function() {
|
|
var self = this;
|
|
self.start_right_model_loading();
|
|
self._right_handle_revisions = new wp.revisions.Collection();
|
|
|
|
self._right_handle_revisions.url =
|
|
ajaxurl +
|
|
'?action=revisions-data&compare_to=' + ( self._revisions.at( self._left_diff ).get( 'ID' ) -1)+
|
|
'&post_id=' + wpRevisionsSettings.post_id +
|
|
'&show_autosaves=' + REVAPP._autosaves +
|
|
'&show_split_view=' + REVAPP._show_split_view +
|
|
'&nonce=' + wpRevisionsSettings.nonce;
|
|
|
|
self._right_handle_revisions.fetch({
|
|
|
|
success : function(){
|
|
self.stop_right_model_loading();
|
|
self.reload_toload_revisions( self._right_handle_revisions );
|
|
self._tickmarkView.model = self._right_handle_revisions;
|
|
$( '#slider' ).slider( 'option', 'max', self._revisions.length );
|
|
$( '#slider' ).slider( 'values', [ REVAPP._left_diff, REVAPP._right_diff] ).trigger( 'slide' );
|
|
|
|
//REVAPP._revisionView.render();
|
|
|
|
},
|
|
|
|
error : function ( response ) {
|
|
self.stop_right_model_loading();
|
|
}
|
|
});
|
|
|
|
},
|
|
|
|
reloadleftright : function() {
|
|
this.start_right_model_loading();
|
|
this.start_left_model_loading();
|
|
this.reloadleft();
|
|
this.reloadright();
|
|
},
|
|
|
|
/*
|
|
* initialize the revision application
|
|
*/
|
|
initialize : function( options ) {
|
|
var self = this; //store the application instance
|
|
if (this._revisions === null) {
|
|
self._revisions = new wp.revisions.Collection(); //set up collection
|
|
self.start_right_model_loading();
|
|
self._revisions.fetch({ //load revision data
|
|
|
|
success : function() {
|
|
self.stop_right_model_loading();
|
|
//self._right_handle_revisions = self._revisions;
|
|
self.completeApplicationSetup();
|
|
}
|
|
});
|
|
}
|
|
return this;
|
|
},
|
|
|
|
addTooltip : function( handle, message ) {
|
|
|
|
handle.attr( 'title', '' ).tooltip({
|
|
track: false,
|
|
|
|
position: {
|
|
my: "left-30 top-66",
|
|
at: "top left",
|
|
using: function( position, feedback ) {
|
|
$( this ).css( position );
|
|
$( "<div>" )
|
|
.addClass( "arrow" )
|
|
.addClass( feedback.vertical )
|
|
.addClass( feedback.horizontal )
|
|
.appendTo( $( this ) );
|
|
}
|
|
},
|
|
show: false,
|
|
hide: false,
|
|
content: function() {
|
|
return message;
|
|
}
|
|
|
|
} );
|
|
},
|
|
/**/
|
|
|
|
completeApplicationSetup : function() {
|
|
this._revisionView = new wp.revisions.views.View({
|
|
model : this._revisions
|
|
});
|
|
this._revisionView.render();
|
|
$( '#slider' ).slider( 'option', 'max', this._revisions.length - 1 );
|
|
|
|
this.reload_toload_revisions( this._revisions );
|
|
|
|
this._revisionsInteractions = new wp.revisions.views.Interact({
|
|
model : this._revisions
|
|
});
|
|
this._revisionsInteractions.render();
|
|
|
|
this._tickmarkView = new wp.revisions.views.Tickmarks({
|
|
model : this._revisions
|
|
});
|
|
this._tickmarkView.render();
|
|
this._tickmarkView.resetticks();
|
|
|
|
|
|
/*
|
|
.on( 'mouseup', function( event ) {
|
|
REVAPP._keep_tooltip_open = false;
|
|
$( this ).find('.ui-slider-tooltip').hide();
|
|
} ).on( 'mousedown', function( event ) {
|
|
REVAPP._keep_tooltip_open = true;
|
|
} ).on( 'mouseout', function( event ) {
|
|
if ( REVAPP._keep_tooltip_open)
|
|
event.stopImmediatePropagation();
|
|
});
|
|
*/
|
|
/*
|
|
//Options hidden for now, moving to screen options
|
|
this._revisionsOptions = new wp.revisions.views.Options({
|
|
model : this._revisions
|
|
});
|
|
this._revisionsOptions.render();
|
|
*/
|
|
|
|
}
|
|
})
|
|
};
|
|
|
|
wp.revisions.Collection = Backbone.Collection.extend({
|
|
model : wp.revisions.Model,
|
|
url : ajaxurl + '?action=revisions-data&compare_to=' + wpRevisionsSettings.post_id +
|
|
'&show_autosaves=true&show_split_view=true&nonce=' + wpRevisionsSettings.nonce,
|
|
|
|
initialize : function() {
|
|
}
|
|
} );
|
|
|
|
_.extend(wp.revisions.views, {
|
|
|
|
//Ticks inside slider view
|
|
//
|
|
Tickmarks : Backbone.View.extend({
|
|
el : $('#diff-slider-ticks')[0],
|
|
tagName : 'diff-slider-ticks-view',
|
|
className : 'diff-slider-ticks-container',
|
|
template : wp.template('revision-ticks'),
|
|
model : wp.revisions.Model,
|
|
|
|
resetticks : function() {
|
|
var slider_max = $( '#slider' ).slider( 'option', 'max');
|
|
var slider_width = $( '#slider' ).width();
|
|
var adjust_max = ( 2 === REVAPP._compareoneortwo ) ? 1 : 0;
|
|
var tick_width = Math.floor( slider_width / ( slider_max - adjust_max ) );
|
|
|
|
//TODO: adjust right margins for wider ticks so they stay centered on handle stop point
|
|
|
|
//set minimum and maximum widths for tick marks
|
|
tick_width = (tick_width > 50 ) ? 50 : tick_width;
|
|
tick_width = (tick_width < 10 ) ? 10 : tick_width;
|
|
|
|
slider_width = tick_width * (slider_max - adjust_max ) +1;
|
|
|
|
$( '#slider' ).width( slider_width );
|
|
$( '.diff-slider-ticks-wrapper' ).width( slider_width );
|
|
$( '#diffslider' ).width( slider_width );
|
|
$( '#diff-slider-ticks' ).width( slider_width );
|
|
|
|
var a_tick_width = $( '.revision-tick' ).width();
|
|
|
|
if ( tick_width !== a_tick_width ) { // is the width already set correctly?
|
|
$( '.revision-tick' ).each( function( ) {
|
|
$(this).css( 'margin-right', tick_width - 1 + 'px'); //space the ticks out using right margin
|
|
});
|
|
|
|
if( 2 === REVAPP._compareoneortwo ) {
|
|
$( '.revision-tick' ).first().remove(); //TODO - remove the check
|
|
}
|
|
$( '.revision-tick' ).last().css( 'margin-right', '0' ); // last tick gets no right margin
|
|
}
|
|
|
|
},
|
|
|
|
//render the tickmark view
|
|
render : function() {
|
|
var self = this;
|
|
|
|
if ( null !== self.model ) {
|
|
var addhtml = "";
|
|
_.each ( self.model.models, function ( the_model ) {
|
|
addhtml = addhtml + self.template ( the_model.toJSON() );
|
|
});
|
|
self.$el.html( addhtml );
|
|
|
|
}
|
|
self.resetticks();
|
|
return self;
|
|
}
|
|
}),
|
|
|
|
//
|
|
//primary revision diff view
|
|
//
|
|
View : Backbone.View.extend({
|
|
el : $('#backbonerevisionsdiff')[0],
|
|
tagName : 'revisionvview',
|
|
className : 'revisionview-container',
|
|
template : wp.template('revision'),
|
|
comparetwochecked : '',
|
|
draggingleft : false,
|
|
|
|
//
|
|
//render the revisions
|
|
//
|
|
render : function() {
|
|
var addhtml = '';
|
|
//compare two revisions mode?
|
|
|
|
if ( 2 === REVAPP._compareoneortwo ) {
|
|
this.comparetwochecked = 'checked';
|
|
if ( this.draggingleft ) {
|
|
if ( this.model.at( REVAPP._left_diff ) ) {
|
|
addhtml = this.template( _.extend(
|
|
this.model.at( REVAPP._left_diff ).toJSON(),
|
|
{ comparetwochecked : this.comparetwochecked } //keep the checkmark checked
|
|
) );
|
|
}
|
|
} else { //dragging right handle
|
|
var thediff = REVAPP._right_diff;
|
|
if ( this.model.at( thediff ) ) {
|
|
addhtml = this.template( _.extend(
|
|
this.model.at( thediff ).toJSON(),
|
|
{ comparetwochecked : this.comparetwochecked } //keep the checkmark checked
|
|
) );
|
|
}
|
|
}
|
|
} else { //end compare two revisions mode, eg only one slider handle
|
|
this.comparetwochecked = '';
|
|
if ( this.model.at( REVAPP._right_diff - 1 ) ) {
|
|
addhtml = this.template( _.extend(
|
|
this.model.at( REVAPP._right_diff - 1 ).toJSON(),
|
|
{ comparetwochecked : this.comparetwochecked } //keep the checkmark unchecked
|
|
) );
|
|
}
|
|
}
|
|
this.$el.html( addhtml );
|
|
if ( this.model.length < 3 ) {
|
|
$( 'div#comparetworevisions' ).hide(); //don't allow compare two if fewer than three revisions
|
|
}
|
|
if ( this.model.length < 2 ) {
|
|
$( 'div#diffslider' ).hide(); //don't allow compare two if fewer than three revisions
|
|
$( 'div.diff-slider-ticks-wrapper' ).hide();
|
|
}
|
|
|
|
//
|
|
// add tooltips to the handles
|
|
//
|
|
if ( 2 === REVAPP._compareoneortwo ) {
|
|
REVAPP.addTooltip ( $( 'a.ui-slider-handle.left-handle' ),
|
|
( REVAPP._right_diff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._left_diff ).get( 'revision_date_author_short' ) );
|
|
REVAPP.addTooltip ( $( 'a.ui-slider-handle.right-handle' ),
|
|
( REVAPP._right_diff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._right_diff ).get( 'revision_date_author_short' ) );
|
|
} else {
|
|
REVAPP.addTooltip ( $( 'a.ui-slider-handle' ),
|
|
( REVAPP._right_diff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._right_diff ).get( 'revision_date_author_short' ) );
|
|
}
|
|
|
|
//
|
|
// hide the restore button when on the last sport/current post data
|
|
//
|
|
if ( REVAPP._right_diff === REVAPP._revisions.length ){
|
|
$( '.restore-button' ).hide();
|
|
} else {
|
|
$( '.restore-button' ).show();
|
|
}
|
|
|
|
return this;
|
|
},
|
|
|
|
//the compare two button is in this view, add the interaction here
|
|
events : {
|
|
'click #comparetwo' : 'clickcomparetwo'
|
|
},
|
|
|
|
//
|
|
//turn on/off the compare two mmode
|
|
//
|
|
clickcomparetwo : function(){
|
|
self = this;
|
|
|
|
if ( $( 'input#comparetwo' ).is( ':checked' ) ) { //compare 2 mode
|
|
REVAPP._compareoneortwo = 2 ;
|
|
|
|
if ( 1 === REVAPP._right_diff )
|
|
REVAPP._right_diff = 2;
|
|
REVAPP._revisionView.draggingleft = false;
|
|
|
|
wpRevisionsSettings.revision_id = ''; // reset passed revision id so switching back to one handle mode doesn't re-select revision
|
|
REVAPP.reloadleftright();
|
|
REVAPP._revisionView.model = REVAPP._right_handle_revisions;
|
|
|
|
} else { //compare one mode
|
|
REVAPP._compareoneortwo = 1 ;
|
|
REVAPP._revisionView.draggingleft = false;
|
|
//REVAPP._left_diff = 0;
|
|
//REVAPP._right_diff = (REVAPP._revisions.length <= REVAPP._right_diff ) ? REVAPP._right_diff + 1 : REVAPP._right_diff + 1;
|
|
REVAPP.reloadmodelsingle();
|
|
}
|
|
//REVAPP._revisionView.render();
|
|
REVAPP._revisionsInteractions.render();
|
|
REVAPP._tickmarkView.render();
|
|
|
|
}
|
|
}),
|
|
|
|
//
|
|
//options view for show autosaves and show split view options
|
|
//
|
|
/* DISABLED for now
|
|
Options : Backbone.View.extend({
|
|
el : $('#backbonerevisionsoptions')[0],
|
|
tagName : 'revisionoptionsview',
|
|
className : 'revisionoptions-container',
|
|
template : wp.template('revisionoptions'),
|
|
|
|
//render the options view
|
|
render : function() {
|
|
var addhtml = this.template;
|
|
this.$el.html( addhtml );
|
|
return this;
|
|
},
|
|
|
|
//add options interactions
|
|
events : {
|
|
'click #toggleshowautosaves' : 'toggleshowautosaves',
|
|
'click #showsplitview' : 'showsplitview'
|
|
},
|
|
|
|
//
|
|
//toggle include autosaves
|
|
//
|
|
toggleshowautosaves : function() {
|
|
var self = this;
|
|
if ( $( '#toggleshowautosaves' ).is( ':checked' ) ) {
|
|
REVAPP._autosaves = true ;
|
|
} else {
|
|
REVAPP._autosaves = false ;
|
|
}
|
|
|
|
//refresh the model data
|
|
REVAPP.reloadmodel();
|
|
},
|
|
|
|
//
|
|
//toggle showing the split diff view
|
|
//
|
|
showsplitview : function() {
|
|
var self = this;
|
|
|
|
if ( $( 'input#showsplitview' ).is( ':checked' ) ) {
|
|
REVAPP._show_split_view = 'true';
|
|
$('.revisiondiffcontainer').addClass('diffsplit');
|
|
} else {
|
|
REVAPP._show_split_view = '';
|
|
$('.revisiondiffcontainer').removeClass('diffsplit');
|
|
}
|
|
|
|
REVAPP.reloadmodel();
|
|
}
|
|
}),
|
|
*/
|
|
//
|
|
//main interactions view
|
|
//
|
|
Interact : Backbone.View.extend({
|
|
el : $('#backbonerevisionsinteract')[0],
|
|
tagName : 'revisionvinteract',
|
|
className : 'revisionvinteract-container',
|
|
template : wp.template('revisionvinteract'),
|
|
|
|
initialize : function() {
|
|
},
|
|
|
|
render : function() {
|
|
var self = this;
|
|
|
|
var addhtml = this.template;
|
|
this.$el.html( addhtml );
|
|
|
|
var modelcount = REVAPP._revisions.length;
|
|
|
|
slider = $( "#slider" );
|
|
if ( 1 === REVAPP._compareoneortwo ) {
|
|
//set up the slider with a single handle
|
|
slider.slider({
|
|
value: REVAPP._right_diff-1,
|
|
min: 0,
|
|
max: modelcount-1,
|
|
step: 1,
|
|
|
|
|
|
//slide interactions for one handles slider
|
|
slide : function( event, ui ) {
|
|
|
|
REVAPP._right_diff = ( ui.value + 1 );
|
|
REVAPP._revisionView.render();
|
|
/*
|
|
$( 'a.ui-slider-handle' ).tooltip( {
|
|
content: REVAPP._revisions.at( ui.value ).get( 'revision_date_author_short' ),
|
|
position: {
|
|
my: "top-65",
|
|
using: function( position, feedback ) {
|
|
$( this ).css( position );
|
|
$( "<div>" )
|
|
.addClass( "arrow" )
|
|
.addClass( feedback.vertical )
|
|
.addClass( feedback.horizontal )
|
|
.appendTo( this );
|
|
}
|
|
}
|
|
});//.trigger( 'close' ).trigger( 'open' );
|
|
*/
|
|
}
|
|
});
|
|
$( '.revisiondiffcontainer' ).removeClass( 'comparetwo' );
|
|
|
|
} else { //comparing more than one, eg 2
|
|
//set up the slider with two handles
|
|
slider.slider({
|
|
values : [ REVAPP._left_diff, REVAPP._right_diff + 1 ],
|
|
min : 1,
|
|
max : modelcount+1,
|
|
step : 1,
|
|
range: true,
|
|
|
|
//in two handled mode when user starts dragging, swap in precalculated diff for handle
|
|
start : function (event, ui ) {
|
|
var index = $( ui.handle ).index(); //0 (left) or 1 (right)
|
|
switch ( index ) {
|
|
case 1: //left handle drag
|
|
if ( REVAPP._left_model_loading ) //left model still loading, prevent sliding left handle
|
|
return false;
|
|
|
|
REVAPP._revisionView.draggingleft = true;
|
|
|
|
if ( REVAPP._revisionView.model !== REVAPP._left_handle_revisions &&
|
|
null !== REVAPP._left_handle_revisions ) {
|
|
REVAPP._revisionView.model = REVAPP._left_handle_revisions;
|
|
REVAPP._tickmarkView.model = REVAPP._left_handle_revisions;
|
|
REVAPP._tickmarkView.render();
|
|
}
|
|
|
|
REVAPP._left_diff_start = ui.values[ 0 ];
|
|
break;
|
|
|
|
case 2: //right
|
|
if ( REVAPP._right_model_loading || 0 === REVAPP._right_handle_revisions.length) //right model still loading, prevent sliding right handle
|
|
return false;
|
|
|
|
if ( REVAPP._revisionView.model !== REVAPP._right_handle_revisions &&
|
|
null !== REVAPP._right_handle_revisions ) {
|
|
REVAPP._revisionView.model = REVAPP._right_handle_revisions;
|
|
REVAPP._tickmarkView.model = REVAPP._right_handle_revisions;
|
|
REVAPP._tickmarkView.render();
|
|
}
|
|
|
|
REVAPP._revisionView.draggingleft = false;
|
|
REVAPP._right_diff_start = ui.values[ 1 ];
|
|
break;
|
|
}
|
|
},
|
|
|
|
//when sliding in two handled mode change appropriate value
|
|
slide : function( event, ui ) {
|
|
if ( ui.values[ 0 ] === ui.values[ 1 ] ) //prevent compare to self
|
|
return false;
|
|
|
|
var index = $( ui.handle ).index(); //0 (left) or 1 (right)
|
|
|
|
switch ( index ) {
|
|
case 1: //left
|
|
if ( REVAPP._left_model_loading ) //left model still loading, prevent sliding left handle
|
|
return false;
|
|
|
|
REVAPP._left_diff = ui.values[ 0 ];
|
|
break;
|
|
|
|
case 2: //right
|
|
if ( REVAPP._right_model_loading ) //right model still loading, prevent sliding right handle
|
|
return false;
|
|
|
|
REVAPP._right_diff = ui.values[ 1 ];
|
|
break;
|
|
}
|
|
|
|
if ( 0 === REVAPP._left_diff ) {
|
|
$( '.revisiondiffcontainer' ).addClass( 'currentversion' );
|
|
|
|
} else {
|
|
$( '.revisiondiffcontainer' ).removeClass( 'currentversion' );
|
|
}
|
|
|
|
REVAPP._revisionView.render();
|
|
|
|
},
|
|
|
|
//when the user stops sliding in 2 handle mode, recalculate diffs
|
|
stop : function( event, ui ) {
|
|
if ( 2 === REVAPP._compareoneortwo ) {
|
|
//calculate and generate a diff for comparing to the left handle
|
|
//and the right handle, swap out when dragging
|
|
|
|
var index = $( ui.handle ).index(); //0 (left) or 1 (right)
|
|
|
|
switch ( index ) {
|
|
case 1: //left
|
|
|
|
//left handle dragged & changed, reload right handle model
|
|
if ( REVAPP._left_diff_start !== ui.values[ 0 ] )
|
|
REVAPP.reloadright();
|
|
|
|
break;
|
|
|
|
case 2: //right
|
|
//REVAPP._right_diff = ( 1 >= REVAPP._right_diff ) ? 1 : REVAPP._right_diff-1;
|
|
//right handle dragged & changed, reload left handle model if changed
|
|
if ( REVAPP._right_diff_start !== ui.values[ 1 ] )
|
|
REVAPP.reloadleft();
|
|
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
$( '.revisiondiffcontainer' ).addClass( 'comparetwo' );
|
|
$( '#diffslider a.ui-slider-handle' ).first().addClass( 'left-handle' ).next().addClass( 'right-handle' );
|
|
}
|
|
|
|
return this;
|
|
},
|
|
|
|
//next and previous buttons, only available in compare one mode
|
|
events : {
|
|
'click #next' : 'nextrevision',
|
|
'click #previous' : 'previousrevision'
|
|
},
|
|
|
|
//go to the next revision
|
|
nextrevision : function() {
|
|
if ( REVAPP._right_diff < this.model.length ) //unless at right boundry
|
|
REVAPP._right_diff = REVAPP._right_diff + 1 ;
|
|
|
|
REVAPP._revisionView.render();
|
|
|
|
$( '#slider' ).slider( 'value', REVAPP._right_diff - 1 ).trigger( 'slide' );
|
|
},
|
|
|
|
//go the the previous revision
|
|
previousrevision : function() {
|
|
if ( REVAPP._right_diff > 1 ) //unless at left boundry
|
|
REVAPP._right_diff = REVAPP._right_diff - 1 ;
|
|
|
|
REVAPP._revisionView.render();
|
|
|
|
$( '#slider' ).slider( 'value', REVAPP._right_diff - 1 ).trigger( 'slide' );
|
|
}
|
|
})
|
|
});
|
|
|
|
//instantiate Revision Application
|
|
REVAPP = new wp.revisions.App();
|
|
|
|
}(jQuery));
|