WordPress.org

Make WordPress Core

Ticket #23897: 23897.4.diff

File 23897.4.diff, 12.7 KB (added by adamsilverstein, 12 months ago)

completes RTL revisions functionality, add inline docs

  • wp-admin/includes/ajax-actions.php

     
    21002100        $single_revision_id = ! empty( $_GET['single_revision_id'] ) ? absint( $_GET['single_revision_id'] ) : 0; 
    21012101        $compare_two_mode = (bool) $post_id; 
    21022102 
    2103         // 
    2104         //TODO: currently code returns all possible comparisons for the indicated 'compare_to' revision 
    2105         //however, the front end prevents users from pulling the right handle past the left or the left pass the right, 
    2106         //so only the possible diffs need be generated 
    2107         // 
    21082103        $all_the_revisions = array(); 
    21092104        if ( ! $post_id ) 
    21102105                $post_id = $compare_to; 
     
    21742169 
    21752170        $count = -1; 
    21762171 
    2177         //reverse the list to start with oldes revision 
     2172        //reverse the list to start with oldest revision 
    21782173        $revisions = array_reverse( $revisions ); 
    21792174 
    21802175        $previous_revision_id = 0; 
     
    21912186                $count++; 
    21922187                // return blank data for diffs to the left of the left handle (for right handel model) 
    21932188                // or to the right of the right handle (for left handel model) 
    2194                 if ( ( 0 != $left_handle_at && $count < $left_handle_at ) || 
    2195                          ( 0 != $right_handle_at && $count > ( $right_handle_at - 2 ) ) ) { 
     2189                /* 
     2190                 
     2191                  if ( ! is_rtl() && ( ( 0 != $left_handle_at && $count < $left_handle_at ) || 
     2192                         ( 0 != $right_handle_at && $count > ( $right_handle_at - 2 ) ) ) ) { 
    21962193                        $all_the_revisions[] = array ( 
    21972194                                'ID' => $revision->ID, 
    21982195                        ); 
    21992196                        continue; 
    22002197                } 
    2201  
     2198*/ 
    22022199                if ( $compare_two_mode ) { 
    22032200                        $compare_to_gravatar = get_avatar( $left_revision->post_author, 24 ); 
    22042201                        $compare_to_author = get_the_author_meta( 'display_name', $left_revision->post_author ); 
     
    22862283 
    22872284        endforeach; 
    22882285 
     2286        if ( is_rtl() && $compare_two_mode ) { 
     2287                $all_the_revisions = array_reverse( $all_the_revisions ); 
     2288        } 
     2289 
    22892290        echo json_encode( $all_the_revisions ); 
    22902291        exit(); 
    22912292} 
  • wp-admin/js/revisions.js

     
    165165                                        self.tickmarkView.model = self.revisions; 
    166166                                        self.tickmarkView.render(); 
    167167                                        self.slider.refresh({ 
    168                                                 'max': revisionCount - 1, 
    169                                                 'value': self.rightDiff - 1 
     168                                                'max': revisionCount - 1, // slider starts at 0 in single handle mode 
     169                                                'value': self.rightDiff - 1 // slider starts at 0 in single handle mode 
    170170                                        }, true); 
    171171                                }, 
    172172 
     
    176176                        }); 
    177177                }, 
    178178 
    179                 // load the models for the left handle 
     179                // load the models for the left handle (the right handler has moved) 
    180180                reloadLeft: function() { 
    181181                        var self = this; 
    182182                        self.startLeftModelLoading(); 
    183183                        self.leftHandleRevisions = new Revisions( {}, { 
    184                                 'compareTo': self.revisions.at( self.rightDiff - 1 ).get( 'ID' ), 
     184                                'compareTo': self.revisions.at( self.rightDiff - 1 ).get( 'ID' ), // diff and model count off by 1 
    185185                                'showAutosaves': self.autosaves, 
    186186                                'showSplitView': self.showSplitView, 
    187187                                'rightHandleAt': self.rightDiff 
     
    207207                        }); 
    208208                }, 
    209209 
    210                 // load the models for the right handle 
     210                // load the models for the right handle (the left handle has moved) 
    211211                reloadRight: function() { 
    212212                        var self = this; 
    213213                        self.startRightModelLoading(); 
    214214                        self.rightHandleRevisions = new Revisions( {}, { 
    215                                 'compareTo': self.revisions.at( self.leftDiff - 1 ).get( 'ID' ), 
     215                                'compareTo': self.revisions.at( self.leftDiff - 1 ).get( 'ID' ), // diff and model count off by 1 
    216216                                'showAutosaves': self.autosaves, 
    217217                                'showSplitView': self.showSplitView, 
    218218                                'leftHandleAt': self.leftDiff 
     
    224224                                        self.loadDiffs( self.rightHandleRevisions ); 
    225225                                        self.tickmarkView.model = self.rightHandleRevisions; 
    226226                                        self.slider.refresh({ 
    227                                                 'max': self.revisions.length, 
    228                                                 'values': [ self.leftDiff, self.rightDiff] 
     227                                                'max': self.revisions.length 
    229228                                        }, true); 
    230229                                }, 
    231230 
     
    236235 
    237236                }, 
    238237 
     238                /** 
     239                 * reloadLeftRight reload models for both the left and right handles 
     240                 */ 
    239241                reloadLeftRight: function() { 
    240242                        this.startRightModelLoading(); 
    241243                        this.startLeftModelLoading(); 
     
    261263                                prev.prop( 'disabled', false ); 
    262264                }, 
    263265 
     266                /** 
     267                 * completeApplicationSetup finishes loading all views once the initial model load is complete 
     268                 */ 
    264269                completeApplicationSetup: function() { 
    265270                        this.revisionView = new revisions.view.Diff({ 
    266271                                model: this.revisions 
    267272                        }); 
    268                         this.revisionView.render(); 
     273                        this.revisionView.render(); // render the revision view 
    269274 
    270                         this.loadDiffs( this.revisions ); 
     275                        this.loadDiffs( this.revisions ); // get the actual revisions data 
    271276 
    272277                        this.revisionsInteractions = new revisions.view.Interact({ 
    273278                                model: this.revisions 
    274279                        }); 
    275                         this.revisionsInteractions.render(); 
     280                        this.revisionsInteractions.render(); //render the interaction view 
    276281 
    277282                        this.tickmarkView = new revisions.view.Tickmarks({ 
    278283                                model: this.revisions 
    279284                        }); 
    280                         this.tickmarkView.render(); 
     285                        this.tickmarkView.render(); //render the tickmark view  
    281286                        this.tickmarkView.resetTicks(); 
    282287                } 
    283288        }); 
     
    307312                        }); 
    308313                }, 
    309314 
     315                /** 
     316                 * respond to slider slide events 
     317                 * Note: in one handle mode, jQuery UI reports leftmost position as 0 
     318                 * in two handle mode, jQuery UI Slider reports leftmost position as 1 
     319                 */ 
    310320                slide: function( event, ui ) { 
    311321                        if ( this.singleRevision ) { 
    312322                                Diff.rightDiff = ( ui.value + 1 ); 
     
    321331                                        if ( Diff.leftModelLoading ) // left model still loading, prevent sliding left handle 
    322332                                                return false; 
    323333 
    324                                         Diff.leftDiff = ui.values[0]; 
     334                                        Diff.leftDiff = isRtl ? ui.values[1] : ui.values[0]; 
    325335                                } else { 
    326336                                        // Right handler 
    327337                                        if ( Diff.rightModelLoading ) // right model still loading, prevent sliding right handle 
    328338                                                return false; 
    329339 
    330                                         Diff.rightDiff = ui.values[1]; 
     340                                        Diff.rightDiff = isRtl ? ui.values[0] : ui.values[1]; 
    331341                                } 
    332342 
    333343                                if ( 0 === Diff.leftDiff ) { 
     
    340350                        } 
    341351                }, 
    342352 
     353                /** 
     354                 * responds to slider start sliding events 
     355                 * in two handle mode stores start position, so if unchanged at stop event no need to reload diffs 
     356                 * also swaps in the appropriate models - left handled or right handled 
     357                 */ 
    343358                start: function( event, ui ) { 
    344359                        // Not needed in one mode 
    345360                        if ( this.singleRevision ) 
     
    354369 
    355370                                if ( Diff.revisionView.model !== Diff.leftHandleRevisions && 
    356371                                                null !== Diff.leftHandleRevisions ) { 
    357                                         Diff.revisionView.model = Diff.leftHandleRevisions; 
     372                                        Diff.revisionView.model = Diff.leftHandleRevisions; //use the left handle models 
    358373                                        Diff.tickmarkView.model = Diff.leftHandleRevisions; 
    359374                                        Diff.tickmarkView.render(); 
    360375                                } 
    361376 
    362                                 Diff.leftDiffStart = ui.values[ 0 ]; 
     377                                Diff.leftDiffStart = isRtl ? ui.values[1] : ui.values[0]; // in RTL mode the 'left handle' is the second in the slider, 'right' is first 
    363378 
    364379                        } else { 
    365380                                // Right handler 
     
    368383 
    369384                                if ( Diff.revisionView.model !== Diff.rightHandleRevisions && 
    370385                                                null !== Diff.rightHandleRevisions ) { 
    371                                         Diff.revisionView.model = Diff.rightHandleRevisions; 
     386                                        Diff.revisionView.model = Diff.rightHandleRevisions; //use the right handle models 
    372387                                        Diff.tickmarkView.model = Diff.rightHandleRevisions; 
    373388                                        Diff.tickmarkView.render(); 
    374389                                } 
    375390 
    376391                                Diff.revisionView.draggingLeft = false; 
    377                                 Diff.rightDiffStart = ui.values[1]; 
     392                                Diff.rightDiffStart = isRtl ? ui.values[0] : ui.values[1]; // in RTL mode the 'left handle' is the second in the slider, 'right' is first 
    378393                        } 
    379394                }, 
    380395 
     396                /** 
     397                 * responds to slider stop events 
     398                 * in two handled mode, if the handle that stopped has moved, reload the diffs for the other handle 
     399                 * the other handle compares to this handle's position, so if it changes they need to be recalculated 
     400                 */ 
    381401                stop: function( event, ui ) { 
    382402                        // Not needed in one mode 
    383403                        if ( this.singleRevision ) 
     
    386406                        // calculate and generate a diff for comparing to the left handle 
    387407                        // and the right handle, swap out when dragging 
    388408                        if ( $( ui.handle ).hasClass( 'left-handle' ) ) { 
    389                                 // Left hadnler 
    390                                 if ( Diff.leftDiffStart !== ui.values[0] ) 
     409                                // Left handler 
     410                                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 
    391411                                        Diff.reloadRight(); 
    392412                        } else { 
    393413                                // Right handler 
    394                                 if ( Diff.rightDiffStart !== ui.values[1] ) 
     414                                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 
    395415                                        Diff.reloadLeft(); 
    396416                        } 
    397417                }, 
     
    449469                        $( '#diff-slider' ).slider( { 
    450470                                slide: $.proxy( self.slide, self ), 
    451471                                start: $.proxy( self.start, self ), 
    452                                 stop: $.proxy( self.stop, self ) 
     472                                stop:  $.proxy( self.stop, self ) 
    453473                        } ); 
    454474 
    455475                        // Set options 
     
    540560 
    541561                        if ( Diff.singleRevision ) { 
    542562                                Diff.slider.refresh({ 
    543                                         value: Diff.rightDiff - 1, 
     563                                        value: Diff.rightDiff - 1, //rightDiff value is off model index by 1 
    544564                                        min: 0, 
    545565                                        max: modelcount - 1 
    546566                                }); 
     
    549569 
    550570                        } else { 
    551571                                Diff.slider.refresh({ 
    552                                         values: [ Diff.leftDiff, Diff.rightDiff + 1 ], 
     572                                        // in RTL mode the 'left handle' is the second in the slider, 'right' is first 
     573                                        values: [ isRtl ? Diff.rightDiff : Diff.leftDiff, isRtl ? Diff.leftDiff : Diff.rightDiff ], 
    553574                                        min: 1, 
    554575                                        max: modelcount + 1, 
    555576                                        range: true 
    556577                                }); 
    557578 
    558579                                $( '#revision-diff-container' ).addClass( 'comparing-two-revisions' ); 
    559                                 $( '#diff-slider a.ui-slider-handle' ).first().addClass( 'left-handle' ); 
    560                                 $( '#diff-slider a.ui-slider-handle' ).last().addClass( 'right-handle' ); 
     580                                // in RTL mode the 'left handle' is the second in the slider, 'right' is first 
     581                                $( '#diff-slider a.ui-slider-handle' ).first().addClass( isRtl ? 'right-handle' : 'left-handle' ); 
     582                                $( '#diff-slider a.ui-slider-handle' ).last().addClass( isRtl ? 'left-handle' : 'right-handle' ); 
    561583 
    562584                        } 
    563585 
     
    613635                        // compare two revisions mode? 
    614636                        if ( ! Diff.singleRevision ) { 
    615637                                if ( this.draggingLeft ) { 
    616                                         thediff = Diff.leftDiff - 1; 
     638                                        thediff = Diff.leftDiff - 1; //leftDiff value is off model index by 1 
    617639                                        if ( this.model.at( thediff ) ) { 
    618640                                                addHtml = this.template( this.model.at( thediff ).toJSON() ); 
    619641                                        } 
    620642                                } else { // dragging right handle 
    621                                         thediff = Diff.rightDiff -1; 
     643                                        thediff = Diff.rightDiff - 1; //rightDiff value is off model index by 1 
    622644                                        if ( this.model.at( thediff ) ) { 
    623645                                                addHtml = this.template( this.model.at( thediff ).toJSON() ); 
    624646                                        } 
    625647                                } 
    626648                        } else { // end compare two revisions mode, eg only one slider handle 
    627                                 if ( this.model.at( Diff.rightDiff - 1 ) ) { 
     649                                if ( this.model.at( Diff.rightDiff - 1 ) ) { //rightDiff value is off model index by 1 
    628650                                        addHtml = this.template( this.model.at( Diff.rightDiff - 1 ).toJSON() ); 
    629651                                } 
    630652                        } 
     
    667689                        if ( $( '#compare-two-revisions' ).is( ':checked' ) ) { // compare 2 mode 
    668690                                Diff.singleRevision = false ; 
    669691 
    670                                 if ( 1 === Diff.rightDiff ) 
    671                                         Diff.rightDiff = 2; 
     692                                // in RTL mode handles are swapped, so boundary checks are different; 
     693                                if ( isRtl ){ 
     694                                        Diff.leftDiff = Diff.revisions.length; //put the left handle at the rightmost position, representing current revision 
    672695 
     696                                        if ( Diff.revisions.length === Diff.rightDiff ) //make sure 'left' handle not in rightmost slot 
     697                                                Diff.rightDiff = Diff.rightDiff - 1; 
     698                                } else { 
     699                                        if ( 1 === Diff.rightDiff ) //make sure right handle not in leftmost slot 
     700                                                Diff.rightDiff = 2; 
     701                                } 
     702 
    673703                                Diff.revisionView.draggingLeft = false; 
    674704 
    675705                                revisions.model.settings.revision_id = ''; // reset passed revision id so switching back to one handle mode doesn't re-select revision 
    676                                 Diff.reloadLeftRight(); 
     706                                Diff.reloadLeftRight(); // load diffs for left and right handles 
    677707                                Diff.revisionView.model = Diff.rightHandleRevisions; 
    678708 
    679709                        } else { // compare one mode 
     
    756786                url: function() { 
    757787                        return ajaxurl + 
    758788                                '?action=revisions-data' + 
    759                                 '&compare_to=' + this.options.compareTo + 
    760                                 '&post_id=' + this.options.post_id + 
    761                                 '&show_autosaves=' + this.options.showAutosaves + 
    762                                 '&show_split_view=' + this.options.showSplitView + 
    763                                 '&right_handle_at=' + this.options.rightHandleAt + 
    764                                 '&left_handle_at=' + this.options.leftHandleAt + 
     789                                '&compare_to=' + this.options.compareTo + // revision are we comparing to 
     790                                '&post_id=' + this.options.post_id + // the post id 
     791                                '&show_autosaves=' + this.options.showAutosaves + // show or hide autosaves 
     792                                '&show_split_view=' + this.options.showSplitView + // show in split view or single column view 
     793                                '&right_handle_at=' + this.options.rightHandleAt + // mark point for comparison list 
     794                                '&left_handle_at=' + this.options.leftHandleAt + // mark point for comparison list 
    765795                                '&nonce=' + this.options.nonce; 
    766796                }, 
    767797