Thijs/wiki.techinc.nl
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rename 'slider' gallery mode to 'slideshow'

Browse source 
Bug: T140093
Change-Id: I6f01344b9ac61e3d2a8e7a9d920ba37786537ff8
This commit is contained in:
Ed Sanders 2016-07-12 14:48:58 +01:00
parent 5726c9ceb0
commit af7ffaeeec
8 changed files with 50 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
RELEASE-NOTES-1.28
View file

@ -19,7 +19,7 @@ production.
=== New features in 1.28 ===
* User::isBot() method for checking if an account is a bot role account.
* Added a new 'slider' mode for galleries.
* Added a new 'slideshow' mode for galleries.
* Added a new hook, 'UserIsBot', to aid in determining if a user is a bot.
* Added a new hook, 'ApiMakeParserOptions', to allow extensions to better
interact with API parsing.

2
autoload.php
View file

@ -1260,7 +1260,7 @@ $wgAutoloadLocalClasses = [
'SkinFallback' => __DIR__ . '/includes/skins/SkinFallback.php',
'SkinFallbackTemplate' => __DIR__ . '/includes/skins/SkinFallbackTemplate.php',
'SkinTemplate' => __DIR__ . '/includes/skins/SkinTemplate.php',
'SliderImageGallery' => __DIR__ . '/includes/gallery/SliderImageGallery.php',
'SlideshowImageGallery' => __DIR__ . '/includes/gallery/SlideshowImageGallery.php',
'SpecialActiveUsers' => __DIR__ . '/includes/specials/SpecialActiveusers.php',
'SpecialAllMessages' => __DIR__ . '/includes/specials/SpecialAllMessages.php',
'SpecialAllMyUploads' => __DIR__ . '/includes/specials/SpecialMyRedirectPages.php',

2
includes/gallery/ImageGalleryBase.php
View file

@ -113,7 +113,7 @@ abstract class ImageGalleryBase extends ContextSource {
'packed' => 'PackedImageGallery',
'packed-hover' => 'PackedHoverImageGallery',
'packed-overlay' => 'PackedOverlayImageGallery',
'slider' => 'SliderImageGallery',
'slideshow' => 'SlideshowImageGallery',
];
// Allow extensions to make a new gallery format.
Hooks::run( 'GalleryGetModes', [ &self::$modeMapping ] );

6
includes/gallery/SliderImageGallery.php → includes/gallery/SlideshowImageGallery.php
View file

@ -1,6 +1,6 @@
<?php
/**
* Slider gallery shows one image at a time with controls to move around.
* A slideshow gallery shows one image at a time with controls to move around.
*
* This program is free software; you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
@ -20,7 +20,7 @@
* @file
*/
class SliderImageGallery extends TraditionalImageGallery {
class SlideshowImageGallery extends TraditionalImageGallery {
function __construct( $mode = 'traditional', IContextSource $context = null ) {
parent::__construct( $mode, $context );
// Does not support per row option.
@ -32,6 +32,6 @@ class SliderImageGallery extends TraditionalImageGallery {
* @return array
*/
protected function getModules() {
return [ 'mediawiki.page.gallery.slider' ];
return [ 'mediawiki.page.gallery.slideshow' ];
}
}

2
maintenance/jsduck/categories.json
View file

@ -65,7 +65,7 @@
"mw.Upload*",
"mw.ForeignUpload",
"mw.ForeignStructuredUpload*",
"mw.GallerySlider"
"mw.GallerySlideshow"
]
},
{

4
resources/Resources.php
View file

@ -1655,8 +1655,8 @@ return [
'position' => 'top',
'targets' => [ 'desktop', 'mobile' ],
],
'mediawiki.page.gallery.slider' => [
'scripts' => 'resources/src/mediawiki/page/gallery-slider.js',
'mediawiki.page.gallery.slideshow' => [
'scripts' => 'resources/src/mediawiki/page/gallery-slideshow.js',
'position' => 'top',
'dependencies' => [
'mediawiki.api',

60
resources/src/mediawiki/page/gallery-slider.js → resources/src/mediawiki/page/gallery-slideshow.js
View file

@ -1,18 +1,18 @@
/*!
* mw.GallerySlider: Interface controls for the slider gallery
* mw.GallerySlideshow: Interface controls for the slideshow gallery
*/
( function ( mw, $, OO ) {
/**
* mw.GallerySlider encapsulates the user interface of the slider
* galleries. An object is instantiated for each `.mw-gallery-slider`
* mw.GallerySlideshow encapsulates the user interface of the slideshow
* galleries. An object is instantiated for each `.mw-gallery-slideshow`
* element.
*
* @class mw.GallerySlider
* @class mw.GallerySlideshow
* @uses mw.Title
* @uses mw.Api
* @param {jQuery} gallery The `<ul>` element of the gallery.
*/
mw.GallerySlider = function ( gallery ) {
mw.GallerySlideshow = function ( gallery ) {
// Properties
this.$gallery = $( gallery );
this.$galleryCaption = this.$gallery.find( '.gallerycaption' );
@ -106,13 +106,13 @@
*/
/* Setup */
OO.initClass( mw.GallerySlider );
OO.initClass( mw.GallerySlideshow );
/* Methods */
/**
* Draws the carousel and the interface around it.
*/
mw.GallerySlider.prototype.drawCarousel = function () {
mw.GallerySlideshow.prototype.drawCarousel = function () {
var next, prev, toggle, interfaceElements, carouselStack;
this.$carousel = $( '<li>' ).addClass( 'gallerycarousel' );
@ -135,7 +135,7 @@
interfaceElements = new OO.ui.PanelLayout( {
expanded: false,
classes: [ 'mw-gallery-slider-buttons' ],
classes: [ 'mw-gallery-slideshow-buttons' ],
$content: $( '<div>' ).append(
prev.$element,
toggle.$element,
@ -147,9 +147,9 @@
// Containers for the current image, caption etc.
this.$img = $( '<img>' );
this.$imgLink = $( '<a>' ).append( this.$img );
this.$imgCaption = $( '<p>' ).attr( 'class', 'mw-gallery-slider-caption' );
this.$imgCaption = $( '<p>' ).attr( 'class', 'mw-gallery-slideshow-caption' );
this.$imgContainer = $( '<div>' )
.attr( 'class', 'mw-gallery-slider-img-container' )
.attr( 'class', 'mw-gallery-slideshow-img-container' )
.append( this.$imgLink );
carouselStack = new OO.ui.StackLayout( {
@ -183,7 +183,7 @@
* {@link #imageInfoCache} as we'll now need URLs for a different
* size.
*/
mw.GallerySlider.prototype.setSizeRequirement = function () {
mw.GallerySlideshow.prototype.setSizeRequirement = function () {
var w, h;
if ( this.$container !== undefined ) {
@ -207,7 +207,7 @@
* Gets the height of the interface elements and the
* gallery's caption.
*/
mw.GallerySlider.prototype.getChromeHeight = function () {
mw.GallerySlideshow.prototype.getChromeHeight = function () {
return this.$interface.outerHeight() + this.$galleryCaption.outerHeight();
};
@ -218,7 +218,7 @@
*
* @return {boolean} Whether or not the image was sized.
*/
mw.GallerySlider.prototype.setImageSize = function () {
mw.GallerySlideshow.prototype.setImageSize = function () {
if ( this.$img === undefined || this.$thumbnail === undefined ) {
return false;
}
@ -255,15 +255,15 @@
/**
* Displays the image set as {@link #$currentImage} in the carousel.
*/
mw.GallerySlider.prototype.showCurrentImage = function () {
mw.GallerySlideshow.prototype.showCurrentImage = function () {
var imageLi = this.getCurrentImage(),
caption = imageLi.find( '.gallerytext' );
// Highlight current thumbnail
this.$gallery
.find( '.gallerybox.slider-current' )
.removeClass( 'slider-current' );
imageLi.addClass( 'slider-current' );
.find( '.gallerybox.slideshow-current' )
.removeClass( 'slideshow-current' );
imageLi.addClass( 'slideshow-current' );
// Show thumbnail stretched to the right size while the image loads
this.$thumbnail = imageLi.find( 'img' );
@ -296,7 +296,7 @@
* @return {jQuery.Promise} Resolves with the images URL and original
* element once the image has loaded.
*/
mw.GallerySlider.prototype.loadImage = function ( $img ) {
mw.GallerySlideshow.prototype.loadImage = function ( $img ) {
var img, d = $.Deferred();
this.getImageInfo( $img ).done( function ( info ) {
@ -321,7 +321,7 @@
* @param {Object} $img
* @return {jQuery.Promise} Resolves with the image's info.
*/
mw.GallerySlider.prototype.getImageInfo = function ( $img ) {
mw.GallerySlideshow.prototype.getImageInfo = function ( $img ) {
var api, title, params,
imageSrc = $img.attr( 'src' );
@ -364,7 +364,7 @@
* @param {jQuery} $img
* @return {string}
*/
mw.GallerySlider.prototype.getDimensionToRequest = function ( $img ) {
mw.GallerySlideshow.prototype.getDimensionToRequest = function ( $img ) {
var ratio = $img.width() / $img.height();
if ( this.imageHeight * ratio <= this.imageWidth ) {
@ -379,9 +379,9 @@
*
* @param {boolean} show Optional argument to control the state
*/
mw.GallerySlider.prototype.toggleThumbnails = function ( show ) {
mw.GallerySlideshow.prototype.toggleThumbnails = function ( show ) {
this.$galleryBox.toggle( show );
this.$carousel.toggleClass( 'mw-gallery-slider-thumbnails-toggled', show );
this.$carousel.toggleClass( 'mw-gallery-slideshow-thumbnails-toggled', show );
};
/**
@ -389,7 +389,7 @@
*
* @return {jQuery}
*/
mw.GallerySlider.prototype.getCurrentImage = function () {
mw.GallerySlideshow.prototype.getCurrentImage = function () {
this.$currentImage = this.$currentImage || this.$galleryBox.eq( 0 );
return this.$currentImage;
};
@ -400,7 +400,7 @@
*
* @return {jQuery}
*/
mw.GallerySlider.prototype.getNextImage = function () {
mw.GallerySlideshow.prototype.getNextImage = function () {
// Not the last image in the gallery
if ( this.$currentImage.next( '.gallerybox' )[ 0 ] !== undefined ) {
return this.$currentImage.next( '.gallerybox' );
@ -415,7 +415,7 @@
*
* @return {jQuery}
*/
mw.GallerySlider.prototype.getPrevImage = function () {
mw.GallerySlideshow.prototype.getPrevImage = function () {
// Not the first image in the gallery
if ( this.$currentImage.prev( '.gallerybox' )[ 0 ] !== undefined ) {
return this.$currentImage.prev( '.gallerybox' );
@ -428,7 +428,7 @@
* Sets the {@link #$currentImage} to the next one and shows
* it in the carousel
*/
mw.GallerySlider.prototype.nextImage = function () {
mw.GallerySlideshow.prototype.nextImage = function () {
this.$currentImage = this.getNextImage();
this.showCurrentImage();
};
@ -437,16 +437,16 @@
* Sets the {@link #$currentImage} to the previous one and shows
* it in the carousel
*/
mw.GallerySlider.prototype.prevImage = function () {
mw.GallerySlideshow.prototype.prevImage = function () {
this.$currentImage = this.getPrevImage();
this.showCurrentImage();
};
// Bootstrap all slider galleries
// Bootstrap all slideshow galleries
$( function () {
$( '.mw-gallery-slider' ).each( function () {
$( '.mw-gallery-slideshow' ).each( function () {
/*jshint -W031 */
new mw.GallerySlider( this );
new mw.GallerySlideshow( this );
/*jshint +W031 */
} );
} );

22
resources/src/mediawiki/page/gallery.css
View file

@ -125,48 +125,48 @@ ul.mw-gallery-packed {
text-align: center;
}
/* Slider */
ul.gallery.mw-gallery-slider {
/* Slideshow */
ul.gallery.mw-gallery-slideshow {
display: block;
margin: 4em 0;
}
ul.gallery.mw-gallery-slider .gallerycaption {
ul.gallery.mw-gallery-slideshow .gallerycaption {
font-size: 1.3em;
margin: 0;
}
ul.gallery.mw-gallery-slider .gallerycarousel.mw-gallery-slider-thumbnails-toggled {
ul.gallery.mw-gallery-slideshow .gallerycarousel.mw-gallery-slideshow-thumbnails-toggled {
margin-bottom: 1.3em;
}
ul.gallery.mw-gallery-slider .mw-gallery-slider-buttons {
ul.gallery.mw-gallery-slideshow .mw-gallery-slideshow-buttons {
opacity: 0.5;
padding: 1.3em 0;
}
ul.gallery.mw-gallery-slider .mw-gallery-slider-buttons .oo-ui-buttonElement {
ul.gallery.mw-gallery-slideshow .mw-gallery-slideshow-buttons .oo-ui-buttonElement {
margin: 0 2em;
}
.mw-gallery-slider li.gallerybox.slider-current {
.mw-gallery-slideshow li.gallerybox.slideshow-current {
background: #efefef;
}
.mw-gallery-slider .gallerybox > div {
.mw-gallery-slideshow .gallerybox > div {
max-width: 120px;
}
ul.mw-gallery-slider li.gallerybox div.thumb {
ul.mw-gallery-slideshow li.gallerybox div.thumb {
border: none;
background: transparent;
}
ul.mw-gallery-slider li.gallerycarousel {
ul.mw-gallery-slideshow li.gallerycarousel {
display: block;
text-align: center;
}
.mw-gallery-slider-img-container a {
.mw-gallery-slideshow-img-container a {
display: block;
}