" )
.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.reloadToLoadRevisions( 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 sliderMax = $( '#slider' ).slider( 'option', 'max');
var sliderWidth = $( '#slider' ).width();
var adjustMax = ( 2 === REVAPP._compareOneOrTwo ) ? 1 : 0;
var tickWidth = Math.floor( sliderWidth / ( sliderMax - adjustMax ) );
// TODO: adjust right margins for wider ticks so they stay centered on handle stop point
// set minimum and maximum widths for tick marks
tickWidth = (tickWidth > 50 ) ? 50 : tickWidth;
tickWidth = (tickWidth < 10 ) ? 10 : tickWidth;
sliderWidth = tickWidth * (sliderMax - adjustMax ) + 1;
$( '#slider' ).width( sliderWidth );
$( '.diff-slider-ticks-wrapper' ).width( sliderWidth );
$( '#diffslider' ).width( sliderWidth );
$( '#diff-slider-ticks' ).width( sliderWidth );
var aTickWidth = $( '.revision-tick' ).width();
if ( tickWidth !== aTickWidth ) { // is the width already set correctly?
$( '.revision-tick' ).each( function( ) {
$(this).css( 'margin-right', tickWidth - 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( theModel ) {
addHtml = addHtml + self.template ( theModel.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._leftDiff ) ) {
addHtml = this.template( _.extend(
this.model.at( REVAPP._leftDiff ).toJSON(),
{ comparetwochecked: this.comparetwochecked } // keep the checkmark checked
) );
}
} else { // dragging right handle
var thediff = REVAPP._rightDiff;
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._rightDiff - 1 ) ) {
addHtml = this.template( _.extend(
this.model.at( REVAPP._rightDiff - 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._rightDiff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._leftDiff ).get( 'revision_date_author_short' ) );
REVAPP.addTooltip ( $( 'a.ui-slider-handle.right-handle' ),
( REVAPP._rightDiff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._rightDiff ).get( 'revision_date_author_short' ) );
} else {
REVAPP.addTooltip ( $( 'a.ui-slider-handle' ),
( REVAPP._rightDiff >= REVAPP._revisions.length ) ? '' : REVAPP._revisions.at( REVAPP._rightDiff ).get( 'revision_date_author_short' ) );
}
// hide the restore button when on the last sport/current post data
if ( REVAPP._rightDiff === 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._rightDiff )
REVAPP._rightDiff = 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._rightHandleRevisions;
} else { // compare one mode
REVAPP._compareOneOrTwo = 1 ;
REVAPP._revisionView.draggingLeft = false;
// REVAPP._leftDiff = 0;
// REVAPP._rightDiff = (REVAPP._revisions.length <= REVAPP._rightDiff ) ? REVAPP._rightDiff + 1 : REVAPP._rightDiff + 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._showSplitView = 'true';
$('.revisiondiffcontainer').addClass('diffsplit');
} else {
REVAPP._showSplitView = '';
$('.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._rightDiff - 1,
min: 0,
max: modelcount - 1,
step: 1,
// slide interactions for one handles slider
slide: function( event, ui ) {
REVAPP._rightDiff = ( 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 );
$( "
" )
.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._leftDiff, REVAPP._rightDiff + 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._leftModelLoading ) // left model still loading, prevent sliding left handle
return false;
REVAPP._revisionView.draggingLeft = true;
if ( REVAPP._revisionView.model !== REVAPP._leftHandleRevisions &&
null !== REVAPP._leftHandleRevisions ) {
REVAPP._revisionView.model = REVAPP._leftHandleRevisions;
REVAPP._tickmarkView.model = REVAPP._leftHandleRevisions;
REVAPP._tickmarkView.render();
}
REVAPP._leftDiffStart = ui.values[ 0 ];
break;
case 2: // right
if ( REVAPP._rightModelLoading || 0 === REVAPP._rightHandleRevisions.length) // right model still loading, prevent sliding right handle
return false;
if ( REVAPP._revisionView.model !== REVAPP._rightHandleRevisions &&
null !== REVAPP._rightHandleRevisions ) {
REVAPP._revisionView.model = REVAPP._rightHandleRevisions;
REVAPP._tickmarkView.model = REVAPP._rightHandleRevisions;
REVAPP._tickmarkView.render();
}
REVAPP._revisionView.draggingLeft = false;
REVAPP._rightDiffStart = 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._leftModelLoading ) // left model still loading, prevent sliding left handle
return false;
REVAPP._leftDiff = ui.values[0];
break;
case 2: // right
if ( REVAPP._rightModelLoading ) // right model still loading, prevent sliding right handle
return false;
REVAPP._rightDiff = ui.values[1];
break;
}
if ( 0 === REVAPP._leftDiff ) {
$( '.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._leftDiffStart !== ui.values[0] )
REVAPP.reloadRight();
break;
case 2: // right
// REVAPP._rightDiff = ( 1 >= REVAPP._rightDiff ) ? 1 : REVAPP._rightDiff - 1;
// right handle dragged & changed, reload left handle model if changed
if ( REVAPP._rightDiffStart !== 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._rightDiff < this.model.length ) // unless at right boundry
REVAPP._rightDiff = REVAPP._rightDiff + 1 ;
REVAPP._revisionView.render();
$( '#slider' ).slider( 'value', REVAPP._rightDiff - 1 ).trigger( 'slide' );
},
// go the the previous revision
previousRevision: function() {
if ( REVAPP._rightDiff > 1 ) // unless at left boundry
REVAPP._rightDiff = REVAPP._rightDiff - 1 ;
REVAPP._revisionView.render();
$( '#slider' ).slider( 'value', REVAPP._rightDiff - 1 ).trigger( 'slide' );
}
})
});
// instantiate Revision Application
REVAPP = new wp.revisions.App();
}(jQuery));