wikimedia/mediawiki-extensions-RevisionSlider
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/RevisionSlider synced 2024-11-14 19:24:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

Convert the few instances of IDs to classes

Browse source 
Makes for more modular code.

Change-Id: Ic71d7421aea548e5b4a9c4841cd4af49a3d385a5
This commit is contained in:
Ed Sanders 2016-07-02 21:14:00 +01:00
parent c1beb0e03a
commit f6a44f43fe
11 changed files with 42 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
RevisionSlider.hooks.php
View file

@ -68,7 +68,6 @@ class RevisionSliderHooks {
'button' => $button,
'labelElement' => $label,
'iconElement' => $icon,
'id' => 'mw-revslider-slider-toggle',
'classes' => [ 'mw-revslider-toggle-button' ],
'infusable' => true,
'framed' => false,
@ -80,20 +79,20 @@ class RevisionSliderHooks {
Html::rawElement(
'div',
[
'id' => 'mw-revslider-container',
'class' => 'mw-revslider-container',
'style' => 'border: 1px solid #cccccc;'
],
$toggleButton .
Html::rawElement(
'div',
[
'id' => 'mw-revslider-slider-wrapper',
'class' => 'mw-revslider-slider-wrapper',
'style' => 'min-height: 142px; display: none; border-top: 1px solid #cccccc;',
],
Html::element(
'p',
[
'id' => 'mw-revslider-placeholder',
'class' => 'mw-revslider-placeholder',
'style' => 'text-align: center',
],
( new Message( 'revisionslider-loading-placeholder' ) )->text()

6
modules/ext.RevisionSlider.DiffPage.js
View file

@ -26,19 +26,19 @@
$( 'table.diff[data-mw="interface"]' )
.append( $( '<tr>' ) )
.append( $( '<td>' ) )
.append( $( '<div>' ).attr( 'id', 'mw-revslider-darkness' ) );
.append( $( '<div>' ).addClass( 'mw-revslider-darkness' ) );
$.ajax( {
url: mw.util.wikiScript( 'index' ),
data: data,
tryCount: 0,
retryLimit: 2,
success: function ( data ) {
var $container = $( '#mw-revslider-container' ),
var $container = $( '.mw-revslider-container' ),
$contentText = $( '#mw-content-text' ),
scrollLeft = $container.find( '.mw-revslider-revisions-container' ).scrollLeft();
data = $( data );
data.find( '#mw-revslider-container' )
data.find( '.mw-revslider-container' )
.replaceWith( $container );
$contentText.html( data.find( '#mw-content-text' ) )
.find( '.mw-revslider-revisions-container' ).scrollLeft( scrollLeft );

10
modules/ext.RevisionSlider.HelpDialog.js
View file

@ -21,11 +21,11 @@
label: mw.msg( 'revisionslider-next-dialog' ),
flags: [ 'primary', 'progressive' ],
modes: [ 'initial', 'middle' ],
id: 'revisionslider-help-next'
classes: [ 'revisionslider-help-next' ]
},
{ action: 'previous', flags: 'safe', label: mw.msg( 'revisionslider-previous-dialog' ), modes: [ 'middle', 'last' ], id: 'revisionslider-help-previous' },
{ label: mw.msg( 'revisionslider-close-dialog' ), flags: 'safe', modes: 'initial', id: 'revisionslider-help-close-start' },
{ label: mw.msg( 'revisionslider-close-dialog' ), flags: 'primary', modes: 'last', id: 'revisionslider-help-close-end' }
{ action: 'previous', flags: 'safe', label: mw.msg( 'revisionslider-previous-dialog' ), modes: [ 'middle', 'last' ], classes: [ 'revisionslider-help-previous' ] },
{ label: mw.msg( 'revisionslider-close-dialog' ), flags: 'safe', modes: 'initial', classes: [ 'revisionslider-help-close-start' ] },
{ label: mw.msg( 'revisionslider-close-dialog' ), flags: 'primary', modes: 'last', classes: [ 'revisionslider-help-close-end' ] }
];
$.extend( HelpDialog.prototype, {
@ -165,7 +165,7 @@
*/
HelpDialog.show = function () {
var windowManager = new OO.ui.WindowManager(),
dialogue = new HelpDialog( { size: 'medium', id: 'revisionslider-help-dialog' } );
dialogue = new HelpDialog( { size: 'medium', classes: [ 'revisionslider-help-dialog' ] } );
$( 'body' ).append( windowManager.$element );
windowManager.addWindows( [ dialogue ] );

6
modules/ext.RevisionSlider.Pointer.js
View file

@ -2,11 +2,11 @@
/**
* Module containing logic for the revision pointers
*
* @param {string} id
* @param {string} name
* @constructor
*/
var Pointer = function ( id ) {
this.view = new mw.libs.revisionSlider.PointerView( this, id );
var Pointer = function ( name ) {
this.view = new mw.libs.revisionSlider.PointerView( this, name );
};
$.extend( Pointer.prototype, {

11
modules/ext.RevisionSlider.PointerView.js
View file

@ -3,19 +3,19 @@
* Module containing presentation logic for the revision pointers
*
* @param {Pointer} pointer
* @param {string} id
* @param {string} name
* @constructor
*/
var PointerView = function ( pointer, id ) {
var PointerView = function ( pointer, name ) {
this.pointer = pointer;
this.id = id;
this.name = name;
};
$.extend( PointerView.prototype, {
/**
* @type {string}
*/
id: '',
name: '',
/**
* @type {Pointer}
@ -32,8 +32,7 @@
*/
initialize: function () {
this.$html = $( '<div>' )
.attr( 'id', this.id )
.addClass( 'mw-revslider-pointer mw-revslider-pointer-cursor' );
.addClass( 'mw-revslider-pointer mw-revslider-pointer-cursor ' + this.name );
},
/**

3
modules/ext.RevisionSlider.RevisionListView.js
View file

@ -148,8 +148,7 @@
tooltip.$element.css( {
left: $rev.offset().left + this.revisionWidth / 2 + 'px',
top: $rev.offset().top + $rev.outerHeight() + 'px'
} );
tooltip.$element.attr( 'id', 'mw-revslider-revision-tooltip-' + pos );
} ).addClass( 'mw-revslider-revision-tooltip-' + pos );
$( 'body' ).append( tooltip.$element );
tooltip.toggle( true );

2
modules/ext.RevisionSlider.SliderView.js
View file

@ -567,7 +567,7 @@
* @return {Pointer}
*/
whichPointer: function ( $e ) {
return $e.attr( 'id' ) === 'mw-revslider-pointer-older' ? this.pointerOlder : this.pointerNewer;
return $e.hasClass( 'mw-revslider-pointer-older' ) ? this.pointerOlder : this.pointerNewer;
},
/**

8
modules/ext.RevisionSlider.css
View file

@ -1,13 +1,11 @@
/* stylelint-disable selector-no-id */
/* TODO: No need to use IDs, they should be replaced with classes */
#mw-revslider-container {
.mw-revslider-container {
/* This will flip with CSSJanus in case */
/* the interface is in RTL */
direction: ltr;
position: relative;
}
#mw-revslider-slider-wrapper {
.mw-revslider-slider-wrapper {
padding: 10px;
}
@ -213,7 +211,7 @@
float: right;
}
#mw-revslider-darkness {
.mw-revslider-darkness {
background-color: #fff;
filter: alpha( opacity=50 ); /* IE 5-7 */
-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)'; /* IE 8 */

12
modules/ext.RevisionSlider.init.js
View file

@ -2,7 +2,7 @@
var expanded = false,
initialized = false,
/*jshint -W024 */
toggleButton = OO.ui.ButtonWidget.static.infuse( 'mw-revslider-slider-toggle' ),
toggleButton = OO.ui.ButtonWidget.static.infuse( $( '.mw-revslider-toggle-button' ) ),
/*jshint +W024 */
initialize = function () {
var startTime = mw.now(),
@ -29,7 +29,7 @@
revisionList = new mw.libs.revisionSlider.RevisionList( mw.libs.revisionSlider.makeRevisions( revs ) );
$container = $( '#mw-revslider-slider-wrapper' );
$container = $( '.mw-revslider-slider-wrapper' );
slider = new mw.libs.revisionSlider.Slider( revisionList );
slider.getView().render( $container );
@ -38,10 +38,10 @@
( new mw.Api() ).saveOption( 'userjs-revslider-hidehelp', true );
}
$( '#mw-revslider-placeholder' ).remove();
$( '.mw-revslider-placeholder' ).remove();
mw.track( 'timing.MediaWiki.RevisionSlider.timing.init', mw.now() - startTime );
} catch ( err ) {
$( '#mw-revslider-placeholder' )
$( '.mw-revslider-placeholder' )
.text( mw.message( 'revisionslider-loading-failed' ).text() );
console.log( err );
mw.track( 'counter.MediaWiki.RevisionSlider.error.init' );
@ -50,7 +50,7 @@
initialized = true;
},
error: function ( err ) {
$( '#mw-revslider-placeholder' )
$( '.mw-revslider-placeholder' )
.text( mw.message( 'revisionslider-loading-failed' ).text() );
console.log( err );
mw.track( 'counter.MediaWiki.RevisionSlider.error.init' );
@ -63,7 +63,7 @@
toggleButton.connect( this, {
click: function () {
expanded = !expanded;
$( '#mw-revslider-slider-wrapper' ).toggle();
$( '.mw-revslider-slider-wrapper' ).toggle();
if ( expanded ) {
toggleButton.setIcon( 'collapse' ).setTitle( mw.message( 'revisionslider-toggle-title-collapse' ).text() );
mw.track( 'counter.MediaWiki.RevisionSlider.event.expand' );

4
modules/ext.RevisionSlider.noscript.css
View file

@ -1,5 +1,3 @@
/* stylelint-disable selector-no-id */
/* TODO: No need to use IDs, they should be replaced with classes */
.client-nojs #mw-revslider-container {
.client-nojs .mw-revslider-container {
display: none;
}

22
tests/browser/features/support/pages/diff_page.rb
View file

@ -1,17 +1,17 @@
class DiffPage
include PageObject
p(:revisionslider_placeholder, id: 'mw-revslider-placeholder')
div(:revisionslider_wrapper, id: 'mw-revslider-slider-wrapper')
div(:revisionslider_toggle_button, id: 'mw-revslider-slider-toggle')
div(:revisionslider_darkness, id: 'mw-revslider-darkness')
p(:revisionslider_placeholder, css: '.mw-revslider-placeholder')
div(:revisionslider_wrapper, css: '.mw-revslider-slider-wrapper')
div(:revisionslider_toggle_button, css: '.mw-revslider-toggle-button')
div(:revisionslider_darkness, css: '.mw-revslider-darkness')
div(:revisionslider_help_dialog, id: 'revisionslider-help-dialog')
button(:revisionslider_help, css: '#mw-revision-slider-container > button')
a(:revisionslider_help_next, css: '#revisionslider-help-next > a')
a(:revisionslider_help_previous, css: '#revisionslider-help-previous > a')
a(:revisionslider_help_close_start, css: '#revisionslider-help-close-start > a')
a(:revisionslider_help_close_end, css: '#revisionslider-help-close-end > a')
div(:revisionslider_help_dialog, css: '.revisionslider-help-dialog')
button(:revisionslider_help, css: '.mw-revision-slider-container > button')
a(:revisionslider_help_next, css: '.revisionslider-help-next > a')
a(:revisionslider_help_previous, css: '.revisionslider-help-previous > a')
a(:revisionslider_help_close_start, css: '.revisionslider-help-close-start > a')
a(:revisionslider_help_close_end, css: '.revisionslider-help-close-end > a')
div(:revisionslider_timeline_backwards, css: '.mw-revslider-arrow.mw-revslider-arrow-backwards')
div(:revisionslider_timeline_forwards, css: '.mw-revslider-arrow.mw-revslider-arrow-forwards')
@ -27,7 +27,7 @@ class DiffPage
end
def revisionslider_tooltip(index = 1)
element('div', id: 'mw-revslider-revision-tooltip-' + index.to_s)
element('div', css: '.mw-revslider-revision-tooltip-' + index.to_s)
end