wiki.techinc.nl/includes/gallery/PackedOverlayImageGallery.php

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

51 lines
1.7 KiB
PHP
Raw Normal View History

New more slick gallery display This extension adds a "mode" parameter to the gallery tag, allowing different formats for the gallery tag (galleries in the ui can be controlled by a global) The added modes are: *traditional - The original gallery *nolines - Like the original, no borders, less padding *packed - All images aligned by having same height. JS also justifies the images. (I think this one is the one that will go over best with users.) *packed-overlay - like packed, but caption goes over top the image in a transloucent box. *packed-hover - like packed-overlay, but caption only visible on hover. Degrades gracefully on screen readers, and falls back to packed-overlay if you are using a touch screen. I kind of like this mode when the caption is not that important (ex a category where its just the file name). This also adds a hook to allow people to make their own gallery version. I believe there would be interest in this, as different people have done different experiments. For example: * Wikia: http://community.wikia.com/wiki/Help:Galleries,_Slideshows,_and_Sliders/wikitext * Wikinews: https://en.wikinews.org/wiki/Template:Picture_select What I would like to see for this patch, is first it gets enabled, with the default still "traditional". After about a month or two we consult with users. If feedback is positive, we change the default mode to one of the others (probably "packed"). Adds a "mode" parameter to gallery for different mode, including one 'height-constrained-overlay' which looks much more like other modern websites. Note: This makes one change to the old gallery format. It makes Nonexistent files be rendered like thumbnails (i.e. they are rendered with a little grey border). One thing I'm slightly worried about with this patch, is that I added an option to MediaTransformOutput::toHtml to override the width attribute. I'm not sure if that is the best approach, and would appreciate thoughts on that. This should be merged at the same time as Ie82c1548 Change-Id: I33462a8b52502ed76aeb163b66e3704c8618ba23
2013-06-08 04:47:07 +00:00
<?php
/**
* 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
* the Free Software Foundation; either version 2 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License along
* with this program; if not, write to the Free Software Foundation, Inc.,
* 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
* http://www.gnu.org/copyleft/gpl.html
*
* @file
*/
/**
* Packed overlay image gallery. All images adjusted to be same height and
* image caption being placed over top of image.
*/
New more slick gallery display This extension adds a "mode" parameter to the gallery tag, allowing different formats for the gallery tag (galleries in the ui can be controlled by a global) The added modes are: *traditional - The original gallery *nolines - Like the original, no borders, less padding *packed - All images aligned by having same height. JS also justifies the images. (I think this one is the one that will go over best with users.) *packed-overlay - like packed, but caption goes over top the image in a transloucent box. *packed-hover - like packed-overlay, but caption only visible on hover. Degrades gracefully on screen readers, and falls back to packed-overlay if you are using a touch screen. I kind of like this mode when the caption is not that important (ex a category where its just the file name). This also adds a hook to allow people to make their own gallery version. I believe there would be interest in this, as different people have done different experiments. For example: * Wikia: http://community.wikia.com/wiki/Help:Galleries,_Slideshows,_and_Sliders/wikitext * Wikinews: https://en.wikinews.org/wiki/Template:Picture_select What I would like to see for this patch, is first it gets enabled, with the default still "traditional". After about a month or two we consult with users. If feedback is positive, we change the default mode to one of the others (probably "packed"). Adds a "mode" parameter to gallery for different mode, including one 'height-constrained-overlay' which looks much more like other modern websites. Note: This makes one change to the old gallery format. It makes Nonexistent files be rendered like thumbnails (i.e. they are rendered with a little grey border). One thing I'm slightly worried about with this patch, is that I added an option to MediaTransformOutput::toHtml to override the width attribute. I'm not sure if that is the best approach, and would appreciate thoughts on that. This should be merged at the same time as Ie82c1548 Change-Id: I33462a8b52502ed76aeb163b66e3704c8618ba23
2013-06-08 04:47:07 +00:00
class PackedOverlayImageGallery extends PackedImageGallery {
/**
* Add the wrapper html around the thumb's caption
*
* @param string $galleryText The caption
* @param MediaTransformOutput|false $thumb The thumb this caption is for
* or false for bad image.
* @return string
New more slick gallery display This extension adds a "mode" parameter to the gallery tag, allowing different formats for the gallery tag (galleries in the ui can be controlled by a global) The added modes are: *traditional - The original gallery *nolines - Like the original, no borders, less padding *packed - All images aligned by having same height. JS also justifies the images. (I think this one is the one that will go over best with users.) *packed-overlay - like packed, but caption goes over top the image in a transloucent box. *packed-hover - like packed-overlay, but caption only visible on hover. Degrades gracefully on screen readers, and falls back to packed-overlay if you are using a touch screen. I kind of like this mode when the caption is not that important (ex a category where its just the file name). This also adds a hook to allow people to make their own gallery version. I believe there would be interest in this, as different people have done different experiments. For example: * Wikia: http://community.wikia.com/wiki/Help:Galleries,_Slideshows,_and_Sliders/wikitext * Wikinews: https://en.wikinews.org/wiki/Template:Picture_select What I would like to see for this patch, is first it gets enabled, with the default still "traditional". After about a month or two we consult with users. If feedback is positive, we change the default mode to one of the others (probably "packed"). Adds a "mode" parameter to gallery for different mode, including one 'height-constrained-overlay' which looks much more like other modern websites. Note: This makes one change to the old gallery format. It makes Nonexistent files be rendered like thumbnails (i.e. they are rendered with a little grey border). One thing I'm slightly worried about with this patch, is that I added an option to MediaTransformOutput::toHtml to override the width attribute. I'm not sure if that is the best approach, and would appreciate thoughts on that. This should be merged at the same time as Ie82c1548 Change-Id: I33462a8b52502ed76aeb163b66e3704c8618ba23
2013-06-08 04:47:07 +00:00
*/
protected function wrapGalleryText( $galleryText, $thumb ) {
// If we have no text, do not output anything to avoid
// ugly white overlay.
if ( trim( $galleryText ) === '' ) {
return '';
}
$thumbWidth = $this->getGBWidth( $thumb ) - $this->getThumbPadding() - $this->getGBPadding();
$captionWidth = ceil( $thumbWidth - 20 );
$outerWrapper = '<div class="gallerytextwrapper" style="width: ' . $captionWidth . 'px">';
return "\n\t\t\t" .
$outerWrapper . '<div class="gallerytext">' . $galleryText . "</div>"
. "\n\t\t\t</div>";
New more slick gallery display This extension adds a "mode" parameter to the gallery tag, allowing different formats for the gallery tag (galleries in the ui can be controlled by a global) The added modes are: *traditional - The original gallery *nolines - Like the original, no borders, less padding *packed - All images aligned by having same height. JS also justifies the images. (I think this one is the one that will go over best with users.) *packed-overlay - like packed, but caption goes over top the image in a transloucent box. *packed-hover - like packed-overlay, but caption only visible on hover. Degrades gracefully on screen readers, and falls back to packed-overlay if you are using a touch screen. I kind of like this mode when the caption is not that important (ex a category where its just the file name). This also adds a hook to allow people to make their own gallery version. I believe there would be interest in this, as different people have done different experiments. For example: * Wikia: http://community.wikia.com/wiki/Help:Galleries,_Slideshows,_and_Sliders/wikitext * Wikinews: https://en.wikinews.org/wiki/Template:Picture_select What I would like to see for this patch, is first it gets enabled, with the default still "traditional". After about a month or two we consult with users. If feedback is positive, we change the default mode to one of the others (probably "packed"). Adds a "mode" parameter to gallery for different mode, including one 'height-constrained-overlay' which looks much more like other modern websites. Note: This makes one change to the old gallery format. It makes Nonexistent files be rendered like thumbnails (i.e. they are rendered with a little grey border). One thing I'm slightly worried about with this patch, is that I added an option to MediaTransformOutput::toHtml to override the width attribute. I'm not sure if that is the best approach, and would appreciate thoughts on that. This should be merged at the same time as Ie82c1548 Change-Id: I33462a8b52502ed76aeb163b66e3704c8618ba23
2013-06-08 04:47:07 +00:00
}
}