Jump to content

Module:ImageStackPopup

From mediawiki.org
Module documentation

Module Quality[edit]

Usage[edit]

  • {{#invoke:ImageStackPopup|image}}
  • {{#invoke:ImageStackPopup|gallery}}

Create an image that has a play button which popups a viewer showing a slideshow of some other images. Intended for use in viewing a series of medical images. See {{ImageStackPopup }} and {{ImageStackPopupGallery }} for more details.


This Module is a template gadget that requires the ImageStackPopup gadget to work. Follow the installation instructions to get it working in your wiki.


Installation[edit]

To install this template in your wiki:

  1. Copy the pages Module:ImageStackPopup, Template:ImageStackPopup and Template:ImageStackPopupGallery to your wiki.
  2. Create MediaWiki:Gadget-ImageStackPopup.js with the following code:
    /**
     * ImageStackPopup: Creates a popup gallery viewer suitable for medical images
     * Documentation: https://www.mediawiki.org/wiki/ImageStackPopup
     * Source code: https://www.mediawiki.org/wiki/MediaWiki:Gadget-Global-ImageStackPopup.js
     */
    mw.loader.load( '//www.mediawiki.org/w/load.php?modules=ext.gadget.Global-ImageStackPopup' );
    
  3. Add the following gadget to MediaWiki:Gadgets-definition:
    ImageStackPopup[ResourceLoader|hidden|default|categories=ImageStackPopup.js]|ImageStackPopup.js
    

Done! Add your template to any page to verify that the installation was successful.


-- Requires ImageStackPopup gadget
local p = {}

function p.image( frame )
	math.randomseed(tonumber(mw.getContentLanguage():formatDate( "U" ))*10000 + os.clock()*10000)
	local args = frame:getParent().args
	local popupConfig = {}
	local caption = ''
	popupConfig.loop = args.loop == "yes"
	if tonumber( args.start ) then
		popupConfig.start = tonumber( args.start )
	else
		popupConfig.start = 1
	end
	if tonumber( args.width ) then
		popupConfig.width = tonumber( args.width )
	end
	if tonumber( args.height ) then
		popupConfig.height = tonumber( args.height )
	end
	popupConfig.list = args.list
	if args['noregisterimages'] == nil then
		-- Register this as a dependency so that this page shows up as using all the images on the list page
		frame:expandTemplate{ title = ':' .. args.list }
	end
	-- If we don't want to transclude for performance, maybe we could at least link
	-- however links need to actually be output on the page to register them.
	
	if args.caption then
		popupConfig.caption = "imagestackpopup-caption-" .. math.random()
		caption = tostring( mw.html.create( 'div' )
			:attr( 'id', popupConfig.caption )
			:attr( 'style', 'display: none' )
			:wikitext( args.caption )
			:done() )
	end
	if args.title then
		popupConfig.title = args.title
	end

	return tostring( mw.html.create( 'div' )
		:attr( 'class', 'ImageStackPopup' )
		:attr( 'data-imagestackpopup-config', mw.text.jsonEncode( { popupConfig } ) )
		:wikitext( args.file ) )
		.. caption .. '[[Category:ImageStackPopup.js]]'

end


function p.gallery( frame )
	-- Seems like math.random is always seeded with 0 :(
	math.randomseed(tonumber(mw.getContentLanguage():formatDate( "U" ))*10000 + os.clock()*10000)
	local args = frame:getParent().args
	local reuseImageCaption = args.reuse_image_caption ~= nil
	local title = args["popup-title"]
	local captionId = nil
	local captionText = ''
	local galleryContents = ''
	local optionsArray = {}
	local galleryArgs = {}

	local galleryAttr = { "mode", "widths", "heights", "perrow", "caption", "showfilename", "showthumbnail", "id", "title", "class", "lang", "dir" }
	for i, j in ipairs( galleryAttr ) do
		galleryArgs[j] = args[j]
	end

	if args['popup-caption'] then
		captionId = 'imagestackpopup-caption-' .. math.random()
		captionText = tostring(
			mw.html.create( 'div' )
				:attr( 'style', 'display:none' )
				:attr( 'id', captionId )
				:wikitext( args['popup-caption'] )
		)
	end

	for row in mw.text.gsplit( args.gallery, "\n", true ) do
		local galleryRow = ''
		local popupOptions = { title = title, caption = captionId }
		for part in mw.text.gsplit( row, "!", true ) do
			equalSplit = mw.text.split( part, '=', true )
			if #equalSplit <= 1 then
				-- be sure this really is a caption.
				if galleryRow ~= '' and
					reuseImageCaption and
					#part > 8 and
					string.find( part, " ", 1, true )
				then
					local captionId = 'imagestackpopup-caption-' .. math.random()
					local wrappedPart = tostring( mw.html.create( 'span' )
						:attr( 'id', captionId )
						:wikitext( part )
					)
					popupOptions.caption = captionId
					galleryRow = galleryRow .. wrappedPart .. '|'
				else
					galleryRow = galleryRow .. part .. '|'
				end
			else
				if equalSplit[1] == 'popup-width' then
					popupOptions.width = tonumber(equalSplit[2])
				elseif equalSplit[1] == 'popup-height' then
					popupOptions.height = tonumber(equalSplit[2])
				elseif equalSplit[1] == 'popup-loop' then
					popupOptions.loop = equalSplit[2] ~= ''
				elseif equalSplit[1] == 'popup-start' then
					popupOptions.start = tonumber(equalSplit[2])
				elseif equalSplit[1] == 'popup-caption' then
					local captionIdForImg = 'imagestackpopup-caption-' .. math.random()
					captionText = captionText .. tostring( mw.html.create( 'div' )
						:attr( 'id', captionIdForImg )
						:css( 'display', 'none' )
						:wikitext( table.concat( equalSplit, '=', 2 ) )
					)
					popupOptions.caption = captionIdForImg
				elseif equalSplit[1] == 'popup-title' then
					popupOptions.title = table.concat( equalSplit, '=', 2 )
				elseif equalSplit[1] == 'popup-list' then
					popupOptions.list = table.concat( equalSplit, '=', 2 )
					if args['noregisterimages'] == nil then
						-- Register this as a dependency so that this page shows up as using all the images on the list page
						frame:expandTemplate{ title = ':' .. table.concat( equalSplit, '=', 2 ) }
					end
				else
					galleryRow = galleryRow .. part .. '|'
				end

			end
		end
		if string.sub( galleryRow, -1 ) == '|' then
			galleryRow = string.sub( galleryRow, 1, -2 )
		end
		galleryContents = galleryContents .. galleryRow .. "\n"
		optionsArray[#optionsArray+1] = popupOptions
	end
	return tostring( mw.html.create( 'div' )
		:attr( 'class', 'ImageStackPopup' )
		:attr( 'data-imagestackpopup-config', mw.text.jsonEncode( optionsArray ) )
		:wikitext( frame:extensionTag( 'gallery', galleryContents, galleryArgs ) )
		) .. captionText .. '[[Category:ImageStackPopup.js]]'
end


return p