Make WordPress Core

Ticket #24736: 24736.12.patch

File 24736.12.patch, 22.2 KB (added by markjaquith, 11 years ago)
  • wp-admin/css/colors-classic.css

    table.diff .diff-addedline ins { 
    14861486}
    14871487
    14881488.revisions-tooltip,
    1489 .revisions-tooltip-arrow:after {
     1489.revisions-tooltip-arrow span {
    14901490        border-color: #d1e5ee;
    14911491        background-color: #fff;
    14921492}
  • wp-admin/css/colors-fresh.css

    table.diff .diff-addedline ins { 
    13801380}
    13811381
    13821382.revisions-tooltip,
    1383 .revisions-tooltip-arrow:after {
     1383.revisions-tooltip-arrow span {
    13841384        border-color: #d7d7d7;
    13851385        background-color: #fff;
    13861386}
  • wp-admin/css/ie.css

    table.ie-fixed { 
    630630* html #adminmenu div.wp-menu-image {
    631631        height: 29px;
    632632}
     633
     634/* Revisions */
     635.revisions-tooltip-arrow span {
     636        left: 25px;
     637        top: -24px;
     638        filter: progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476); /* IE7 */
     639}
     640
     641.revisions-controls .revisions-tickmarks > div {
     642        margin-right: -1px;
     643        border-width: 0 0 0 0;
     644                border-style: none;
     645}
     646 No newline at end of file
  • wp-admin/css/wp-admin-rtl.css

    th.sorted a span { 
    954954/*------------------------------------------------------------------------------
    955955  11.2 - Post Revisions
    956956------------------------------------------------------------------------------*/
    957 .wp-slider .ui-slider-handle.left-handle:before,
    958 .wp-slider .ui-slider-handle.right-handle:before {
     957.wp-slider .ui-slider-handle.from-handle:before,
     958.wp-slider .ui-slider-handle.to-handle:before {
    959959        height: 8px;
    960960        width: 7px;
    961961}
    962962
    963 .wp-slider .ui-slider-handle.left-handle:before {
     963.wp-slider .ui-slider-handle.from-handle:before {
    964964        background-position: -5px -10px;
    965965        left: 6px;
    966966}
    967967
    968 .wp-slider .ui-slider-handle.right-handle:before {
     968.wp-slider .ui-slider-handle.to-handle:before {
    969969        background-position: -4px -29px;
    970970        left: 6px;
    971971}
    th.sorted a span { 
    10251025}
    10261026
    10271027.revisions-tooltip {
    1028         margin-right: -73px;
    10291028        margin-left: 0;
     1029        margin-right: -70px;
    10301030        -webkit-transition: right 15ms;
    10311031        -moz-transition:    right 15ms;
    10321032        -ms-transition:     right 15ms;
    th.sorted a span { 
    10401040        margin-right: 35px;
    10411041}
    10421042
    1043 .revisions-tooltip-image {
     1043.revisions-tooltip-arrow > span {
     1044        right: 20px;
     1045}
     1046
     1047.revisions-tooltip img {
    10441048        float: right;
    10451049        margin: 2px 0 0 5px;
    10461050}
    10471051
     1052.revisions-tickmarks > div {
     1053        float: right;
     1054        border-width: 0 0 0 1px;
     1055}
     1056
    10481057/*------------------------------------------------------------------------------
    10491058  11.3 - Featured Images
    10501059------------------------------------------------------------------------------*/
  • wp-admin/css/wp-admin.css

    td.plugin-title p { 
    35003500/*------------------------------------------------------------------------------
    35013501  11.2 - Post Revisions
    35023502------------------------------------------------------------------------------*/
    3503 body.revision-php {
    3504         overflow-y: scroll; /* Force a scrollbar, so centering doesn't jump */
    3505 }
    3506 
    35073503.revisions-control-frame,
    35083504.revisions-diff-frame {
    35093505        position: relative;
    body.revision-php { 
    35223518
    35233519.revisions-tickmarks {
    35243520        position: relative;
    3525         margin: 0 auto 0;
     3521        margin: 0 auto;
    35263522        height: 0.8em;
    35273523        z-index: 2;
    35283524        top: 7px;
    35293525        width: 70%;
    35303526        -moz-box-sizing: border-box;
    35313527        -webkit-box-sizing: border-box;
    3532         -ms-box-sizing: border-box; /* ie8 only */
    35333528        box-sizing: border-box;
    35343529}
    35353530
    body.revision-php { 
    35393534        float: left;
    35403535        z-index: 10002;
    35413536        border-style: solid;
    3542         border-width: 0 0 0 1px;
     3537        border-width: 0 1px 0 0;
    35433538        -moz-box-sizing: border-box;
    35443539        -webkit-box-sizing: border-box;
    3545         -ms-box-sizing: border-box; /* ie8 only */
    35463540        box-sizing: border-box;
    35473541}
    35483542
    3549 .revisions-tickmarks > div:first-of-type {
    3550         border-left-width: 0;
     3543.revisions-tickmarks > div:last-child {
     3544        border-width: 0;
    35513545}
    35523546
    35533547.comparing-two-revisions .revisions-controls {
    body.revision-php { 
    35773571        -ms-transition:     opacity 0.5s;
    35783572        -o-transition:      opacity 0.5s;
    35793573        transition:         opacity 0.5s;
     3574        filter: alpha(opacity=0); /* ie8 and earlier */
    35803575}
    35813576
    35823577.revisions .loading-indicator span.spinner {
    body.revision-php { 
    35873582
    35883583.revisions.loading .loading-indicator {
    35893584        opacity: 1;
     3585        filter: alpha(opacity=100); /* ie8 and earlier */
    35903586}
    35913587
    35923588.revisions .diff {
    body.revision-php { 
    35993595
    36003596.revisions.loading .diff {
    36013597        opacity: 0.5;
     3598        filter: alpha(opacity=50); /* ie8 and earlier */
    36023599}
    36033600
    36043601.revisions.diff-error .diff {
    body.revision-php { 
    36303627
    36313628.wp-slider {
    36323629        width: 70%;
    3633         margin: 0 auto 0;
     3630        margin: 0 auto;
    36343631        top: -3px;
    36353632}
    36363633
    table.diff .diff-addedline ins { 
    37233720}
    37243721
    37253722.revisions-tooltip {
    3726         position: absolute;
    3727         bottom: 105px;
    3728         margin-left: -69px;
     3723        position: fixed;
     3724        margin-bottom: 22px;
     3725        margin-right: 0;
     3726        margin-left: -70px;
    37293727        line-height: 28px;
    37303728        z-index: 9999;
    37313729        max-width: 350px;
    table.diff .diff-addedline ins { 
    37623760        z-index: 10000;
    37633761}
    37643762
    3765 .revisions-tooltip-arrow:after {
     3763.revisions-tooltip-arrow > span {
    37663764        content: "";
    37673765        position: absolute;
    37683766        left: 20px;
    table.diff .diff-addedline ins { 
    37763774        tranform: rotate(45deg);
    37773775}
    37783776
     3777.ie8 .revisions-tooltip-arrow > span {
     3778        left: 14px;
     3779        top: -25px;
     3780        -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)"; /* IE8 */
     3781}
     3782
    37793783.revisions-tooltip,
    3780 .revisions-tooltip-arrow:after {
     3784.revisions-tooltip-arrow > span {
    37813785        border-width: 1px;
    37823786        border-style: solid;
    37833787}
    div.revisions-controls > .wp-slider > .ui-slider-handle { 
    38173821        background: url(../images/arrows-pr.png) no-repeat -2px -47px;
    38183822}
    38193823
    3820 .wp-slider .ui-slider-handle.left-handle:before,
    3821 .wp-slider .ui-slider-handle.right-handle:before {
     3824.wp-slider .ui-slider-handle.from-handle:before,
     3825.wp-slider .ui-slider-handle.to-handle:before {
    38223826        height: 8px;
    38233827        width: 7px;
    38243828}
    38253829
    3826 .wp-slider .ui-slider-handle.left-handle:before {
     3830.wp-slider .ui-slider-handle.from-handle:before {
    38273831        background-position: -5px -84px;
    38283832        left: 7px;
    38293833}
    38303834
    3831 .wp-slider .ui-slider-handle.right-handle:before {
     3835.wp-slider .ui-slider-handle.to-handle:before {
    38323836        background-position: -4px -65px;
    38333837        left: 5px;
    38343838}
  • wp-admin/js/revisions.js

    window.wp = window.wp || {}; 
    1616                        console.log.apply( console, arguments );
    1717        };
    1818
     19        // Handy function to help with positioning
     20        $.fn.allOffsets = function() {
     21                var offset = this.offset() || {top: 0, left: 0}, win = $(window);
     22                return _.extend( offset, {
     23                        right:  win.width()  - offset.left - this.outerWidth(),
     24                        bottom: win.height() - offset.top  - this.outerHeight()
     25                });
     26        };
     27
    1928        // wp_localize_script transforms top-level numbers into strings. Undo that.
    2029        if ( revisions.settings.to )
    2130                revisions.settings.to = parseInt( revisions.settings.to, 10 );
    window.wp = window.wp || {}; 
    125134        revisions.model.Tooltip = Backbone.Model.extend({
    126135                defaults: {
    127136                        revision: null,
     137                        offset: {},
    128138                        hovering: false, // Whether the mouse is hovering
    129139                        scrubbing: false // Whether the mouse is scrubbing
    130140                },
    131141
    132142                initialize: function( options ) {
     143                        this.frame = options.frame;
    133144                        this.revisions = options.revisions;
    134145                        this.slider = options.slider;
    135146
    136147                        this.listenTo( this.slider, 'hovered:revision', this.updateRevision );
    137148                        this.listenTo( this.slider, 'change:hovering', this.setHovering );
    138149                        this.listenTo( this.slider, 'change:scrubbing', this.setScrubbing );
     150
     151                        this.set({ revision: this.frame.diff() });
    139152                },
    140153
     154
    141155                updateRevision: function( revision ) {
    142156                        this.set({ revision: revision });
    143157                },
    window.wp = window.wp || {}; 
    475489                render: function() {
    476490                        wp.Backbone.View.prototype.render.apply( this, arguments );
    477491
     492                        $('html').css( 'overflow-y', 'scroll' );
    478493                        $('#wpbody-content .wrap').append( this.el );
    479494                        this.updateCompareTwoMode();
    480495                        this.renderDiff( this.model.diff() );
    window.wp = window.wp || {}; 
    524539                                revisions: this.model.revisions
    525540                        });
    526541
     542                        // Prep the tooltip model
     543                        var tooltip = new revisions.model.Tooltip({
     544                                frame: this.model,
     545                                revisions: this.model.revisions,
     546                                slider: slider
     547                        });
     548
    527549                        // Add the tooltip view
    528550                        this.views.add( new revisions.view.Tooltip({
    529                                 model: new revisions.model.Tooltip({
    530                                         revisions: this.model.revisions,
    531                                         slider: slider
    532                                 })
     551                                model: tooltip
    533552                        }) );
    534553
    535554                        // Add the tickmarks view
    536555                        this.views.add( new revisions.view.Tickmarks({
    537                                 model: this.model
     556                                model: tooltip
    538557                        }) );
    539558
    540559                        // Add the slider view
    window.wp = window.wp || {}; 
    554573        revisions.view.Tickmarks = wp.Backbone.View.extend({
    555574                className: 'revisions-tickmarks',
    556575
     576                initialize: function() {
     577                        this.listenTo( this.model, 'change:revision', this.reportTickPosition );
     578                },
     579
     580                reportTickPosition: function( model, revision ) {
     581                        var elWidth, offset, tick, index = this.model.revisions.indexOf( revision );
     582                        if ( index === this.model.revisions.length - 1 ) {
     583                                // Last one
     584                                offset = this.$el.allOffsets();
     585                                elWidth = this.$el.outerWidth();
     586                                // adjust
     587                                _.extend( offset, {
     588                                        right: offset.right + elWidth + 1,
     589                                        left: offset.left + elWidth + 1
     590                                });
     591                        } else {
     592                                // Normal tick
     593                                tick = this.$('div:nth-of-type(' + (index + 1) + ')');
     594                                offset = tick.allOffsets();
     595                        }
     596                        this.model.set({ offset: offset });
     597                },
     598
    557599                ready: function() {
    558600                        var tickCount, tickWidth;
    559601                        tickCount = this.model.revisions.length - 1;
    560602                        tickWidth = 1 / tickCount;
    561603
    562604                        _(tickCount).times( function(){ this.$el.append( '<div></div>' ); }, this );
     605
    563606                        this.$('div').css( 'width', ( 100 * tickWidth ) + '%' );
    564607                }
    565608        });
    window.wp = window.wp || {}; 
    625668        revisions.view.Tooltip = wp.Backbone.View.extend({
    626669                className: 'revisions-tooltip',
    627670                template: wp.template('revisions-tooltip'),
     671                direction: isRtl ? 'right' : 'left',
    628672
    629673                initialize: function( options ) {
    630                         this.listenTo( this.model, 'change:revision', this.render );
     674                        this.listenTo( this.model, 'change:offset', this.render );
    631675                        this.listenTo( this.model, 'change:hovering', this.toggleVisibility );
    632676                        this.listenTo( this.model, 'change:scrubbing', this.toggleVisibility );
    633677                },
    634678
     679                prepare: function() {
     680                        return this.model.get('revision').toJSON();
     681                },
     682
     683                render: function() {
     684                        var css = {};
     685                        wp.Backbone.View.prototype.render.apply( this, arguments );
     686                        css[this.direction] = this.model.get('offset')[this.direction] + 'px';
     687                        css.bottom = this.model.get('offset').bottom + 'px';
     688                        this.$el.css( css );
     689                },
     690
    635691                visible: function() {
    636692                        return this.model.get( 'scrubbing' ) || this.model.get( 'hovering' );
    637693                },
    window.wp = window.wp || {}; 
    642698                        else
    643699                                this.$el.stop().fadeTo( this.el.style.opacity * 300, 0, function(){ $(this).hide(); } );
    644700                        return;
    645                 },
    646 
    647                 render: function() {
    648                         var offset;
    649                         // Check if a revision exists.
    650                         if ( _.isNull( this.model.get('revision') ) )
    651                                 return;
    652 
    653                         this.$el.html( this.template( this.model.get('revision').toJSON() ) );
    654 
    655                         // Set the position.
    656                         offset = this.model.revisions.indexOf( this.model.get('revision') ) / ( this.model.revisions.length - 1 );
    657                         // 15% to get us to the start of the slider
    658                         // 0.7 to convert the slider-relative percentage to a page-relative percentage
    659                         // 100 to convert to a percentage
    660                         offset = 15 + (0.7 * offset * 100 ); // Now in a percentage
    661                         this.$el.css( isRtl ? 'right' : 'left', offset + '%' );
    662701                }
    663702        });
    664703
    window.wp = window.wp || {}; 
    681720                        this.disabledButtonCheck();
    682721                },
    683722
    684                 // Go to a specific modelindex, taking into account RTL mode.
     723                // Go to a specific model index
    685724                gotoModel: function( toIndex ) {
    686725                        var attributes = {
    687                                 to: this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL.
     726                                to: this.model.revisions.at( toIndex )
    688727                        };
    689728                        // If we're at the first revision, unset 'from'.
    690                         if ( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL
    691                                 attributes.from = this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 2 : toIndex - 1 );
     729                        if ( toIndex )
     730                                attributes.from = this.model.revisions.at( toIndex - 1 );
    692731                        else
    693732                                this.model.unset('from', { silent: true });
    694733
    695734                        this.model.set( attributes );
    696735                },
    697736
    698                 // Go to the 'next' revision, direction takes into account RTL mode.
     737                // Go to the 'next' revision
    699738                nextRevision: function() {
    700                         var toIndex = isRtl ? this.model.revisions.length - this.model.revisions.indexOf( this.model.get('to') ) - 1 : this.model.revisions.indexOf( this.model.get('to') );
    701                         toIndex     = isRtl ? toIndex - 1 : toIndex + 1;
     739                        var toIndex = this.model.revisions.indexOf( this.model.get('to') ) + 1;
    702740                        this.gotoModel( toIndex );
    703741                },
    704742
    705                 // Go to the 'previous' revision, direction takes into account RTL mode.
     743                // Go to the 'previous' revision
    706744                previousRevision: function() {
    707                         var toIndex = isRtl ? this.model.revisions.length - this.model.revisions.indexOf( this.model.get('to') ) - 1 : this.model.revisions.indexOf( this.model.get('to') );
    708                         toIndex     = isRtl ? toIndex + 1 : toIndex - 1;
     745                        var toIndex = this.model.revisions.indexOf( this.model.get('to') ) - 1;
    709746                        this.gotoModel( toIndex );
    710747                },
    711748
    window.wp = window.wp || {}; 
    729766        // The slider view.
    730767        revisions.view.Slider = wp.Backbone.View.extend({
    731768                className: 'wp-slider',
     769                direction: isRtl ? 'right' : 'left',
    732770
    733771                events: {
    734772                        'mousemove' : 'mouseMove'
    window.wp = window.wp || {}; 
    757795
    758796                mouseMove: function( e ) {
    759797                        var zoneCount = this.model.revisions.length - 1, // One fewer zone than models
    760                                 sliderLeft = this.$el.offset().left, // Left edge of slider
     798                                sliderFrom = this.$el.allOffsets()[this.direction], // "From" edge of slider
    761799                                sliderWidth = this.$el.width(), // Width of slider
    762800                                tickWidth = sliderWidth / zoneCount, // Calculated width of zone
    763                                 actualX = e.clientX - sliderLeft, // Offset of mouse position in slider
    764                                 currentModelIndex = Math.floor( ( actualX + ( tickWidth / 2 )  ) / tickWidth ); // Calculate the model index
    765 
    766                         // Reverse direction in RTL mode.
    767                         if ( isRtl )
    768                                 currentModelIndex = this.model.revisions.length - currentModelIndex - 1;
     801                                actualX = e.pageX - sliderFrom; // Offset of mouse position in slider
     802                        actualX = isRtl ? sliderWidth - actualX : actualX;
     803                        var currentModelIndex = Math.floor( ( actualX + ( tickWidth / 2 )  ) / tickWidth ); // Calculate the model index
    769804
    770805                        // Ensure sane value for currentModelIndex.
    771806                        if ( currentModelIndex < 0 )
    window.wp = window.wp || {}; 
    773808                        else if ( currentModelIndex >= this.model.revisions.length )
    774809                                currentModelIndex = this.model.revisions.length - 1;
    775810
    776                         // Update the tooltip model
     811                        // Update the tooltip mode
    777812                        this.model.set({ hoveredRevision: this.model.revisions.at( currentModelIndex ) });
    778813                },
    779814
    window.wp = window.wp || {}; 
    792827                        if ( this.model.get('compareTwoMode') ) {
    793828                                // in RTL mode the 'left handle' is the second in the slider, 'right' is first
    794829                                handles.first()
    795                                         .toggleClass( 'right-handle', !! isRtl )
    796                                         .toggleClass( 'left-handle', ! isRtl );
     830                                        .toggleClass( 'to-handle', !! isRtl )
     831                                        .toggleClass( 'from-handle', ! isRtl );
    797832                                handles.last()
    798                                         .toggleClass( 'left-handle', !! isRtl )
    799                                         .toggleClass( 'right-handle', ! isRtl );
     833                                        .toggleClass( 'from-handle', !! isRtl )
     834                                        .toggleClass( 'to-handle', ! isRtl );
    800835                        } else {
    801                                 handles.removeClass('left-handle right-handle');
     836                                handles.removeClass('from-handle to-handle');
    802837                        }
    803838                },
    804839
    805                 getSliderPosition: function( ui ){
    806                         return isRtl ? this.model.revisions.length - ui.value - 1 : ui.value;
    807                 },
    808 
    809840                start: function( event, ui ) {
    810841                        this.model.set({ scrubbing: true });
    811842
    812843                        // Track the mouse position to enable smooth dragging,
    813844                        // overrides default jQuery UI step behavior.
    814845                        $( window ).on( 'mousemove.wp.revisions', { view: this }, function( e ) {
    815                                 var view            = e.data.view,
    816                                         leftDragBoundary  = view.$el.offset().left, // Initial left boundary
    817                                         sliderOffset      = leftDragBoundary,
    818                                         sliderRightEdge   = leftDragBoundary + view.$el.width(),
    819                                         rightDragBoundary = sliderRightEdge, // Initial right boundary
    820                                         leftDragReset     = 0, // Initial left drag reset
    821                                         rightDragReset    = sliderRightEdge - sliderOffset; // Initial right drag reset
     846                                var view              = e.data.view,
     847                                    leftDragBoundary  = view.$el.offset().left,
     848                                    sliderOffset      = leftDragBoundary,
     849                                    sliderRightEdge   = leftDragBoundary + view.$el.width(),
     850                                    rightDragBoundary = sliderRightEdge,
     851                                    leftDragReset     = '0',
     852                                    rightDragReset    = '100%',
     853                                    handle            = $( ui.handle );
    822854
    823855                                // In two handle mode, ensure handles can't be dragged past each other.
    824856                                // Adjust left/right boundaries and reset points.
    825857                                if ( view.model.get('compareTwoMode') ) {
    826                                         var rightHandle = $( ui.handle ).parent().find('.right-handle'),
    827                                                 leftHandle  = $( ui.handle ).parent().find('.left-handle');
    828 
    829                                         if ( $( ui.handle ).hasClass('left-handle') ) {
    830                                                 // Dragging the left handle, boundary is right handle.
    831                                                 // RTL mode calculations reverse directions.
    832                                                 if ( isRtl ) {
    833                                                         leftDragBoundary = rightHandle.offset().left + rightHandle.width();
    834                                                         leftDragReset    = leftDragBoundary - sliderOffset;
    835                                                 } else {
    836                                                         rightDragBoundary = rightHandle.offset().left;
    837                                                         rightDragReset    = rightDragBoundary - sliderOffset;
    838                                                 }
    839                                         } else {
    840                                                 // Dragging the right handle, boundary is the left handle.
    841                                                 // RTL mode calculations reverse directions.
    842                                                 if ( isRtl ) {
    843                                                         rightDragBoundary = leftHandle.offset().left;
    844                                                         rightDragReset    = rightDragBoundary - sliderOffset;
    845                                                 } else {
    846                                                         leftDragBoundary = leftHandle.offset().left + leftHandle.width() ;
    847                                                         leftDragReset    = leftDragBoundary - sliderOffset;
    848                                                 }
     858                                        var handles = handle.parent().find('.ui-slider-handle');
     859                                        if ( handle.is( handles.first() ) ) { // We're the left handle
     860                                                rightDragBoundary = handles.last().offset().left;
     861                                                rightDragReset    = rightDragBoundary - sliderOffset;
     862                                        } else { // We're the right handle
     863                                                leftDragBoundary = handles.first().offset().left + handles.first().width();
     864                                                leftDragReset    = leftDragBoundary - sliderOffset;
    849865                                        }
    850866                                }
    851867
    852868                                // Follow mouse movements, as long as handle remains inside slider.
    853                                 if ( e.clientX < leftDragBoundary ) {
    854                                         $( ui.handle ).css( 'left', leftDragReset ); // Mouse to left of slider.
    855                                 } else if ( e.clientX > rightDragBoundary ) {
    856                                         $( ui.handle ).css( 'left', rightDragReset ); // Mouse to right of slider.
     869                                if ( e.pageX < leftDragBoundary ) {
     870                                        handle.css( 'left', leftDragReset ); // Mouse to left of slider.
     871                                } else if ( e.pageX > rightDragBoundary ) {
     872                                        handle.css( 'left', rightDragReset ); // Mouse to right of slider.
    857873                                } else {
    858                                         $( ui.handle ).css( 'left', e.clientX - sliderOffset ); // Mouse in slider.
     874                                        handle.css( 'left', e.pageX - sliderOffset ); // Mouse in slider.
    859875                                }
    860876                        } );
    861877                },
    862878
     879                getPosition: function( position ) {
     880                        return isRtl ? this.model.revisions.length - position - 1: position;
     881                },
     882
    863883                // Responds to slide events
    864884                slide: function( event, ui ) {
    865                         var attributes, movedRevision, sliderPosition;
     885                        var attributes, movedRevision;
    866886                        // Compare two revisions mode
    867887                        if ( this.model.get('compareTwoMode') ) {
    868888                                // Prevent sliders from occupying same spot
    869889                                if ( ui.values[1] === ui.values[0] )
    870890                                        return false;
    871 
     891                                if ( isRtl )
     892                                        ui.values.reverse();
    872893                                attributes = {
    873                                         to: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[0] - 1 : ui.values[1] ),
    874                                         from: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[1] - 1 : ui.values[0] )
     894                                        from: this.model.revisions.at( this.getPosition( ui.values[0] ) ),
     895                                        to: this.model.revisions.at( this.getPosition( ui.values[1] ) )
    875896                                };
    876                                 if ( isRtl )
    877                                         movedRevision = ui.value === ui.values[1] ? attributes.from : attributes.to;
    878                                 else
    879                                         movedRevision = ui.value === ui.values[0] ? attributes.from : attributes.to;
    880897                        } else {
    881                                 sliderPosition = this.getSliderPosition( ui );
    882898                                attributes = {
    883                                         to: this.model.revisions.at( sliderPosition )
     899                                        to: this.model.revisions.at( this.getPosition( ui.value ) )
    884900                                };
    885                                 movedRevision = attributes.to;
    886901                                // If we're at the first revision, unset 'from'.
    887                                 if ( sliderPosition ) // Reverse directions for RTL.
    888                                         attributes.from = this.model.revisions.at( sliderPosition - 1 );
     902                                if ( this.getPosition( ui.value ) > 0 )
     903                                        attributes.from = this.model.revisions.at( this.getPosition( ui.value ) - 1 );
    889904                                else
    890905                                        attributes.from = undefined;
    891906                        }
     907                        movedRevision = this.model.revisions.at( this.getPosition( ui.value ) );
    892908
    893909                        // If we are scrubbing, a scrub to a revision is considered a hover
    894910                        if ( this.model.get('scrubbing') )
  • wp-admin/revision.php

    require_once( './admin-header.php' ); 
    138138                        ({{ data.dateShort }})
    139139        <# } #>
    140140        </div>
    141         <div class="revisions-tooltip-arrow"></div>
     141        <div class="revisions-tooltip-arrow"><span></span></div>
    142142</script>
    143143
    144144<script id="tmpl-revisions-checkbox" type="text/html">