ഘടകം:Multiple gallery

ഈ ഘടകത്തിന്റെ വിവരണം ഘടകം:Multiple gallery/വിവരണം എന്ന താളിൽ നിർമ്മിക്കാവുന്നതാണ്

local p = {}

-- Helper function to parse color values
local function parseColor(color)
    if not color or color == '' then
        return nil
    end
    return color
end

-- Helper function to sanitize text for HTML output
local function sanitize(text)
    if not text then return '' end
    return mw.text.encode(text)
end

-- Main function to generate the gallery
function p.gallery(frame)
    local args = frame:getParent().args
    
    -- Get configuration parameters
    local mode = args.mode or 'horizontal' -- horizontal, vertical, or box
    local align = args.align or 'right' -- right, left, center, none
    local width = args.width or '100%'
    local height = args.height or '180px' -- default height for horizontal
    local boxWidth = args.boxwidth or '150px' -- width for box mode
    local boxHeight = args.boxheight or '150px' -- height for box mode
    local bgColor = parseColor(args['background color'])
    local headerBg = parseColor(args.header_background)
    local headerAlign = args.header_align or 'center'
    local header = args.header or ''
    local captionAlign = args.caption_align or 'left'
    local footerBg = parseColor(args.footer_background)
    local footerAlign = args.footer_align or 'left'
    local footer = args.footer or ''
    
    -- Collect all images and their properties
    local images = {}
    for i = 1, 50 do -- Extended to 50 images
        if args['image' .. i] or args['file' .. i] then
            table.insert(images, {
                file = args['image' .. i] or args['file' .. i],
                width = args['width' .. i],
                height = args['height' .. i],
                alt = args['alt' .. i] or '',
                link = args['link' .. i],
                thumbtime = args['thumbtime' .. i],
                caption = args['caption' .. i] or ''
            })
        end
    end
    
    if #images == 0 then
        return '<div class="error">No images provided for gallery</div>'
    end
    
    -- Build the HTML structure
    local html = mw.html.create('div')
    html:addClass('responsive-gallery-container')
    html:addClass('gallery-' .. mode)
    
    -- Set alignment
    if align ~= 'none' then
        if align == 'left' then
            html:css('float', 'left')
            html:css('margin-right', '1em')
        elseif align == 'right' then
            html:css('float', 'right')
            html:css('margin-left', '1em')
        elseif align == 'center' then
            html:css('margin-left', 'auto')
            html:css('margin-right', 'auto')
        end
    end
    
    -- Set container width
    if width ~= '100%' then
        html:css('width', width)
    end
    
    -- Create gallery box
    local box = html:tag('div')
    box:addClass('responsive-gallery-box')
    if bgColor then
        box:css('background-color', bgColor)
    end
    
    -- Add header if provided
    if header ~= '' then
        local headerDiv = box:tag('div')
        headerDiv:addClass('gallery-header')
        headerDiv:css('text-align', headerAlign)
        if headerBg then
            headerDiv:css('background-color', headerBg)
        end
        headerDiv:wikitext(header)
    end
    
    -- Create images container with flexbox
    local imagesContainer = box:tag('div')
    imagesContainer:addClass('gallery-images')
    
    -- Set flexbox direction based on mode
    if mode == 'vertical' then
        imagesContainer:addClass('gallery-vertical')
    elseif mode == 'box' then
        imagesContainer:addClass('gallery-box')
    else
        imagesContainer:addClass('gallery-horizontal')
    end
    
    -- Add each image
    for i, img in ipairs(images) do
        local item = imagesContainer:tag('div')
        item:addClass('gallery-item')
        
        -- Set item sizing based on mode
        if mode == 'box' then
            item:css('width', boxWidth)
            item:css('height', boxHeight)
        elseif mode == 'horizontal' then
            item:css('height', height)
        elseif mode == 'vertical' then
            if img.width then
                item:css('width', img.width .. 'px')
            end
        end
        
        -- Create image wrapper
        local wrapper = item:tag('div')
        wrapper:addClass('gallery-image-wrapper')
        
        -- Build image markup
        local imageMarkup = '[[File:' .. img.file
        
        -- Add image parameters
        if mode == 'box' then
            imageMarkup = imageMarkup .. '|' .. boxWidth .. 'x' .. boxHeight
        elseif mode == 'horizontal' then
            imageMarkup = imageMarkup .. '|x' .. height
        elseif mode == 'vertical' then
            if img.width then
                imageMarkup = imageMarkup .. '|' .. img.width .. 'px'
            end
        end
        
        -- Add link if specified
        if img.link then
            imageMarkup = imageMarkup .. '|link=' .. img.link
        end
        
        -- Add alt text
        if img.alt ~= '' then
            imageMarkup = imageMarkup .. '|alt=' .. img.alt
        end
        
        -- Add thumbtime for videos
        if img.thumbtime then
            imageMarkup = imageMarkup .. '|thumbtime=' .. img.thumbtime
        end
        
        imageMarkup = imageMarkup .. ']]'
        wrapper:wikitext(imageMarkup)
        
        -- Add caption if provided
        if img.caption ~= '' then
            local caption = item:tag('div')
            caption:addClass('gallery-caption')
            caption:css('text-align', captionAlign)
            caption:wikitext(img.caption)
        end
    end
    
    -- Add footer if provided
    if footer ~= '' then
        local footerDiv = box:tag('div')
        footerDiv:addClass('gallery-footer')
        footerDiv:css('text-align', footerAlign)
        if footerBg then
            footerDiv:css('background-color', footerBg)
        end
        footerDiv:wikitext(footer)
    end
    
    return tostring(html)
end

return p