mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/RevisionSlider
synced 2024-11-15 03:33:45 +00:00
Merge "All connector-lines should be contained within the RevisionSlider"
This commit is contained in:
commit
fef3b044e5
|
@ -99,7 +99,12 @@
|
|||
drawLine: function () {
|
||||
var $upperLineDiv = this.$html.find( '.mw-revslider-pointer-line-upper' ),
|
||||
$lowerLineDiv = this.$html.find( '.mw-revslider-pointer-line-lower' ),
|
||||
$newerUnderLineDiv = this.$html.find( '.mw-revslider-pointer-line-underline' )
|
||||
.filter( '.mw-revslider-pointer-newer' ),
|
||||
$olderUnderLineDiv = this.$html.find( '.mw-revslider-pointer-line-underline' )
|
||||
.filter( '.mw-revslider-pointer-older' ),
|
||||
$sourcePointer = this.pointer.getView().getElement(),
|
||||
$table = $( '.diff-otitle' ),
|
||||
$targetColumn;
|
||||
|
||||
if ( this.offsetNotAvailable() ) {
|
||||
|
@ -110,10 +115,14 @@
|
|||
if ( this.pointer.getView().isUpperPointer() ) {
|
||||
$lowerLineDiv.removeClass( 'mw-revslider-lower-color' ).addClass( 'mw-revslider-upper-color' );
|
||||
$upperLineDiv.removeClass( 'mw-revslider-lower-color' ).addClass( 'mw-revslider-upper-color' );
|
||||
$newerUnderLineDiv.removeClass( 'mw-revslider-lower-color' ).addClass( 'mw-revslider-upper-color' );
|
||||
$olderUnderLineDiv.removeClass( 'mw-revslider-lower-color' ).addClass( 'mw-revslider-upper-color' );
|
||||
$targetColumn = $( '.diff-ntitle' );
|
||||
} else {
|
||||
$lowerLineDiv.removeClass( 'mw-revslider-upper-color' ).addClass( 'mw-revslider-lower-color' );
|
||||
$upperLineDiv.removeClass( 'mw-revslider-upper-color' ).addClass( 'mw-revslider-lower-color' );
|
||||
$olderUnderLineDiv.removeClass( 'mw-revslider-upper-color' ).addClass( 'mw-revslider-lower-color' );
|
||||
$newerUnderLineDiv.removeClass( 'mw-revslider-upper-color' ).addClass( 'mw-revslider-lower-color' );
|
||||
$targetColumn = $( '.diff-otitle' );
|
||||
}
|
||||
|
||||
|
@ -124,9 +133,35 @@
|
|||
if ( this.targetColumnIsRightFromPointer( $sourcePointer, $targetColumn ) ) {
|
||||
$upperLineDiv.addClass( 'mw-revslider-left-line' );
|
||||
$lowerLineDiv.addClass( 'mw-revslider-right-line' );
|
||||
|
||||
$( $newerUnderLineDiv ).css( {
|
||||
width: $table.width() + 'px',
|
||||
'margin-right': -$table.width() / 2 + 'px',
|
||||
'margin-left': 0,
|
||||
'float': 'right'
|
||||
} );
|
||||
$( $olderUnderLineDiv ).css( {
|
||||
width: $table.width() + 'px',
|
||||
'margin-right': -$table.width() / 2 + 'px',
|
||||
'margin-left': 0,
|
||||
'float': 'right'
|
||||
} );
|
||||
} else {
|
||||
$upperLineDiv.addClass( 'mw-revslider-right-line' );
|
||||
$lowerLineDiv.addClass( 'mw-revslider-left-line' );
|
||||
|
||||
$( $newerUnderLineDiv ).css( {
|
||||
width: $table.width() + 'px',
|
||||
'margin-left': -$table.width() / 2 + 'px',
|
||||
'margin-right': 0,
|
||||
'float': 'left'
|
||||
} );
|
||||
$( $olderUnderLineDiv ).css( {
|
||||
width: $table.width() + 'px',
|
||||
'margin-left': -$table.width() / 2 + 'px',
|
||||
'margin-right': 0,
|
||||
'float': 'left'
|
||||
} );
|
||||
}
|
||||
|
||||
return true;
|
||||
|
@ -140,7 +175,8 @@
|
|||
.addClass( 'mw-revslider-pointer-line ' + this.name )
|
||||
.append(
|
||||
$( '<div>' ).addClass( 'mw-revslider-pointer-line-upper ' + this.name ),
|
||||
$( '<div>' ).addClass( 'mw-revslider-pointer-line-lower ' + this.name )
|
||||
$( '<div>' ).addClass( 'mw-revslider-pointer-line-lower ' + this.name ),
|
||||
$( '<div>' ).addClass( 'mw-revslider-pointer-line-underline ' + this.name )
|
||||
);
|
||||
},
|
||||
|
||||
|
@ -184,6 +220,7 @@
|
|||
getElement: function () {
|
||||
return this.$html;
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
mw.libs.revisionSlider = mw.libs.revisionSlider || {};
|
||||
|
|
|
@ -12,6 +12,14 @@
|
|||
z-index: 8;
|
||||
}
|
||||
|
||||
.mw-revslider-container-expanded {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.mw-revslider-container-collapsed {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.mw-revslider-toggle-button {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
@ -357,10 +365,6 @@ of the frameless one (to fit the size of the toggle button */
|
|||
height: 27px;
|
||||
}
|
||||
|
||||
.mw-revslider-older-diff-column {
|
||||
border-top: 2px solid #fc3;
|
||||
}
|
||||
|
||||
.mw-revslider-newer-diff-column {
|
||||
border-top: 2px solid #1e6db8;
|
||||
.mw-revslider-pointer-line-underline {
|
||||
border-bottom: 2px solid;
|
||||
}
|
||||
|
|
|
@ -61,12 +61,16 @@
|
|||
|
||||
expand = function () {
|
||||
toggleButton.setIcon( 'collapse' ).setTitle( mw.message( 'revisionslider-toggle-title-collapse' ).text() );
|
||||
$( '.mw-revslider-container' ).removeClass( 'mw-revslider-container-collapsed' )
|
||||
.addClass( 'mw-revslider-container-expanded' );
|
||||
$( '.mw-revslider-slider-wrapper' ).show();
|
||||
expanded = true;
|
||||
},
|
||||
|
||||
collapse = function () {
|
||||
toggleButton.setIcon( 'expand' ).setTitle( mw.message( 'revisionslider-toggle-title-expand' ).text() );
|
||||
$( '.mw-revslider-container' ).removeClass( 'mw-revslider-container-expanded' )
|
||||
.addClass( 'mw-revslider-container-collapsed' );
|
||||
$( '.mw-revslider-slider-wrapper' ).hide();
|
||||
};
|
||||
|
||||
|
|
Loading…
Reference in a new issue