mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer
synced 2024-11-23 15:56:47 +00:00
Remove unused code from mmv.ui
Bug: T77349 Change-Id: I9e26dc68859d9dca3c6066837253e85a19039ce0
This commit is contained in:
Derk-Jan Hartman
Jdlrobson
parent
5b89420182
commit
f592eeea3b
|
|
@ -2,7 +2,7 @@
|
|||
"modules": [
|
||||
{
|
||||
"resourceModule": "mmv",
|
||||
"maxSize": "30.0 kB"
|
||||
"maxSize": "28.8 kB"
|
||||
},
|
||||
{
|
||||
"resourceModule": "mmv.ui.restriction",
|
||||
|
|
|
|||
|
|
@ -16,8 +16,6 @@
|
|||
*/
|
||||
|
||||
( function () {
|
||||
let cachedRTL;
|
||||
|
||||
/**
|
||||
* Represents a UI element.
|
||||
*
|
||||
|
|
@ -35,33 +33,6 @@
|
|||
|
||||
/** @property {Object.<string, string[]>} eventsRegistered Events that this element has registered with the DOM. */
|
||||
this.eventsRegistered = {};
|
||||
|
||||
/**
|
||||
* @property {Object.<string, jQuery>} $inlineStyles a list of `<style>` elements in the head
|
||||
* which we use to manipulate pseudo-classes and pseudo-elements.
|
||||
*/
|
||||
this.$inlineStyles = [];
|
||||
|
||||
/**
|
||||
* Stores named timeouts. See setTimer().
|
||||
*
|
||||
* @private
|
||||
* @property {Object.<string, {timeout: Object, handler: function(), delay: number}>}
|
||||
*/
|
||||
this.timers = {};
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks whether the document is RTL. Assumes it doesn't change.
|
||||
*
|
||||
* @return {boolean}
|
||||
*/
|
||||
isRTL() {
|
||||
if ( cachedRTL === undefined ) {
|
||||
cachedRTL = $( document.body ).hasClass( 'rtl' );
|
||||
}
|
||||
|
||||
return cachedRTL;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -123,108 +94,6 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Manipulate CSS directly. This is needed to set styles for pseudo-classes and pseudo-elements.
|
||||
*
|
||||
* @param {string} key some name to identify the style
|
||||
* @param {string|null} style a CSS snippet (set to null to delete the given style)
|
||||
*/
|
||||
setInlineStyle( key, style ) {
|
||||
|
||||
if ( !this.$inlineStyles ) {
|
||||
this.$inlineStyles = [];
|
||||
}
|
||||
|
||||
if ( !this.$inlineStyles[ key ] ) {
|
||||
if ( !style ) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.$inlineStyles[ key ] = $( '<style>' ).attr( 'type', 'text/css' ).appendTo( 'head' );
|
||||
}
|
||||
|
||||
this.$inlineStyles[ key ].html( style || '' );
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets a timer. This is a shortcut to using the native setTimout and then storing
|
||||
* the reference, with some small differences for convenience:
|
||||
* - setting the same timer again clears the old one
|
||||
* - callbacks have the element as their context
|
||||
* Timers are local to the element.
|
||||
* See also clearTimer() and resetTimer().
|
||||
*
|
||||
* @param {string} name
|
||||
* @param {function()} callback
|
||||
* @param {number} delay delay in milliseconds
|
||||
*/
|
||||
setTimer( name, callback, delay ) {
|
||||
this.clearTimer( name );
|
||||
this.timers[ name ] = {
|
||||
timeout: null,
|
||||
handler: callback,
|
||||
delay: delay
|
||||
};
|
||||
this.timers[ name ].timeout = setTimeout( () => {
|
||||
delete this.timers[ name ];
|
||||
callback.call( this );
|
||||
}, delay );
|
||||
}
|
||||
|
||||
/**
|
||||
* Clears a timer. See setTimer().
|
||||
*
|
||||
* @param {string} name
|
||||
*/
|
||||
clearTimer( name ) {
|
||||
if ( name in this.timers ) {
|
||||
clearTimeout( this.timers[ name ].timeout );
|
||||
delete this.timers[ name ];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Resets a timer, so that its delay will be relative to when resetTimer() was called, not when
|
||||
* the timer was created. Optionally changes the delay as well.
|
||||
* Resetting a timer that does not exist or has already fired has no effect.
|
||||
* See setTimer().
|
||||
*
|
||||
* @param {string} name
|
||||
* @param {number} [delay] delay in milliseconds
|
||||
*/
|
||||
resetTimer( name, delay ) {
|
||||
if ( name in this.timers ) {
|
||||
if ( delay === undefined ) {
|
||||
delay = this.timers[ name ].delay;
|
||||
}
|
||||
this.setTimer( name, this.timers[ name ].handler, delay );
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Flips E (east) and W (west) directions in RTL documents.
|
||||
*
|
||||
* @param {string} keyword a keyword where the first 'e' or 'w' character means a direction (such as a
|
||||
* tipsy gravity parameter)
|
||||
* @return {string}
|
||||
*/
|
||||
correctEW( keyword ) {
|
||||
if ( this.isRTL() ) {
|
||||
keyword = keyword.replace( /[ew]/i, ( dir ) => {
|
||||
if ( dir === 'e' ) {
|
||||
return 'w';
|
||||
} else if ( dir === 'E' ) {
|
||||
return 'W';
|
||||
} else if ( dir === 'w' ) {
|
||||
return 'e';
|
||||
} else if ( dir === 'W' ) {
|
||||
return 'E';
|
||||
}
|
||||
} );
|
||||
}
|
||||
return keyword;
|
||||
}
|
||||
}
|
||||
|
||||
OO.mixinClass( UiElement, OO.EventEmitter );
|
||||
|
|
|
|||
|
|
@ -21,91 +21,4 @@ const { UiElement } = require( 'mmv' );
|
|||
$( document ).trigger( new $.Event( 'mmv-foo' ) );
|
||||
} );
|
||||
|
||||
QUnit.test( 'setInlineStyle()', function ( assert ) {
|
||||
const element = new UiElement( $( '<div>' ) );
|
||||
const $testDiv = $( '<div>' ).attr( 'id', 'mmv-testdiv' ).text( '!!!' ).appendTo( '#qunit-fixture' );
|
||||
|
||||
assert.true( $testDiv.is( ':visible' ), 'Test div is visible' );
|
||||
|
||||
element.setInlineStyle( 'test', '#mmv-testdiv { display: none; }' );
|
||||
|
||||
assert.strictEqual( $testDiv.is( ':visible' ), false, 'Test div is hidden by inline style' );
|
||||
|
||||
element.setInlineStyle( 'test', null );
|
||||
|
||||
assert.strictEqual( $testDiv.is( ':visible' ), true, 'Test div is visible again' );
|
||||
} );
|
||||
|
||||
QUnit.test( 'setTimer()/clearTimer()/resetTimer()', function ( assert ) {
|
||||
const element = new UiElement( $( '<div>' ) );
|
||||
const element2 = new UiElement( $( '<div>' ) );
|
||||
let spy = this.sandbox.spy();
|
||||
let spy2 = this.sandbox.spy();
|
||||
|
||||
element.setTimer( 'foo', spy, 10 );
|
||||
this.clock.tick( 100 );
|
||||
assert.strictEqual( spy.called, true, 'Timeout callback was called' );
|
||||
assert.strictEqual( spy.calledOnce, true, 'Timeout callback was called once' );
|
||||
assert.strictEqual( spy.calledOn( element ), true, 'Timeout callback was called on the element' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 10 );
|
||||
element.setTimer( 'foo', spy2, 20 );
|
||||
this.clock.tick( 100 );
|
||||
assert.strictEqual( spy.called, false, 'Old timeout callback was not called after update' );
|
||||
assert.strictEqual( spy2.called, true, 'New timeout callback was called after update' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
spy2 = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 10 );
|
||||
element.setTimer( 'bar', spy2, 20 );
|
||||
this.clock.tick( 100 );
|
||||
assert.strictEqual( spy.called && spy2.called, true, 'Timeouts with different names do not conflict' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
spy2 = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 10 );
|
||||
element2.setTimer( 'foo', spy2, 20 );
|
||||
this.clock.tick( 100 );
|
||||
assert.strictEqual( spy.called && spy2.called, true, 'Timeouts in different elements do not conflict' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 10 );
|
||||
element.clearTimer( 'foo' );
|
||||
this.clock.tick( 100 );
|
||||
assert.strictEqual( spy.called, false, 'Timeout is invalidated by clearing' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 100 );
|
||||
this.clock.tick( 80 );
|
||||
element.resetTimer( 'foo' );
|
||||
this.clock.tick( 80 );
|
||||
assert.strictEqual( spy.called, false, 'Timeout is reset' );
|
||||
this.clock.tick( 80 );
|
||||
assert.strictEqual( spy.called, true, 'Timeout works after reset' );
|
||||
|
||||
spy = this.sandbox.spy();
|
||||
element.setTimer( 'foo', spy, 100 );
|
||||
this.clock.tick( 80 );
|
||||
element.resetTimer( 'foo', 200 );
|
||||
this.clock.tick( 180 );
|
||||
assert.strictEqual( spy.called, false, 'Timeout is reset to the designated delay' );
|
||||
this.clock.tick( 80 );
|
||||
assert.strictEqual( spy.called, true, 'Timeout works after changing the delay' );
|
||||
} );
|
||||
|
||||
QUnit.test( 'correctEW()', function ( assert ) {
|
||||
const element = new UiElement( $( '<div>' ) );
|
||||
|
||||
element.isRTL = this.sandbox.stub().returns( true );
|
||||
|
||||
assert.strictEqual( element.correctEW( 'e' ), 'w', 'e (east) is flipped' );
|
||||
assert.strictEqual( element.correctEW( 'ne' ), 'nw', 'ne (northeast) is flipped' );
|
||||
assert.strictEqual( element.correctEW( 'W' ), 'E', 'uppercase is flipped' );
|
||||
assert.strictEqual( element.correctEW( 's' ), 's', 'non-horizontal directions are ignored' );
|
||||
|
||||
element.isRTL.returns( false );
|
||||
|
||||
assert.strictEqual( element.correctEW( 'e' ), 'e', 'no flipping in LTR documents' );
|
||||
} );
|
||||
}() );
|
||||
|
|
|
|||
Loading…
Reference in a new issue