WordPress.org

Make WordPress Core

Ticket #24388: 24388.4.diff

File 24388.4.diff, 7.3 KB (added by adamsilverstein, 11 months ago)
  • wp-admin/js/revisions.js

     
    3838                rightModelLoading: false,       // disallow slider interaction, also repeat loads, while loading 
    3939                tickmarkView: null, // the slider tickmarks 
    4040                slider: null, // the slider instance 
     41                maxConcurrentRequests: 3, 
     42                currentRequests: 1, 
    4143 
    4244                constructor: function() { 
    4345                        var self    = this; 
     
    5658                        } 
    5759                }, 
    5860 
    59                 loadDiffs: function( models ) { 
     61                /* 
     62                 * Time to load all the models, each model represents a comparison 
     63                 */ 
     64                loadDiffs: function( models, otherModels ) { 
     65                        // in two handle mode, pass the other handle's models and copy over scopeOfChanges (tick width) 
     66                        // from that model for positions this handle can't reach (but the other handle can reach) 
     67                        // (only do this once) 
     68                        if ( 'undefined' !== typeof otherModels ) { // otherModels only passed in two handle mode 
     69                                _.each( models.where( { loadedStatus: 'true' } ), // select just the models that are marked as not needing loading, eg. positions this handle can't reach 
     70                                        function( theModel ) { 
     71                                                foundModel = otherModels.findWhere( { ID: theModel.id } ); //find the matching position from the other handle's models 
     72                                                if ( 'undefined' !== typeof foundModel ) { 
     73                                                        theModel.set( 'scopeOfChanges', // set the displayed scope of changes for ticks this handle can't get to 
     74                                                                foundModel 
     75                                                                .get( 'scopeOfChanges' ) ); // copy the scope of changes from the other handle which can reach this spot 
     76                                                } 
     77                                        } 
     78                                ); 
     79                        } 
     80                        this.loadDiffsRecursive( models, otherModels ); // recursively load models that need loading 
     81                }, 
     82 
     83                /* 
     84                 * load models that aren't loaded yet 
     85                 */ 
     86                loadDiffsRecursive: function( models, otherModels ) { 
    6087                        var self = this, 
    61                                 revisionsToLoad = models.where( { completed: false } ), 
    62                                 delay = 0, 
    63                                 totalChanges; 
    64  
    65                         // match slider to passed revision_id 
    66                         _.each( revisionsToLoad, function( revision ) { 
    67                                 if ( revision.get( 'ID' ) == revisions.model.settings.revision_id ) 
     88                                revision = models.findWhere( { loadedStatus: 'false' } ), // find the first model needing loading 
     89                                totalChanges, 
     90                                foundModel; 
     91                        if ( 'undefined' === typeof revision ) { // nothing to load this time 
     92                                self.tickmarkView.render(); 
     93                        } else { 
     94                                if ( revision.get( 'ID' ) == revisions.model.settings.revision_id ) { // match slider to passed revision_id 
    6895                                        self.rightDiff = self.revisions.indexOf( revision ) + 1; 
    69                         }); 
     96                                        self.revisionsInteractions.render(); 
     97                                        self.tickmarkView.render(); 
     98                                } 
     99                                revision.set( 'loadedStatus', 'loading' ); 
     100                                revision.fetch( { 
     101                                        update: true, 
     102                                        add: false, 
     103                                        remove: false, 
     104                                        success: function( model ) { 
    70105 
    71                         _.each( revisionsToLoad, function( revision ) { 
    72                                         _.delay( function() { 
    73                                                 revision.fetch( { 
    74                                                         update: true, 
    75                                                         add: false, 
    76                                                         remove: false, 
    77                                                         success: function( model ) { 
    78                                                                 model.set( 'completed', true ); 
     106                                                // stop spinner when all models are loaded 
     107                                                if ( 0 === models.where( { loadedStatus: 'false' } ).length ) 
     108                                                        self.stopModelLoadingSpinner(); 
    79109 
    80                                                                 // stop spinner when all models are loaded 
    81                                                                 if ( 0 === models.where( { completed: false } ).length ) 
    82                                                                         self.stopModelLoadingSpinner(); 
     110                                                totalChanges = model.get( 'linesAdded' ) + model.get( 'linesDeleted' ), 
     111                                                        scopeOfChanges = 'vsmall'; 
    83112 
    84                                                                 totalChanges = model.get( 'linesAdded' ) + model.get( 'linesDeleted' ), 
    85                                                                         scopeOfChanges = 'vsmall'; 
     113                                                // Note: hard coded scope of changes 
     114                                                // TODO change to dynamic based on range of values 
     115                                                if ( totalChanges > 1 && totalChanges <= 3 ) { 
     116                                                        scopeOfChanges = 'small'; 
     117                                                } else if ( totalChanges > 3 && totalChanges <= 5 ) { 
     118                                                        scopeOfChanges = 'med'; 
     119                                                } else if ( totalChanges > 5 && totalChanges <= 10 ) { 
     120                                                        scopeOfChanges = 'large'; 
     121                                                } else if ( totalChanges > 10 ) { 
     122                                                        scopeOfChanges = 'vlarge'; 
     123                                                } 
     124                                                model.set( 'scopeOfChanges', scopeOfChanges ); 
     125                                                if ( 0 !== self.rightDiff && 
     126                                                        model.get( 'ID' ) === self.revisions.at( self.rightDiff - 1 ).get( 'ID' ) ) { 
    86127 
    87                                                                 // Note: hard coded scope of changes 
    88                                                                 // TODO change to dynamic based on range of values 
    89                                                                 if ( totalChanges > 1 && totalChanges <= 3 ) { 
    90                                                                         scopeOfChanges = 'small'; 
    91                                                                 } else if ( totalChanges > 3 && totalChanges <= 5 ) { 
    92                                                                         scopeOfChanges = 'med'; 
    93                                                                 } else if ( totalChanges > 5 && totalChanges <= 10 ) { 
    94                                                                         scopeOfChanges = 'large'; 
    95                                                                 } else if ( totalChanges > 10 ) { 
    96                                                                         scopeOfChanges = 'vlarge'; 
    97                                                                 } 
    98                                                                 model.set( 'scopeOfChanges', scopeOfChanges ); 
    99                                                                 if ( 0 !== self.rightDiff && 
    100                                                                         model.get( 'ID' ) === self.revisions.at( self.rightDiff - 1 ).get( 'ID' ) ) { 
    101                                                                         // reload if current model refreshed 
    102                                                                         self.revisionView.render(); 
    103                                                                 } 
    104                                                                 self.tickmarkView.render(); 
    105                                                         } 
    106                                         } ); 
    107                                         }, delay ) ; 
    108                                         delay = delay + 150; // stagger model loads to avoid hammering server with requests 
     128                                                                // reload if current model refreshed 
     129                                                        self.revisionView.render(); 
     130                                                } 
     131                                                model.set( 'loadedStatus', 'true' ); 
     132                                                self.loadDiffsRecursive( models, otherModels ); 
     133                                        } 
    109134                                } 
    110135                        ); 
     136                } 
     137                        if ( self.currentRequests++ < self.maxConcurrentRequests ) { // limit concurrent requests 
     138                                self.loadDiffsRecursive( models, otherModels ); // load another model without waiting 
     139                        } 
    111140                }, 
    112141 
    113142                startLeftModelLoading: function() { 
     
    218247                                        self.stopRightModelLoading(); 
    219248                                        self.loadDiffs( self.rightHandleRevisions ); 
    220249                                        self.tickmarkView.model = self.rightHandleRevisions; 
     250                                        self.tickmarkView.render(); 
    221251                                        self.slider.refresh({ 
    222252                                                'max': self.revisions.length 
    223253                                        }, true); 
     
    472502                                        $( this ).css( 'border-right', ( tickWidth - tickMargin - $( this ).width() ) + 'px solid #f7f7f7'); // space the ticks out using margins 
    473503                                }); 
    474504                                firstTick = $( '.revision-tick' ).first(); //cache selectors for optimization 
    475                                 lastTick = $( '.revision-tick' ).last(); 
     505                                lastTick  = $( '.revision-tick' ).last(); 
    476506 
    477507                                sliderWidth = sliderWidth + Math.ceil( ( tickWidth - ( lastTick.outerWidth() - lastTick.innerWidth() ) ) / 2 ); // room for the last tick 
    478508                                sliderWidth = sliderWidth + Math.ceil( ( tickWidth - ( firstTick.outerWidth() - firstTick.innerWidth() ) ) / 2 ); // room for the first tick 
     
    750780                        titleFrom: '', 
    751781                        diff: '<div class="diff-loading"><div class="spinner"></div></div>', 
    752782                        restoreLink: '', 
    753                         completed: false, 
     783                        loadedStatus: 'false', 
    754784                        linesAdded: 0, 
    755785                        linesDeleted: 0, 
    756786                        scopeOfChanges: 'none', 
  • wp-admin/revision.php

     
    175175</script> 
    176176 
    177177<script id="tmpl-revision-ticks" type="text/html"> 
    178         <div class="revision-tick completed-{{{ data.completed }}} scope-of-changes-{{{ data.scopeOfChanges }}}"> 
     178        <div class="revision-tick completed-{{{ data.loadedStatus }}} scope-of-changes-{{{ data.scopeOfChanges }}}"> 
    179179                <span class="ui-slider-tooltip ui-widget-content ui-corner-all hidden"></span> 
    180180        </div> 
    181181</script>