Ticket #24425: 24425.draft.29.diff
File 24425.draft.29.diff, 26.7 KB (added by , 12 years ago) |
---|
-
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(); 205 212 } 206 213 }); 207 214 … … 243 250 this.model.diffs.loadAllBy( 50 ); 244 251 }, this ) ); 245 252 } 253 Backbone.history.start(); 246 254 }, 247 255 248 256 render: function() { … … 262 270 model: diff 263 271 })); 264 272 }); 265 } 273 }, 266 274 }); 267 275 268 276 // The control view. 269 // This contains the revision slider, previous/next buttons, and the compare checkbox.277 // This contains the revision slider, previous/next buttons, the meta info and the compare checkbox. 270 278 revisions.view.Controls = wp.Backbone.View.extend({ 271 279 tagName: 'div', 272 280 className: 'revisions-controls', 273 281 274 282 initialize: function() { 275 283 // Add the button view 276 this.views.add( new revisions.view.Buttons({ 284 this.views.add( new revisions.view.Buttons({ 277 285 model: this.model 278 286 })); 279 287 288 // Add the checkbox view 289 this.views.add( new revisions.view.Checkbox({ 290 model: this.model 291 })); 292 293 // Add the tooltip view 294 this.views.add( new revisions.view.Tooltip({ 295 model: this.model 296 })); 280 297 // Add the Slider view 281 298 this.views.add( new revisions.view.Slider({ 282 299 model: this.model … … 286 303 this.views.add( new revisions.view.Meta({ 287 304 model: this.model 288 305 }) ); 306 307 289 308 } 290 309 }); 291 310 … … 314 333 if( this.model.get( 'to' ).attributes.current ) { 315 334 $( '#restore-revision' ).prop( 'disabled', true); 316 335 } else { 317 $( '#restore-revision' ).prop( 'disabled', false) 336 $( '#restore-revision' ).prop( 'disabled', false); 318 337 } 319 338 } 320 339 }); 321 340 341 // The checkbox view. 342 // Encapsulates all of the configuration for the compare checkbox. 343 revisions.view.Checkbox = wp.Backbone.View.extend({ 344 tagName: 'div', 345 className: 'revisions-checkbox', 346 template: wp.template('revisions-checkbox'), 322 347 348 initialize: function() { 349 this.$el.html( this.template() ); 350 this.listenTo( this.model, 'change:compareTwoMode', this.updateCompareTwoMode ); 351 }, 352 353 events: { 354 'click .compare-two-revisions': 'compareTwoToggle' 355 }, 356 357 updateCompareTwoMode: function() { 358 //console.log( 'compareTwoMode' ); 359 if ( this.model.get( 'compareTwoMode' ) ) { 360 //console.log( 'go' ); 361 $( '.compare-two-revisions' ).parent().css('border', '1px solid #f00;').prop( 'checked', true ); 362 $( '.revisions-control-frame' ).addClass( 'comparing-two-revisions' ); 363 // in RTL mode the 'left handle' is the second in the slider, 'right' is first 364 $( '.wp-slider a.ui-slider-handle' ).first().addClass( isRtl ? 'right-handle' : 'left-handle' ); 365 $( '.wp-slider a.ui-slider-handle' ).last().addClass( isRtl ? 'left-handle' : 'right-handle' ); 366 } else { 367 $( '.compare-two-revisions' ).prop( 'checked', false ); 368 $( '.revisions-control-frame' ).removeClass( 'comparing-two-revisions' ); 369 $( '.wp-slider a.ui-slider-handle' ).removeClass( 'left-handle' ).removeClass( 'right-handle' ); 370 } 371 372 }, 373 374 // Toggle the compare two mode feature when the compare two checkbox is checked. 375 compareTwoToggle: function( event ) { 376 // Activate compare two mode? 377 if ( $( '.compare-two-revisions' ).is( ':checked' ) ) { 378 this.model.set( { compareTwoMode: true } ); 379 } else { 380 this.model.set( { compareTwoMode: false } ); 381 } 382 383 // Update route 384 this.model.revisionsRouter.navigateRoute( this.model.get( 'to').id, this.model.get( 'from' ).id ); 385 }, 386 387 ready: function() { 388 // Hide compare two mode toggle when fewer than three revisions. 389 if ( this.model.revisions.length < 3 ) 390 $( '.revision-toggle-compare-mode' ).hide(); 391 }, 392 393 394 }); 395 396 // The tooltip view. 397 // Encapsulates the tooltip. 398 revisions.view.Tooltip = wp.Backbone.View.extend({ 399 tagName: 'div', 400 className: 'revisions-tooltip', 401 template: wp.template('revisions-tooltip'), 402 403 initialize: function() { 404 this.listenTo( this.model, 'change:sliderHovering', this.sliderHoveringChanged ); 405 this.listenTo( this.model, 'change:tooltipPosition', this.tooltipPositionChanged ); 406 407 }, 408 409 ready: function() { 410 }, 411 412 // Show or hide tooltip based on sliderHovering is true 413 sliderHoveringChanged: function() { 414 if ( this.model.get( 'sliderHovering' ) ) { 415 //console.log(this.$el); 416 //$ ( '.ui-slider-tooltip' ).css( 'border', '1px solid #f00'); 417 $( '.revisions-tooltip' ).show();//.css( 'border', '1px solid #f00'); 418 } else { 419 $( '.revisions-tooltip' ).hide(); 420 } 421 }, 422 423 tooltipPositionChanged: function() { 424 //console.log('tooltip moved'); 425 this.$el.html( this.template( this.model.revisions.at( this.model.get( 'hoveringAt') ).toJSON() ) ); 426 427 this.setTooltip( this.model.get( 'tooltipPosition' ) ); 428 }, 429 430 setTooltip: function( tooltipPosition ) { 431 432 var offset = $( '.revisions-buttons' ).offset().left, 433 calculatedX = tooltipPosition - offset; 434 //console.log(tooltipPosition); 435 //console.log(calculatedX); 436 437 this.$el.find( '.ui-slider-tooltip' ).css( 'left', calculatedX ); 438 this.$el.find( '.arrow' ).css( 'left', calculatedX ); 439 }, 440 441 442 }); 443 323 444 // The buttons view. 324 // Encapsulates all of the configuration for the previous/next buttons , and the compare checkbox.445 // Encapsulates all of the configuration for the previous/next buttons. 325 446 revisions.view.Buttons = wp.Backbone.View.extend({ 326 447 tagName: 'div', 327 448 className: 'revisions-buttons', 328 template: wp.template( 'revisions-controls'),449 template: wp.template( 'revisions-buttons' ), 329 450 330 451 initialize: function() { 331 this.$el.html( this.template() ) 452 this.$el.html( this.template() ); 332 453 }, 333 454 334 455 events: { 335 456 'click #next': 'nextRevision', 336 457 'click #previous': 'previousRevision' 337 458 }, 338 459 460 // Go to a specific modelindex, taking into account RTL mode. 339 461 gotoModel: function( toIndex ) { 340 462 var attributes = { 341 to: this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for R tl463 to: this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL. 342 464 }; 343 465 // If we're at the first revision, unset 'from'. 344 if ( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for R tl466 if ( isRtl ? this.model.revisions.length - toIndex - 1 : toIndex ) // Reverse directions for RTL 345 467 attributes.from = this.model.revisions.at( isRtl ? this.model.revisions.length - toIndex - 2 : toIndex - 1 ); 346 468 else 347 469 this.model.unset('from', { silent: true }); 348 470 349 471 this.model.set( attributes ); 472 473 // Update route 474 this.model.revisionsRouter.navigateRoute( attributes.to.id, attributes.from ? attributes.from.id : 0 ); 350 475 }, 351 476 477 // Go to the 'next' revision, direction takes into account RTL mode. 352 478 nextRevision: function() { 353 var toIndex = this.model.revisions.indexOf( this.model.get( 'to' ) );479 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 480 toIndex = isRtl ? toIndex - 1 : toIndex + 1; 355 481 this.gotoModel( toIndex ); 356 482 }, 357 483 484 // Go to the 'previous' revision, direction takes into account RTL mode. 358 485 previousRevision: function() { 359 var toIndex = this.model.revisions.indexOf( this.model.get('to') );486 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 487 toIndex = isRtl ? toIndex + 1 : toIndex - 1; 361 488 this.gotoModel( toIndex ); 362 489 }, … … 365 492 this.listenTo( this.model, 'change:diffId', this.disabledButtonCheck ); 366 493 }, 367 494 368 // Check to see if the Previous or Next buttons need to be disabled or enabled 495 // Check to see if the Previous or Next buttons need to be disabled or enabled. 369 496 disabledButtonCheck: function() { 370 var maxVal = isRtl ? 0 :this.model.revisions.length - 1,371 minVal = isRtl ? this.model.revisions.length - 1 :0,372 next 497 var maxVal = this.model.revisions.length - 1, 498 minVal = 0, 499 next = $( '.revisions-next .button' ), 373 500 previous = $( '.revisions-previous .button' ), 374 val 501 val = this.model.revisions.indexOf( this.model.get( 'to' ) ); 375 502 376 // Disable "Next" button if you're on the last node 503 // Disable "Next" button if you're on the last node. 377 504 if ( maxVal === val ) 378 505 next.prop( 'disabled', true ); 379 506 else 380 507 next.prop( 'disabled', false ); 381 508 382 // Disable "Previous" button if you're on the first node 509 // Disable "Previous" button if you're on the first node. 383 510 if ( minVal === val ) 384 511 previous.prop( 'disabled', true ); 385 512 else 386 513 previous.prop( 'disabled', false ); 387 }, 514 } 515 }); 388 516 389 517 390 });391 392 518 // The slider view. 393 519 // Encapsulates all of the configuration for the jQuery UI slider into a view. 394 520 revisions.view.Slider = wp.Backbone.View.extend({ 395 521 tagName: 'div', 396 522 className: 'wp-slider', 397 523 524 events: { 525 'mousemove' : 'mousemove', 526 'mouseenter' : 'mouseenter', 527 'mouseleave' : 'mouseleave' 528 }, 529 398 530 initialize: function() { 399 531 _.bindAll( this, 'start', 'slide', 'stop' ); 400 532 401 533 // Create the slider model from the provided collection data. 402 // TODO: This should actually pull from the model's `to` key.403 534 var latestRevisionIndex = this.model.revisions.length - 1; 404 535 405 536 // Find the initially selected revision 406 537 var initiallySelectedRevisionIndex = 407 this.model.revisions.indexOf( 538 this.model.revisions.indexOf( 408 539 this.model.revisions.findWhere( { id: Number( revisions.settings.selectedRevision ) } ) ); 409 540 410 541 this.settings = new revisions.model.Slider({ … … 418 549 419 550 ready: function() { 420 551 this.$el.slider( this.settings.toJSON() ); 552 553 // Listen for changes in Compare Two Mode setting 554 this.listenTo( this.model, 'change:compareTwoMode', this.updateSliderSettings ); 555 421 556 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 557 this.updateSliderSettings(); 424 558 }, this ); 425 // Reset to the initially selected revision426 this.slide( '', this.settings.attributes );427 559 428 560 // Listen for changes in the diffId 429 561 this.listenTo( this.model, 'change:diffId', this.diffIdChanged ); 430 562 563 // Reset to the initially selected revision 564 this.slide( '', this.settings.attributes ); 565 431 566 }, 432 567 568 mousemove: function( e ) { 569 var sliderLeft = Math.ceil( this.$el.offset().left ), 570 sliderWidth = Math.ceil( this.$el.width() ) + 2, 571 tickWidth = Math.ceil( ( sliderWidth ) / this.model.revisions.length ), 572 actualX = e.clientX - sliderLeft, 573 hoveringAt = Math.floor( actualX / tickWidth ); 574 575 // Reverse direction in Rtl mode. 576 if ( isRtl ) 577 hoveringAt = this.model.revisions.length - hoveringAt - 1; 578 579 // Ensure sane value for hoveringAt. 580 if ( hoveringAt < 0 ) 581 hoveringAt = 0; 582 else if ( hoveringAt >= this.model.revisions.length ) 583 hoveringAt = this.model.revisions.length - 1; 584 585 // Update the model 586 this.model.set( 'hoveringAt', hoveringAt ); 587 this.model.set( 'tooltipPosition', e.clientX ); 588 589 }, 590 591 mouseenter: function( e ) { 592 this.model.set( 'sliderHovering', true); 593 }, 594 595 mouseleave: function( e ) { 596 this.model.set( 'sliderHovering', false); 597 }, 598 599 updateSliderSettings: function() { 600 if ( isRtl ) { 601 this.$el.slider( { // Order reversed in RTL mode 602 value: this.model.revisions.length - this.model.revisions.indexOf( this.model.get( 'to' ) ) - 1 603 } ); 604 } else { 605 if ( this.model.get( 'compareTwoMode' ) ) { 606 this.$el.slider( { // Set handles to current from/to models 607 values: [ 608 this.model.revisions.indexOf( this.model.get( 'from' ) ), 609 this.model.revisions.indexOf( this.model.get( 'to' ) ) 610 ], 611 value: null, 612 range: true // Range mode ensures handles can't cross 613 } ); 614 } else { 615 this.$el.slider( { // Set handle to current to model 616 value: this.model.revisions.indexOf( this.model.get( 'to' ) ), 617 values: null, // Clear existing two handled values 618 range: false 619 } ); 620 } 621 } 622 if ( this.model.get( 'compareTwoMode' ) ){ 623 $( '.revisions' ).addClass( 'comparing-two-revisions' ); 624 625 // in RTL mode the 'left handle' is the second in the slider, 'right' is first 626 $( 'a.ui-slider-handle', this.$el ) 627 .first() 628 .addClass( isRtl ? 'right-handle' : 'left-handle' ) 629 .removeClass( isRtl ? 'left-handle' : 'right-handle' ); 630 $( 'a.ui-slider-handle', this.$el ) 631 .last() 632 .addClass( isRtl ? 'left-handle' : 'right-handle' ) 633 .removeClass( isRtl ? 'right-handle' : 'left-handle' ); 634 } else { 635 $( '.revisions' ).removeClass( 'comparing-two-revisions' ); 636 } 637 }, 638 433 639 diffIdChanged: function() { 434 640 // Reset the view settings when diffId is changed 435 this.settings.set( { 'value': this.model.revisions.indexOf( this.model.get( 'to' ) ) } ); 641 if ( this.model.get( 'compareTwoMode' ) ) { 642 this.settings.set( { 'values': [ 643 this.model.revisions.indexOf( this.model.get( 'from' ) ), 644 this.model.revisions.indexOf( this.model.get( 'to' ) ) 645 ] } ); 646 } else { 647 this.settings.set( { 'value': this.model.revisions.indexOf( this.model.get( 'to' ) ) } ); 648 } 436 649 }, 437 650 651 getSliderPosition: function( ui ){ 652 return isRtl ? this.model.revisions.length - ui.value - 1 : ui.value; 653 }, 654 438 655 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(); 656 if ( ! this.model.get( 'compareTwoMode' ) ) 657 return; 443 658 444 // Follow mouse movements, as long as handle remains inside slider 659 // Track the mouse position to enable smooth dragging, overrides default jquery ui step behaviour . 660 $( window ).mousemove( function( e ) { 661 var sliderLeft = this.$el.offset().left, 662 sliderRight = sliderLeft + this.$el.width(); 663 664 // Follow mouse movements, as long as handle remains inside slider. 445 665 if ( e.clientX < sliderLeft ) { 446 $( ui.handle ).css( 'left', 0 ); // Mouse to left of slider 666 $( ui.handle ).css( 'left', 0 ); // Mouse to left of slider. 447 667 } else if ( e.clientX > sliderRight ) { 448 $( ui.handle ).css( 'left', sliderRight - sliderLeft); // Mouse to right of slider 668 $( ui.handle ).css( 'left', sliderRight - sliderLeft); // Mouse to right of slider. 449 669 } else { 450 $( ui.handle ).css( 'left', e.clientX - sliderLeft ); // Mouse in slider 670 $( ui.handle ).css( 'left', e.clientX - sliderLeft ); // Mouse in slider. 451 671 } 452 } ); // End mousemove 672 } ); // End mousemove. 453 673 }, 454 674 455 675 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 }; 676 var attributes; 677 // Compare two revisions mode 678 if ( 'undefined' !== typeof ui.values && this.model.get( 'compareTwoMode' ) ) { 679 // Prevent sliders from occupying same spot 680 if ( ui.values[1] === ui.values[0] ) 681 return false; 459 682 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 }); 683 attributes = { 684 to: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[1] - 1 : ui.values[1] ), // Reverse directions for RTL. 685 from: this.model.revisions.at( isRtl ? this.model.revisions.length - ui.values[0] - 1 : ui.values[0] ) // Reverse directions for RTL. 686 }; 687 } else { 688 // Compare single revision mode 689 var sliderPosition = this.getSliderPosition( ui ); 690 attributes = { 691 to: this.model.revisions.at( sliderPosition ) 692 }; 465 693 694 // If we're at the first revision, unset 'from'. 695 if ( sliderPosition ) // Reverse directions for RTL. 696 attributes.from = this.model.revisions.at( sliderPosition - 1 ); 697 else 698 this.model.unset('from', { silent: true }); 699 } 466 700 this.model.set( attributes ); 701 702 // Maintain state history when dragging 703 this.model.revisionsRouter.navigateRoute( attributes.to.id, ( attributes.from ? attributes.from.id : 0 ) ); 467 704 }, 468 705 469 706 stop: function( event, ui ) { 470 $( window ).unbind( 'mousemove' ); // Stop tracking the mouse 471 // Reset settings pops handle back to the step position 707 if ( ! this.model.get( 'compareTwoMode' ) ) 708 return; 709 710 // Stop tracking the mouse. 711 $( window ).unbind( 'mousemove' ); 712 713 // Reset settings pops handle back to the step position. 472 714 this.settings.trigger( 'change' ); 473 715 } 474 716 }); … … 486 728 } 487 729 }); 488 730 731 // The revisions router 732 // takes URLs with #hash fragments and routes them 733 revisions.router.Router = Backbone.Router.extend({ 734 model: null, 735 736 routes: { 737 'revision/from/:from/to/:to/handles/:handles': 'gotoRevisionId' 738 }, 739 740 navigateRoute: function( to, from ) { 741 var navigateTo = '/revision/from/' + from + '/to/' + to + '/handles/'; 742 if ( this.model.get( 'compareTwoMode' ) ){ 743 navigateTo = navigateTo + '2'; 744 } else { 745 navigateTo = navigateTo + '1'; 746 } 747 this.navigate( navigateTo ); 748 }, 749 750 gotoRevisionId: function( from, to, handles ) { 751 if ( '2' === handles ) { 752 this.model.set( { compareTwoMode: true } ); 753 //console.log('compare 2'); 754 } else { 755 this.model.set( { compareTwoMode: false } ); 756 } 757 758 if ( 'undefined' !== typeof this.model ) { 759 var selectedToRevision = 760 this.model.revisions.findWhere( { 'id': Number( to ) } ), 761 selectedFromRevision = 762 this.model.revisions.findWhere( { 'id': Number( from ) } ); 763 764 this.model.set( { 765 to: selectedToRevision, 766 from: selectedFromRevision } ); 767 } 768 } 769 }); 770 489 771 // Initialize the revisions UI. 490 772 revisions.init = function() { 491 773 revisions.view.frame = new revisions.view.Frame({ 492 774 collection: new revisions.model.Revisions( revisions.settings.revisionData ) 493 775 }).render(); 776 // Only allow compare two mode if three or more revisions 494 777 }; 495 778 496 779 $( revisions.init ); -
wp-admin/revision.php
115 115 </div> 116 116 117 117 <script id="tmpl-revisions-frame" type="text/html"> 118 <span class="spinner"></span>119 118 <div class="revisions-control-frame"></div> 120 119 <div class="revisions-diff-frame"></div> 121 120 </script> 122 121 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 122 <script id="tmpl-revisions-buttons" type="text/html"> 132 123 <div class="revisions-previous"> 133 124 <input class="button" type="button" id="previous" value="<?php echo esc_attr_x( 'Previous', 'Button label for a previous revision' ); ?>" /> 134 125 </div> … … 138 129 </div> 139 130 </script> 140 131 132 <script id="tmpl-revisions-tooltip" type="text/html"> 133 <div class="ui-slider-tooltip ui-widget-content ui-corner-all ">Test 134 <# 135 if ( 'undefined' !== typeof data && 'undefined' !== typeof data.author ) { #> 136 {{{ data.author.avatar }}} {{{ data.name }}}, 137 {{{ data.timeAgo }}} <?php _e( 'ago' ); ?> 138 ({{{ data.dateShort }}}) 139 <# } #> </div> 140 <div class="arrow"></div> 141 </script> 141 142 143 <script id="tmpl-revisions-checkbox" type="text/html"> 144 <div class="revision-toggle-compare-mode"> 145 <label> 146 <input type="checkbox" class="compare-two-revisions" 147 <# 148 if( 'undefined' !== typeof data && data.model.attributes.compareTwoMode) { 149 #> checked="checked"<# 150 } 151 #> 152 /> 153 <?php esc_attr_e( 'Compare two revisions' ); ?> 154 </label> 155 </div> 156 </script> 157 142 158 <script id="tmpl-revisions-meta" type="text/html"> 143 159 <div id="diff-header"> 144 160 <div id="diff-header-from" class="diff-header"> … … 177 193 <# }); #> 178 194 </script> 179 195 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 196 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 <script id="tmpl-revision-ticks" type="text/html">221 <div class="revision-tick completed-{{{ data.completed }}} scope-of-changes-{{{ data.scopeOfChanges }}}">222 <span class="ui-slider-tooltip ui-widget-content ui-corner-all hidden"></span>223 </div>224 </script>225 197 <?php 226 198 require_once( './admin-footer.php' ); -
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
3498 3498 .revisions-controls { 3499 3499 height: 60px; 3500 3500 padding: 40px 0 20px; 3501 border-bottom: 1px solid #dfdfdf;3501 border-bottom: none; 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 { 3595 display: none; 3601 .revisions .ui-slider-tooltip { 3596 3602 position: absolute; 3597 bottom: 21px; 3598 margin-left: -74px; 3603 bottom: 86px; 3604 margin-left: -70px; 3605 line-height: 28px; 3599 3606 } 3600 3607 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 3608 #diff-title-to strong { 3608 3609 display: inline; 3609 3610 } … … 3655 3656 margin-top: 20px; 3656 3657 } 3657 3658 3658 .comparing-two-revisions#diff-previous-revision,3659 .comparing-two-revisions#diff-next-revision,3659 #diff-previous-revision, 3660 #diff-next-revision, 3660 3661 #diff-header-from { 3661 3662 display: none; 3662 3663 } … … 3668 3669 display: block; 3669 3670 } 3670 3671 3672 .comparing-two-revisions .revisions-tooltip div { 3673 margin-bottom: 30px; 3674 } 3671 3675 .diff-slider-ticks-wrapper { 3672 3676 margin: 0 auto; 3673 3677 text-align: left; … … 3740 3744 .ui-slider-tooltip img { 3741 3745 float: left; 3742 3746 margin-right: 5px; 3743 margin-top: 5px; 3747 margin-top: 2px; 3748 padding: 0; 3749 vertical-align: middle; 3744 3750 } 3745 3751 3746 3752 … … 3748 3754 3749 3755 .ui-tooltip, 3750 3756 .ui-slider-tooltip { 3751 padding: 8px;3757 padding: 4px; 3752 3758 position: absolute; 3753 3759 z-index: 9999; 3754 3760 max-width: 300px; … … 3768 3774 3769 3775 .ui-tooltip, 3770 3776 .ui-slider-tooltip { 3771 padding: 5px 10px;3777 padding: 4px 4px; 3772 3778 } 3773 3779 3780 .revisions-tooltip { 3781 display: none; 3782 } 3783 3774 3784 .arrow { 3775 3785 width: 70px; 3776 3786 height: 16px; 3777 3787 overflow: hidden; 3778 3788 position: absolute; 3779 left: 50%;3789 left: 0; 3780 3790 margin-left: -35px; 3781 bottom: -16px;3782 z-index: 99999;3791 bottom: 71px; 3792 z-index: 10000; 3783 3793 } 3784 3794 3785 3795 .arrow.top { … … 3871 3881 3872 3882 .wp-slider.ui-slider-horizontal { 3873 3883 height: .8em; 3884 z-index: 10001; 3874 3885 } 3875 3886 3876 3887 .wp-slider.ui-slider-horizontal .ui-slider-handle {