Ticket #24346: 24346.2.diff

wp-admin/includes/ajax-actions.php

@@ -2208 +2208 @@
                         if ( ( ( 0 != $left_handle_at && $count < $left_handle_at ) ||
                                  ( 0 != $right_handle_at && $count > ( $right_handle_at - 2 ) ) ) ) {
                                 $all_the_revisions[] = array (
-                                        'ID' => $revision->ID,
+                                        'ID'        => $revision->ID,
+                                        'completed' => true, //mark as completed, no need to load diff
                                 );
                                 continue;
                         }
@@ -2216 +2217 @@
                         if ( ( 0 != $left_handle_at && $count > ( $left_handle_at - 1 ) ||
                                  ( 0 != $left_handle_at && $count < $right_handle_at ) ) ) {
                                 $all_the_revisions[] = array (
-                                        'ID' => $revision->ID,
+                                        'ID'        => $revision->ID,
+                                        'completed' => true, //mark as completed, no need to load diff
                                 );
                                 continue;
                         }

wp-admin/js/revisions.js

@@ -56 +56 @@
                         }
                 },
 
-                loadDiffs: function( models ) {
+                loadDiffs: function( models, otherModels ) {
                         var self = this,
                                 revisionsToLoad = models.where( { completed: false } ),
                                 delay = 0,
-                                totalChanges;
+                                totalChanges,
+                                foundModel;
 
+                        // in two handle mode, pass the other handle's models and copy over scopeOfChanges (tick width) from that model for positions this handle can't reach (but the other handle can reach)
+                        if ( 'undefined' !== typeof otherModels ) { // otherModels only passed in two handle mode
+                                _.each( models.where( { completed: true } ), // select just the models that are marked as not needing loading, eg. positions this handle can't reach
+                                        function( theModel ) {
+                                                foundModel = otherModels.findWhere( { ID: theModel.id } ); //find the matching position from the other handle's models
+                                                if ( 'undefined' !== typeof foundModel ) {
+                                                        theModel.set( 'scopeOfChanges', // set the displayed scope of changes for ticks this handle can't get to
+                                                                foundModel
+                                                                .get( 'scopeOfChanges' ) ); // copy the scope of changes from the other handle which can reach this spot
+                                                }
+                                        }
+                                );
+                        }
+
                         // match slider to passed revision_id
                         _.each( revisionsToLoad, function( revision ) {
                                 if ( revision.get( 'ID' ) == revisions.model.settings.revision_id )
@@ -69 +84 @@
                         });
 
                         _.each( revisionsToLoad, function( revision ) {
-                                        _.delay( function() {
-                                                revision.fetch( {
-                                                        update: true,
-                                                        add: false,
-                                                        remove: false,
-                                                        success: function( model ) {
-                                                                model.set( 'completed', true );
+                                revision.fetch( {
+                                        update: true,
+                                        add: false,
+                                        remove: false,
+                                        success: function( model ) {
+                                                model.set( 'completed', true );
 
-                                                                // stop spinner when all models are loaded
-                                                                if ( 0 === models.where( { completed: false } ).length )
-                                                                        self.stopModelLoadingSpinner();
+                                                // stop spinner when all models are loaded
+                                                if ( 0 === models.where( { completed: false } ).length )
+                                                        self.stopModelLoadingSpinner();
 
-                                                                totalChanges = model.get( 'linesAdded' ) + model.get( 'linesDeleted' ),
-                                                                        scopeOfChanges = 'vsmall';
+                                                totalChanges = model.get( 'linesAdded' ) + model.get( 'linesDeleted' ),
+                                                        scopeOfChanges = 'vsmall';
 
-                                                                // Note: hard coded scope of changes
-                                                                // TODO change to dynamic based on range of values
-                                                                if ( totalChanges > 1 && totalChanges <= 3 ) {
-                                                                        scopeOfChanges = 'small';
-                                                                } else if ( totalChanges > 3 && totalChanges <= 5 ) {
-                                                                        scopeOfChanges = 'med';
-                                                                } else if ( totalChanges > 5 && totalChanges <= 10 ) {
-                                                                        scopeOfChanges = 'large';
-                                                                } else if ( totalChanges > 10 ) {
-                                                                        scopeOfChanges = 'vlarge';
-                                                                }
-                                                                model.set( 'scopeOfChanges', scopeOfChanges );
-                                                                if ( 0 !== self.rightDiff &&
-                                                                        model.get( 'ID' ) === self.revisions.at( self.rightDiff - 1 ).get( 'ID' ) ) {
-                                                                        // reload if current model refreshed
-                                                                        self.revisionView.render();
-                                                                }
-                                                                self.tickmarkView.render();
-                                                        }
-                                        } );
-                                        }, delay ) ;
-                                        delay = delay + 150; // stagger model loads to avoid hammering server with requests
-                                }
-                        );
+                                                // Note: hard coded scope of changes
+                                                // TODO change to dynamic based on range of values
+                                                if ( totalChanges > 1 && totalChanges <= 3 ) {
+                                                        scopeOfChanges = 'small';
+                                                } else if ( totalChanges > 3 && totalChanges <= 5 ) {
+                                                        scopeOfChanges = 'med';
+                                                } else if ( totalChanges > 5 && totalChanges <= 10 ) {
+                                                        scopeOfChanges = 'large';
+                                                } else if ( totalChanges > 10 ) {
+                                                        scopeOfChanges = 'vlarge';
+                                                }
+                                                model.set( 'scopeOfChanges', scopeOfChanges );
+                                                if ( 0 !== self.rightDiff &&
+                                                        model.get( 'ID' ) === self.revisions.at( self.rightDiff - 1 ).get( 'ID' ) ) {
+                                                        // reload if current model refreshed
+                                                        self.revisionView.render();
+                                                }
+                                                self.tickmarkView.render();
+                                        }
+                                } );
+                        } );
                 },
 
                 startLeftModelLoading: function() {
@@ -186 +197 @@
                         self.leftHandleRevisions.fetch({
                                 success: function(){
                                         self.stopLeftModelLoading();
-                                        self.loadDiffs( self.leftHandleRevisions );
+                                        self.loadDiffs( self.leftHandleRevisions, self.rightHandleRevisions );
                                         self.tickmarkView.model = self.leftHandleRevisions;
                                         self.slider.refresh({
                                                 'max': self.revisions.length
@@ -216 +227 @@
                         self.rightHandleRevisions.fetch({
                                 success: function(){
                                         self.stopRightModelLoading();
-                                        self.loadDiffs( self.rightHandleRevisions );
+                                        self.loadDiffs( self.rightHandleRevisions, self.leftHandleRevisions );
                                         self.tickmarkView.model = self.rightHandleRevisions;
                                         self.slider.refresh({
                                                 'max': self.revisions.length
@@ -395 +406 @@
                         // and the right handle, swap out when dragging
                         if ( $( ui.handle ).hasClass( 'left-handle' ) ) {
                                 // Left handler
-                                if ( Diff.leftDiffStart !== isRtl ? ui.values[1] : ui.values[0] ) // in RTL mode the 'left handle' is the second in the slider, 'right' is first
+                                if ( Diff.leftDiffStart !== ( isRtl ? ui.values[1] : ui.values[0] ) ) // in RTL mode the 'left handle' is the second in the slider, 'right' is first
                                         Diff.reloadRight();
                         } else {
                                 // Right handler
-                                if ( Diff.rightDiffStart !== isRtl ? ui.values[0] : ui.values[1] ) // in RTL mode the 'left handle' is the second in the slider, 'right' is first
+                                if ( Diff.rightDiffStart !== ( isRtl ? ui.values[0] : ui.values[1] ) ) // in RTL mode the 'left handle' is the second in the slider, 'right' is first
                                         Diff.reloadLeft();
                         }
                 },