wikimedia/mediawiki-extensions-MultimediaViewer
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/MultimediaViewer synced 2024-11-23 15:56:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

Hide next/prev buttons when there is only one image

Browse source 
In addition, prefer `this.ui` over passing `ui` as method argument.

In addition, hide the next/prev buttons while loading.

Bug: T77877
Change-Id: I316687f1a180605c6014e93d963ce9e5fd325850
This commit is contained in:
Simon Legner 2024-10-21 18:43:25 +02:00
parent 81abf7ba8b
commit 9eb3439d1b
3 changed files with 16 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
resources/mmv/mmv.js
View file

@ -135,44 +135,40 @@ class MultimediaViewer {
/**
* Handles resize events in viewer.
*
* @protected
* @param {LightboxInterface} ui lightbox that got resized
*/
resize( ui ) {
resize() {
const image = this.thumbs[ this.currentIndex ];
const ext = this.thumbs[ this.currentIndex ].filePageTitle.getExtension().toLowerCase();
this.preloadThumbnails();
if ( image ) {
const imageWidths = ui.canvas.getCurrentImageWidths();
const imageWidths = this.ui.canvas.getCurrentImageWidths();
this.fetchThumbnailForLightboxImage(
image, imageWidths.real
).then( ( thumbnail, image2 ) => {
// eslint-disable-next-line mediawiki/class-doc
image2.className = ext;
this.setImage( ui, thumbnail, image2, imageWidths );
this.setImage( thumbnail, image2, imageWidths );
}, ( error ) => {
this.ui.canvas.showError( error );
} );
}
this.ui.updateControls();
this.ui.updateControls( this.thumbs.length > 1 );
}
/**
* Loads and sets the specified image. It also updates the controls.
*
* @param {LightboxInterface} ui image container
* @param {Thumbnail} thumbnail thumbnail information
* @param {HTMLImageElement} imageElement
* @param {ThumbnailWidth} imageWidths
*/
setImage( ui, thumbnail, imageElement, imageWidths ) {
ui.canvas.setImageAndMaxDimensions( thumbnail, imageElement, imageWidths );
this.ui.updateControls();
setImage( thumbnail, imageElement, imageWidths ) {
this.ui.canvas.setImageAndMaxDimensions( thumbnail, imageElement, imageWidths );
this.ui.updateControls( this.thumbs.length > 1 );
}
/**
@ -338,7 +334,7 @@ class MultimediaViewer {
*/
displayRealThumbnail( thumbnail, imageElement, imageWidths ) {
this.realThumbnailShown = true;
this.setImage( this.ui, thumbnail, imageElement, imageWidths );
this.setImage( thumbnail, imageElement, imageWidths );
this.viewLogger.attach( thumbnail.url );
}
@ -791,7 +787,7 @@ class MultimediaViewer {
$( document ).on( 'mmv-close.mmvp', () => {
this.close();
} ).on( 'mmv-resize-end.mmvp', () => {
this.resize( this.ui );
this.resize();
} ).on( 'mmv-request-thumbnail.mmvp', ( e, size ) => {
if ( this.currentImage && this.currentImage.filePageTitle ) {
return this.thumbnailInfoProvider.get( this.currentImage.filePageTitle, this.currentImage.src, size );

5
resources/mmv/mmv.lightboxinterface.js
View file

@ -477,8 +477,10 @@ class LightboxInterface extends UiElement {
/**
* Updates the next and prev buttons
*
* @param {boolean} showPrevNext Show prev/next button
*/
updateControls() {
updateControls( showPrevNext ) {
const prevNextTop = `${ ( this.$imageWrapper.height() - 60 ) / 2 }px`;
if ( this.isFullscreen ) {
@ -488,6 +490,7 @@ class LightboxInterface extends UiElement {
}
this.buttons.setOffset( prevNextTop );
this.buttons.$nav.toggle( showPrevNext );
}
/**

5
resources/mmv/ui/mmv.ui.canvasButtons.js
View file

@ -57,7 +57,8 @@ class CanvasButtons extends UiElement {
.append( $( '<span>' ).addClass( 'mw-mmv-icon' ) );
this.$nav = this.$next
.add( this.$prev );
.add( this.$prev )
.hide();
this.$buttons = this.$close
.add( this.$download )
@ -69,7 +70,7 @@ class CanvasButtons extends UiElement {
this.$buttons.appendTo( this.$container );
$( document ).on( 'mmv-close', () => {
this.$nav.addClass( 'disabled' );
this.$nav.hide();
} );
this.$close.on( 'click', () => {