模块:Swiper

此模块的文档可以在模块:Swiper/doc创建

local p = {}
local trim = mw.text.trim
local nowiki = mw.text.nowiki

local DEFAULTS = {
    MAX_SLIDES = 100,
    MIN_DELAY = 500,
    DEFAULT_DELAY = 5000,
    ALLOWED_EFFECTS = {
        slide = true, fade = true, cube = true, 
        coverflow = true, flip = true, cards = true, creative = true
    }
}

local function safeStr(s)
    if not s then return '' end
    return nowiki(trim(tostring(s)))
end

local function buildOptions(args, slideCount)
    local opt = {
        autoHeight = true,
        effect = DEFAULTS.ALLOWED_EFFECTS[args['效果']] and safeStr(args['效果']) or 'slide'
    }
    
    if slideCount > 1 then
        if trim(args['循环']) == '是' then
            opt.loop = true
        end
        if trim(args['自动播放']) == '是' then
            local delay = tonumber(args['延迟']) or DEFAULTS.DEFAULT_DELAY
            if delay < DEFAULTS.MIN_DELAY then
                delay = DEFAULTS.DEFAULT_DELAY
            end
            opt.autoplay = {
                delay = delay,
                disableOnInteraction = false
            }
        end
    end
    
    if trim(args['分页']) ~= '否' then
        opt.pagination = {
            el = '.swiper-pagination',
            clickable = true
        }
    end
    
    if trim(args['翻页']) == '箭头' then
        opt.navigation = {
            prevEl = '.swiper-button-prev',
            nextEl = '.swiper-button-next'
        }
    end
    
    return opt
end

function p.main(frame)
    local args = frame:getParent().args
    local slides = {}

    for i = 1, DEFAULTS.MAX_SLIDES do
        local key = tostring(i)
        local v = args[key]
        if v == nil then break end
        v = trim(v)
        if v ~= '' then
            table.insert(slides, v)
        end
    end

    local cnt = #slides
    if cnt == 0 then
        return '<div style="padding:1rem;text-align:center;color:#ccc;">暂无轮播内容</div>'
    end

    local options = buildOptions(args, cnt)
    local dataOpts = mw.text.jsonEncode(options)

    local id = safeStr(args['id'])
    if id == '' then
        id = 'pvzhe-swiper-' .. frame:preprocess('{{REVISIONID}}') .. '-' .. math.random(10000)
    end

    local html = {}
    table.insert(html, '<div id="' .. id .. '" class="swiper pvzhe-swiper" data-swiper-options=\'' .. dataOpts .. '\' role="region" aria-label="轮播图">')
    table.insert(html, '<div class="swiper-wrapper">')
    
    for idx, s in ipairs(slides) do
        local ariaLabel = '第 ' .. idx .. ' 张，共 ' .. cnt .. ' 张'
        table.insert(html, '<div class="swiper-slide" role="group" aria-label="' .. ariaLabel .. '">' .. frame:preprocess(s) .. '</div>')
    end
    
    table.insert(html, '</div>')
    
    if trim(args['分页']) ~= '否' then
        table.insert(html, '<div class="swiper-pagination" aria-label="轮播图分页"></div>')
    end
    if trim(args['翻页']) == '箭头' then
        table.insert(html, '<div class="swiper-button-prev" aria-label="上一张"></div>')
        table.insert(html, '<div class="swiper-button-next" aria-label="下一张"></div>')
    end
    table.insert(html, '</div>')

    return table.concat(html)
end

return p