Ticket #24425: 24425.draft.27.diff
File 24425.draft.27.diff, 24.9 KB (added by , 11 years ago) |
---|
-
wp-admin/css/colors-fresh.css
1379 1379 border: 1px solid #dfdfdf; 1380 1380 } 1381 1381 1382 #diff-slider.ui-slider-tooltip,1383 #diff-slider-ticks.ui-slider-tooltip {1382 .ui-slider-tooltip, 1383 .ui-slider-tooltip { 1384 1384 border-color: #d7d7d7; 1385 1385 background-color: #fff; 1386 1386 } -
wp-admin/css/wp-admin-rtl.css
975 975 left: 6px; 976 976 } 977 977 978 #toggle-revision-compare-mode {978 .revision-toggle-compare-mode { 979 979 right: auto; 980 980 left: 0; 981 981 padding: 9px 0 0 9px; 982 982 } 983 983 984 #diff-next-revision{984 .revisions-next { 985 985 float: left; 986 986 } 987 987 988 #diff-previous-revision{988 .revisions-previous { 989 989 float: right; 990 990 } 991 991 -
wp-admin/css/wp-admin.css
3502 3502 margin-bottom: 10px; 3503 3503 } 3504 3504 3505 .comparing-two-revisions .revisions-controls { 3506 height: 90px; 3507 } 3508 3505 3509 .revisions-meta { 3506 3510 margin-top: 15px; 3507 3511 } … … 3510 3514 top: 0; 3511 3515 right: 0; 3512 3516 } 3517 .comparing-two-revisions .revisions-previous, 3518 .comparing-two-revisions .revisions-next { 3519 display: none; 3520 } 3513 3521 3514 3522 .revisions-previous { 3515 3523 float: left; … … 3590 3598 width: 95%; 3591 3599 } 3592 3600 3593 #diff-slider .ui-slider-tooltip, 3594 #diff-slider-ticks .ui-slider-tooltip { 3601 .revisions .ui-slider-tooltip { 3602 position: absolute; 3603 bottom: 86px; 3604 margin-left: -70px; 3595 3605 display: none; 3596 position: absolute; 3597 bottom: 21px; 3598 margin-left: -74px; 3606 line-height: 28px; 3599 3607 } 3600 3608 3601 #diff-slider .ui-state-active .ui-slider-tooltip,3602 #diff-slider .ui-state-focus .ui-slider-tooltip,3603 #diff-slider .ui-state-hover .ui-slider-tooltip {3604 display: block;3605 }3606 3607 3609 #diff-title-to strong { 3608 3610 display: inline; 3609 3611 } … … 3655 3657 margin-top: 20px; 3656 3658 } 3657 3659 3658 .comparing-two-revisions#diff-previous-revision,3659 .comparing-two-revisions#diff-next-revision,3660 #diff-previous-revision, 3661 #diff-next-revision, 3660 3662 #diff-header-from { 3661 3663 display: none; 3662 3664 } … … 3740 3742 .ui-slider-tooltip img { 3741 3743 float: left; 3742 3744 margin-right: 5px; 3743 margin-top: 5px; 3745 margin-top: 2px; 3746 padding: 0; 3747 vertical-align: middle; 3744 3748 } 3745 3749 3746 3750 … … 3748 3752 3749 3753 .ui-tooltip, 3750 3754 .ui-slider-tooltip { 3751 padding: 8px;3755 padding: 4px; 3752 3756 position: absolute; 3753 3757 z-index: 9999; 3754 3758 max-width: 300px; … … 3768 3772 3769 3773 .ui-tooltip, 3770 3774 .ui-slider-tooltip { 3771 padding: 5px 10px;3775 padding: 4px 4px; 3772 3776 } 3773 3777 3774 3778 .arrow { … … 3776 3780 height: 16px; 3777 3781 overflow: hidden; 3778 3782 position: absolute; 3779 left: 50%;3783 left: 0; 3780 3784 margin-left: -35px; 3781 bottom: -16px; 3782 z-index: 99999; 3785 bottom: 71px; 3786 z-index: 10000; 3787 display: none; 3783 3788 } 3784 3789 3785 3790 .arrow.top { … … 3871 3876 3872 3877 .wp-slider.ui-slider-horizontal { 3873 3878 height: .8em; 3879 z-index: 10001; 3874 3880 } 3875 3881 3876 3882 .wp-slider.ui-slider-horizontal .ui-slider-handle { -
wp-admin/js/revisions.js
3 3 (function($) { 4 4 var revisions; 5 5 6 revisions = wp.revisions = { model: {}, view: {}, controller: {} };6 revisions = wp.revisions = { model: {}, view: {}, controller: {}, router: {} }; 7 7 8 8 // Link settings. 9 9 revisions.settings = typeof _wpRevisionsSettings === 'undefined' ? {} : _wpRevisionsSettings; … … 30 30 31 31 comparator: function( revision ) { 32 32 return revision.id; 33 } ,33 } 34 34 }); 35 35 36 36 revisions.model.Field = Backbone.Model.extend({}); … … 101 101 return this.fetch({ data: { compare: comparisons }, remove: false }); 102 102 }, 103 103 104 /**/105 104 loadLast: function( num ) { 106 105 num = num || 1; 107 106 var ids = this.getProximalDiffIds(); … … 194 193 initialize: function( attributes, options ) { 195 194 this.revisions = options.revisions; 196 195 this.diffs = new revisions.model.Diffs( [], {revisions: this.revisions} ); 196 this.listenTo( this, 'change:from', this.updateDiffFrom ); 197 this.listenTo( this, 'change:to', this.updateDiffTo ); 198 this.revisionsRouter = new revisions.router.Router(); 199 this.revisionsRouter.model = this; 197 200 198 this.listenTo( this, 'change:from change:to', this.updateDiffId );199 201 }, 200 202 201 updateDiff Id: function() {203 updateDiffTo: function() { 202 204 var from = this.get( 'from' ); 203 205 var to = this.get( 'to' ); 204 this.set( 'diffId', (from ? from.id : '0') + ':' + to.id ); 206 this.set( 'diffId', (from ? from.id : '0' ) + ':' + to.id ); 207 }, 208 209 updateDiffFrom: function() { 210 if ( this.get( 'compareTwoMode' ) ) { 211 this.updateDiffTo(); 212 } 205 213 } 214 206 215 }); 207 216 208 217 … … 243 252 this.model.diffs.loadAllBy( 50 ); 244 253 }, this ) ); 245 254 } 255 Backbone.history.start(); 246 256 }, 247 257 248 258 render: function() { … … 266 276 }); 267 277 268 278 // The control view. 269 // This contains the revision slider, previous/next buttons, and the compare checkbox.279 // This contains the revision slider, previous/next buttons, the meta info and the compare checkbox. 270 280 revisions.view.Controls = wp.Backbone.View.extend({ 271 281 tagName: 'div', 272 282 className: 'revisions-controls', 273 283 274 284 initialize: function() { 275 285 // Add the button view 276 this.views.add( new revisions.view.Buttons({ 286 this.views.add( new revisions.view.Buttons({ 277 287 model: this.model 278 288 })); 279 289 290 // Add the checkbox view 291 this.views.add( new revisions.view.Checkbox({ 292 model: this.model 293 })); 294 295 // Add the tooltip view 296 this.views.add( new revisions.view.Tooltip({ 297 model: this.model 298 })); 299 280 300 // Add the Slider view 281 301 this.views.add( new revisions.view.Slider({ 282 302 model: this.model … … 314 334 if( this.model.get( 'to' ).attributes.current ) { 315 335 $( '#restore-revision' ).prop( 'disabled', true); 316 336 } else { 317 $( '#restore-revision' ).prop( 'disabled', false) 337 $( '#restore-revision' ).prop( 'disabled', false); 318 338 } 319 339 } 320 340 }); 321 341 342 // The checkbox view. 343 // Encapsulates all of the configuration for the compare check-box. 344 revisions.view.Checkbox = wp.Backbone.View.extend({ 345 tagName: 'div', 346 className: 'revisions-checkbox', 347 template: wp.template('revisions-checkbox'), 322 348 349 initialize: function() { 350 this.$el.html( this.template() ); 351 this.listenTo( this.model, 'change:compareTwoMode', this.updateCompareTwoMode ); 352 }, 353 354 events: { 355 'click .compare-two-revisions': 'compareTwoToggle' 356 }, 357 358 updateCompareTwoMode: function(){ 359 if ( this.model.get( 'compareTwoMode' ) ){ 360 $( '.revisions-control-frame' ).addClass( 'comparing-two-revisions' ); 361 // in RTL mode the 'left handle' is the second in the slider, 'right' is first 362 $( '.wp-slider a.ui-slider-handle' ).first().addClass( isRtl ? 'right-handle' : 'left-handle' ); 363 $( '.wp-slider a.ui-slider-handle' ).last().addClass( isRtl ? 'left-handle' : 'right-handle' ); 364 } else { 365 $( '.revisions-control-frame' ).removeClass( 'comparing-two-revisions' ); 366 $( '.wp-slider a.ui-slider-handle' ).removeClass( 'left-handle' ).removeClass( 'right-handle' ); 367 } 368 369 }, 370 371 // Toggle the compare two mode feature when the compare two check-box is checked. 372 compareTwoToggle: function( event ){ 373 // Activate compare two mode? 374 if ( $( '.compare-two-revisions' ).is( ':checked' ) ) { 375 this.model.set( { compareTwoMode: true } ); 376 } else { 377 this.model.set( { compareTwoMode: false } ); 378 } 379 this.model.revisionsRouter.navigateRoute( this.model.get( 'to').id, this.model.get( 'from' ).id ); 380 381 } 382 }); 383 384 // The tooltip view. 385 // Encapsulates the tooltip. 386 revisions.view.Tooltip = wp.Backbone.View.extend({ 387 tagName: 'div', 388 className: 'revisions-tooltip', 389 template: wp.template('revisions-tooltip'), 390 391 initialize: function() { 392 this.$el.html( this.template() ); 393 } 394 }); 395 323 396 // The buttons view. 324 // Encapsulates all of the configuration for the previous /next buttons, and the compare checkbox.397 // Encapsulates all of the configuration for the previous / next buttons. 325 398 revisions.view.Buttons = wp.Backbone.View.extend({ 326 399 tagName: 'div', 327 400 className: 'revisions-buttons', 328 template: wp.template('revisions- controls'),401 template: wp.template('revisions-buttons'), 329 402 330 403 initialize: function() { 331 this.$el.html( this.template() ) 404 this.$el.html( this.template() ); 332 405 }, 333 406 334 407 events: { 335 408 'click #next': 'nextRevision', 336 409 'click #previous': 'previousRevision' 337 410 }, 338 411 412 // Go to a specific modelindex, taking into account RTL mode. 339 413 gotoModel: function( toIndex ) { 340 414 var attributes = { 341 to: this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for R tl415 to: this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL. 342 416 }; 343 417 // If we're at the first revision, unset 'from'. 344 if ( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for R tl418 if ( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL 345 419 attributes.from = this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 2 : toIndex - 1 ); 346 420 else 347 421 this.model.unset('from', { silent: true }); 348 422 349 423 this.model.set( attributes ); 424 425 this.model.revisionsRouter.navigateRoute( attributes.to.id, attributes.from ? attributes.from.id : 0 ); 426 350 427 }, 351 428 429 // Go to the 'next' revision, direction takes into account RTL mode. 352 430 nextRevision: function() { 353 var toIndex = this.model.revisions.indexOf( this.model.get( 'to' ) );431 var toIndex = isRtl ? this.model.revisions.length - this.model.revisions.indexOf( this.model.get( 'to' ) ) - 1 : this.model.revisions.indexOf( this.model.get( 'to' ) ); 354 432 toIndex = isRtl ? toIndex - 1 : toIndex + 1; 355 433 this.gotoModel( toIndex ); 356 434 }, 357 435 436 // Go to the 'previous' revision, direction takes into account RTL mode. 358 437 previousRevision: function() { 359 var toIndex = this.model.revisions.indexOf( this.model.get('to') );438 var toIndex = isRtl ? this.model.revisions.length - this.model.revisions.indexOf( this.model.get( 'to' ) ) - 1 : this.model.revisions.indexOf( this.model.get( 'to' ) ); 360 439 toIndex = isRtl ? toIndex + 1 : toIndex - 1; 361 440 this.gotoModel( toIndex ); 362 441 }, 363 442 364 443 ready: function() { 365 444 this.listenTo( this.model, 'change:diffId', this.disabledButtonCheck ); 445 446 // Hide compare two mode toggle when fewer than three revisions. 447 if ( this.model.revisions.length < 3 ) { 448 $( '.revision-toggle-compare-mode' ).hide(); 449 } 366 450 }, 367 451 368 // Check to see if the Previous or Next buttons need to be disabled or enabled 452 // Check to see if the Previous or Next buttons need to be disabled or enabled. 369 453 disabledButtonCheck: function() { 370 var maxVal = isRtl ? 0 :this.model.revisions.length - 1,371 minVal = isRtl ? this.model.revisions.length - 1 :0,372 next 454 var maxVal = this.model.revisions.length - 1, 455 minVal = 0, 456 next = $( '.revisions-next .button' ), 373 457 previous = $( '.revisions-previous .button' ), 374 val 458 val = this.model.revisions.indexOf( this.model.get( 'to' ) ); 375 459 376 // Disable "Next" button if you're on the last node 460 // Disable "Next" button if you're on the last node. 377 461 if ( maxVal === val ) 378 462 next.prop( 'disabled', true ); 379 463 else 380 464 next.prop( 'disabled', false ); 381 465 382 // Disable "Previous" button if you're on the first node 466 // Disable "Previous" button if you're on the first node. 383 467 if ( minVal === val ) 384 468 previous.prop( 'disabled', true ); 385 469 else 386 470 previous.prop( 'disabled', false ); 387 }, 388 389 471 } 390 472 }); 391 473 392 474 // The slider view. … … 395 477 tagName: 'div', 396 478 className: 'wp-slider', 397 479 480 events: { 481 'mousemove' : 'mousemove', 482 'mouseenter' : 'mouseenter', 483 'mouseleave' : 'mouseleave' 484 }, 485 398 486 initialize: function() { 399 487 _.bindAll( this, 'start', 'slide', 'stop' ); 400 488 … … 404 492 405 493 // Find the initially selected revision 406 494 var initiallySelectedRevisionIndex = 407 this.model.revisions.indexOf( 495 this.model.revisions.indexOf( 408 496 this.model.revisions.findWhere( { id: Number( revisions.settings.selectedRevision ) } ) ); 409 497 410 498 this.settings = new revisions.model.Slider({ … … 418 506 419 507 ready: function() { 420 508 this.$el.slider( this.settings.toJSON() ); 509 510 // Listen for changes in Compare Two Mode setting 511 this.listenTo( this.model, 'change:compareTwoMode', this.updateSliderSettings ); 512 421 513 this.settings.on( 'change', function( model, options ) { 422 // Apply changes to slider settings here. 423 this.$el.slider( { value: this.model.revisions.indexOf( this.model.get( 'to' ) ) } ); // Set handle to current to model 514 this.updateSliderSettings(); 424 515 }, this ); 425 // Reset to the initially selected revision426 this.slide( '', this.settings.attributes );427 516 428 517 // Listen for changes in the diffId 429 518 this.listenTo( this.model, 'change:diffId', this.diffIdChanged ); 430 519 520 // Reset to the initially selected revision 521 this.slide( '', this.settings.attributes ); 522 523 if ( this.model.get( 'compareTwoMode' ) ) 524 $( '.compare-two-revisions' ).trigger( 'click' ); 431 525 }, 432 526 527 mousemove: function( e ) { 528 var sliderLeft = Math.ceil( this.$el.offset().left ), 529 sliderWidth = Math.ceil( this.$el.width() ) + 2, 530 tickWidth = Math.ceil( ( sliderWidth ) / this.model.revisions.length ), 531 hoveringAt = Math.floor( ( e.clientX - sliderLeft ) / tickWidth ); 532 533 // Ensure sane value for hoveringAt. 534 if ( hoveringAt < 0 ) 535 hoveringAt = 0; 536 else if ( hoveringAt >= this.model.revisions.length ) 537 hoveringAt = this.model.revisions.length - 1; 538 539 var tooltipHtml = this.model.revisions.at( hoveringAt ).get( 'author' ).avatar + 540 this.model.revisions.at( hoveringAt ).get( 'author' ).name + 541 ', ' + this.model.revisions.at( hoveringAt ).get( 'dateShort' ); 542 543 this.addTooltip( $( e.currentTarget ), tooltipHtml, e ); 544 }, 545 546 mouseenter: function( e ) { 547 $( e.currentTarget ).parent().find( '.ui-slider-tooltip' ).show(); 548 $( e.currentTarget ).parent().find( '.arrow' ).show(); 549 }, 550 551 mouseleave: function( e ) { 552 $( e.currentTarget ).parent().find( '.ui-slider-tooltip' ).hide(); 553 $( e.currentTarget ).parent().find( '.arrow' ).hide(); 554 }, 555 556 updateSliderSettings: function() { 557 if ( isRtl ) { 558 this.$el.slider( { // Order reversed in RTL mode 559 value: this.model.revisions.length - this.model.revisions.indexOf( this.model.get( 'to' ) ) - 1 560 } ); 561 } else { 562 if ( this.model.get( 'compareTwoMode' ) ) { 563 this.$el.slider( { // Set handles to current from/to models 564 values: [ 565 this.model.revisions.indexOf( this.model.get( 'from' ) ), 566 this.model.revisions.indexOf( this.model.get( 'to' ) ) 567 ], 568 value: null, 569 range: true // Range mode ensures handles can't cross 570 } ); 571 } else { 572 this.$el.slider( { // Set handle to current to model 573 value: this.model.revisions.indexOf( this.model.get( 'to' ) ), 574 values: null, // Clear existing two handled values 575 range: false 576 } ); 577 } 578 } 579 if ( this.model.get( 'compareTwoMode' ) ){ 580 $( '.revisions' ).addClass( 'comparing-two-revisions' ); 581 582 // in RTL mode the 'left handle' is the second in the slider, 'right' is first 583 $( 'a.ui-slider-handle', this.$el ) 584 .first() 585 .addClass( isRtl ? 'right-handle' : 'left-handle' ) 586 .removeClass( isRtl ? 'left-handle' : 'right-handle' ); 587 $( 'a.ui-slider-handle', this.$el ) 588 .last() 589 .addClass( isRtl ? 'left-handle' : 'right-handle' ) 590 .removeClass( isRtl ? 'right-handle' : 'left-handle' ); 591 } else { 592 $( '.revisions' ).removeClass( 'comparing-two-revisions' ); 593 } 594 }, 595 433 596 diffIdChanged: function() { 434 597 // Reset the view settings when diffId is changed 435 this.settings.set( { 'value': this.model.revisions.indexOf( this.model.get( 'to' ) ) } ); 598 if ( this.model.get( 'compareTwoMode' ) ) { 599 this.settings.set( { 'values': [ 600 this.model.revisions.indexOf( this.model.get( 'from' ) ), 601 this.model.revisions.indexOf( this.model.get( 'to' ) ) 602 ] } ); 603 } else { 604 this.settings.set( { 'value': this.model.revisions.indexOf( this.model.get( 'to' ) ) } ); 605 } 436 606 }, 437 607 438 608 start: function( event, ui ) { 439 // Track the mouse position to enable smooth dragging, overrides default jquery ui step behaviour 440 $( window ).mousemove( function( e ) { 441 var sliderLeft = $( '.wp-slider' ).offset().left, 442 sliderRight = sliderLeft + $( '.wp-slider' ).width(); 609 if ( true !== this.model.get( 'compareTwoMode' )) { 610 // Track the mouse position to enable smooth dragging, overrides default jquery ui step behaviour . 611 $( window ).mousemove( function( e ) { 612 var sliderLeft = this.$el.offset().left, 613 sliderRight = sliderLeft + this.$el.width(); 443 614 444 // Follow mouse movements, as long as handle remains inside slider 445 if ( e.clientX < sliderLeft ) { 446 $( ui.handle ).css( 'left', 0 ); // Mouse to left of slider 447 } else if ( e.clientX > sliderRight ) { 448 $( ui.handle ).css( 'left', sliderRight - sliderLeft); // Mouse to right of slider 449 } else { 450 $( ui.handle ).css( 'left', e.clientX - sliderLeft ); // Mouse in slider 451 } 452 } ); // End mousemove 615 // Follow mouse movements, as long as handle remains inside slider. 616 if ( e.clientX < sliderLeft ) { 617 $( ui.handle ).css( 'left', 0 ); // Mouse to left of slider. 618 } else if ( e.clientX > sliderRight ) { 619 $( ui.handle ).css( 'left', sliderRight - sliderLeft); // Mouse to right of slider. 620 } else { 621 $( ui.handle ).css( 'left', e.clientX - sliderLeft ); // Mouse in slider. 622 } 623 } ); // End mousemove. 624 } 453 625 }, 454 626 627 getSliderPosition: function( ui ){ 628 return isRtl ? this.model.revisions.length - ui.value - 1 : ui.value; 629 }, 630 631 addTooltip: function( handle, message, e ) { 632 var offset = $( '.revisions-buttons' ).offset().left, 633 calculatedX = e.clientX - offset; 634 635 handle.parent().find( '.ui-slider-tooltip' ).html( message ).css( 'left', calculatedX ); 636 handle.parent().find( '.arrow' ).css( 'left', calculatedX ); 637 }, 638 455 639 slide: function( event, ui ) { 456 var attributes = { 457 to: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.value - 1 : ui.value ) // Reverse directions for Rtl 458 }; 640 var attributes; 641 // Compare two revisions mode 642 if ( 'undefined' !== typeof ui.values && this.model.get( 'compareTwoMode' ) ) { 643 // Prevent sliders from occupying same spot 644 if ( ui.values[1] === ui.values[0] ) 645 return false; 646 attributes = { 647 to: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[1] - 1 : ui.values[1] ), // Reverse directions for RTL. 648 from: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[0] - 1 : ui.values[0] ) // Reverse directions for RTL. 649 }; 459 650 460 // If we're at the first revision, unset 'from'. 461 if ( isRtl ? this.model.revisions.length - ui.value - 1 : ui.value ) // Reverse directions for Rtl 462 attributes.from = this.model.revisions.at( isRtl ? this.model.revisions.length - ui.value - 2 : ui.value - 1 ); 463 else 464 this.model.unset('from', { silent: true }); 651 } else { 652 // Compare single revision mode 653 var sliderPosition = this.getSliderPosition( ui ); 654 attributes = { 655 to: this.model.revisions.at( sliderPosition ) 656 }; 465 657 658 // If we're at the first revision, unset 'from'. 659 if ( sliderPosition ) // Reverse directions for RTL. 660 attributes.from = this.model.revisions.at( sliderPosition - 1 ); 661 else 662 this.model.unset('from', { silent: true }); 663 664 } 466 665 this.model.set( attributes ); 666 667 // Maintain state history when dragging 668 this.model.revisionsRouter.navigateRoute( attributes.to.id, ( attributes.from ? attributes.from.id : 0 ) ); 669 467 670 }, 468 671 469 672 stop: function( event, ui ) { 470 $( window ).unbind( 'mousemove' ); // Stop tracking the mouse 471 // Reset settings pops handle back to the step position 472 this.settings.trigger( 'change' ); 673 if ( true !== this.model.get( 'compareTwoMode' )) { 674 $( window ).unbind( 'mousemove' ); // Stop tracking the mouse. 675 // Reset settings pops handle back to the step position. 676 this.settings.trigger( 'change' ); 677 } 473 678 } 474 679 }); 475 680 … … 486 691 } 487 692 }); 488 693 694 // The revisions router 695 // takes URLs with #hash fragments and routes them 696 revisions.router.Router = Backbone.Router.extend({ 697 model: null, 698 699 routes: { 700 'revision/from/:from/to/:to/handles/:handles': 'gotoRevisionId' 701 }, 702 703 navigateRoute: function( to, from ) { 704 var navigateTo = '/revision/from/' + from + '/to/' + to + '/handles/'; 705 if ( this.model.get( 'compareTwoMode' ) ){ 706 navigateTo = navigateTo + '2'; 707 } else { 708 navigateTo = navigateTo + '1'; 709 } 710 this.navigate( navigateTo ); 711 }, 712 713 gotoRevisionId: function( from, to, handles ) { 714 if ( '2' === handles ) { 715 this.model.set( { compareTwoMode: true } ); 716 $( '.compare-two-revisions' ).prop( 'checked', true ); 717 } else { 718 this.model.set( { compareTwoMode: false } ); 719 $( '.compare-two-revisions' ).prop( 'checked', false ); 720 } 721 if ('undefined' !== typeof this.model ) { 722 var selectedToRevision = 723 this.model.revisions.findWhere( { 'id': Number( to ) } ), 724 selectedFromRevision = 725 this.model.revisions.findWhere( { 'id': Number( from ) } ); 726 727 this.model.set( { 728 to: selectedToRevision, 729 from: selectedFromRevision } ); 730 } 731 } 732 }); 733 489 734 // Initialize the revisions UI. 490 735 revisions.init = function() { 491 736 revisions.view.frame = new revisions.view.Frame({ 492 737 collection: new revisions.model.Revisions( revisions.settings.revisionData ) 493 738 }).render(); 739 // Only allow compare two mode if three or more revisions 494 740 }; 495 741 496 742 $( revisions.init ); -
wp-admin/revision.php
118 118 <span class="spinner"></span> 119 119 <div class="revisions-control-frame"></div> 120 120 <div class="revisions-diff-frame"></div> 121 121 122 </script> 122 123 123 <script id="tmpl-revisions-controls" type="text/html"> 124 125 <div class="revision-toggle-compare-mode"> 126 <label> 127 <input type="checkbox" class="compare-two-revisions" /> 128 <?php esc_attr_e( 'Compare two revisions' ); ?> 129 </label> 130 </div> 131 124 <script id="tmpl-revisions-buttons" type="text/html"> 132 125 <div class="revisions-previous"> 133 126 <input class="button" type="button" id="previous" value="<?php echo esc_attr_x( 'Previous', 'Button label for a previous revision' ); ?>" /> 134 127 </div> … … 138 131 </div> 139 132 </script> 140 133 134 <script id="tmpl-revisions-tooltip" type="text/html"> 135 <div class="ui-slider-tooltip ui-widget-content ui-corner-all "></div> 136 <div class="arrow"></div> 137 </script> 141 138 139 <script id="tmpl-revisions-checkbox" type="text/html"> 140 <div class="revision-toggle-compare-mode"> 141 <label> 142 <input type="checkbox" class="compare-two-revisions" /> 143 <?php esc_attr_e( 'Compare two revisions' ); ?> 144 </label> 145 </div> 146 </script> 147 142 148 <script id="tmpl-revisions-meta" type="text/html"> 143 149 <div id="diff-header"> 144 150 <div id="diff-header-from" class="diff-header"> … … 177 183 <# }); #> 178 184 </script> 179 185 180 <script id="tmpl-revisions-diff-old" type="text/html">181 <div id="toggle-revision-compare-mode">182 <label>183 <input type="checkbox" id="compare-two-revisions" />184 <?php esc_attr_e( 'Compare two revisions' ); ?>185 </label>186 </div>187 188 <div id="diff-header">189 <div id="diff-header-from" class="diff-header">190 <div id="diff-title-from" class="diff-title">191 <strong><?php _ex( 'From:', 'Followed by post revision info' ); ?></strong> {{{ data.titleFrom }}}192 </div>193 <div class="clear"></div>194 </div>195 196 <div id="diff-header-to" class="diff-header">197 <div id="diff-title-to" class="diff-title">198 <strong><?php _ex( 'To:', 'Followed by post revision info' ); ?></strong> {{{ data.titleTo }}}199 </div>200 201 <input type="button" id="restore-revision" class="button button-primary" data-restore-link="{{{ data.restoreLink }}}" value="<?php esc_attr_e( 'Restore This Revision' )?>" />202 <div class="clear"></div>203 </div>204 </div>205 206 <div id="diff-table">{{{ data.diff }}}</div>207 </script>208 209 <script id="tmpl-revision-interact-old" type="text/html">210 <div id="diff-previous-revision">211 <input class="button" type="button" id="previous" value="<?php echo esc_attr_x( 'Previous', 'Button label for a previous revision' ); ?>" />212 </div>213 214 <div id="diff-next-revision">215 <input class="button" type="button" id="next" value="<?php echo esc_attr_x( 'Next', 'Button label for a next revision' ); ?>" />216 </div>217 218 </script>219 220 186 <script id="tmpl-revision-ticks" type="text/html"> 221 187 <div class="revision-tick completed-{{{ data.completed }}} scope-of-changes-{{{ data.scopeOfChanges }}}"> 222 188 <span class="ui-slider-tooltip ui-widget-content ui-corner-all hidden"></span> 223 189 </div> 224 190 </script> 191 225 192 <?php 226 193 require_once( './admin-footer.php' );