Editing Module:Sprite

local p = {}

function p.getSpritePosition( pos, sheetsize, size )
	local spritesPerRow = sheetsize / size
	local row = math.floor( pos / spritesPerRow )
	local col = pos % spritesPerRow
	local x = col * size
	local y = row * size
	return { ['x'] = x, ['y'] = y }
end
	
function p.get(f)
	local args = f
	if f == mw.getCurrentFrame() then 
		args = require( 'Module:ProcessArgs' ).merge( true )
	else
		f = mw.getCurrentFrame()
	end
	
	local data = args.data and mw.loadData( 'Module:' .. args.data ) or {}
	local settings = data.settings
	local ids = data.ids
	
	local default = {
		scale = 1,
		sheetsize = 256,
		size = 16,
		pos = 1,
		align = 'text-top'
	}
	
	local defaultStyle = default
	if settings then
		if not settings.stylesheet then
			-- Make a separate clone of the current default settings
			defaultStyle = mw.clone( default )
		end
		for k, v in pairs( settings ) do
			default[k] = v
		end
	end
	
	local setting = function( arg )
		return args[arg] or default[arg]
	end
	
	local scale = setting( 'scale' )
	local sheetsize = setting( 'sheetsize' )
	local size = setting( 'size' )
	local pos = args.id and ids[args.id] or setting( 'pos' )
	local align = setting( 'align' )
	local spritePosition = p.getSpritePosition( pos, sheetsize, size )
	local image = setting( 'image' )
	
	local fileUrl = f:expandTemplate{title = 'FileUrl', args = {[1] = image} }
	
	local styles = {
		"vertical-align: " .. align,
		"background-position: " .. -spritePosition.x * scale .. "px " .. -spritePosition.y * scale .. "px",
		"background-size: " .. sheetsize * scale .. "px auto",
		"display: inline-block",
		"width: " .. size * scale .. "px",
		"height: " .. size * scale .. "px"
	}
	
	local sprite = mw.html.create( 'span' ):addClass( 'sprite' )
	sprite:addClass( 'pixelated' )
	sprite:cssText( table.concat( styles, ";" ) )
	sprite:attr( 'data-bgimage', fileUrl )
	
	return tostring( sprite )
end

function p.doc( f )
	local args = f
	if f == mw.getCurrentFrame() then 
		args = require( 'Module:ProcessArgs' ).merge( true )
	else
		f = mw.getCurrentFrame()
	end
	
	local data = args.data and mw.loadData( 'Module:' .. args.data ) or {}
	local settings = data.settings
	local ids = data.ids
	
	local keyedData = {}
	local i = 1
	for name, value in pairs(ids) do
	    keyedData[i] = {
	        sortKey = mw.ustring.lower( name ),
	        name = name,
	        value = value
	    }
	    i = i + 1
	end
	
	-- Sort the keyed table based on the sort key
	table.sort( keyedData, function( a, b )
	    return a.sortKey < b.sortKey
	end )

	-- Create a Lua table to store the created li elements for each unique data-spritedoc-value
	local liElements = {}
	local nameTable = {}
	
	local ul = mw.html.create( 'ul' ):addClass( 'spritedoc-ul' )
	for key, value in ipairs( keyedData ) do
	    -- Check if the li element already exists for the current data-spritedoc-value
	    local li = liElements[value.value]
	    local idText = mw.html.create( 'li' ):addClass( 'spritedoc-name' ):node( mw.html.create( 'code' ):wikitext( value.name ) )
	    local names = nameTable[value.value]
	    if not names then
	        -- If it doesn't exist, create a new li element and store it in the Lua table
	        li = mw.html.create( 'li' ):addClass( 'spritedoc-cell' ):attr( 'data-spritedoc-value', value.value )
	        liElements[value.value] = li
	        ul:node( li )
	        
	        local image = mw.html.create( 'span' ):addClass( 'spritedoc-image' )
	    	image:node( p.get( {data = args.data, id = value.name} ) )
	    	li:wikitext( tostring( image ) )
	    	names = li:tag( 'ul' ):addClass( 'spritedoc-names' )
	    	nameTable[value.value] = names
	    end
	    names:wikitext( tostring( idText ) )
	end
	
	return tostring( ul )
end
return p