ICANNWiki

Module:SocialMedia: Difference between revisions

← Older editNewer edit →
MarkWD (talk | contribs)
Bureaucrats, Check users, Interface administrators, Administrators (Semantic MediaWiki), Curators (Semantic MediaWiki), Editors (Semantic MediaWiki), steward, Suppressors, Administrators, Temporary account IP viewers
25,069 edits
No edit summary
Tag: Reverted
No edit summary
Tag: Reverted
Line 47: Line 47:
}
}


 
--------------------------------------------------------------------------------
-- This section defines the social platforms; can be added or deleted without consequence
-- The social platforms table starts here, referencing both the user param name
-- param = handle for the platform; for "x", we also accept "twitter" for legacy purposes
-- (e.g. "facebook") and a key (e.g. "facebookSVG") that matches our top-of-module
-- icon  = wiki file for the icon
-- svgIcons table. We'll rely on an external CSS for styling each inline <svg>.
-- prefix = URL prefix
--------------------------------------------------------------------------------
-- label  = used for alt text/screen readers
local socialPlatforms = {
local socialPlatforms = {
     {
     {
         param = "facebook",
         param     = "facebook",
         icon  = "File:SocialFacebookIcon.svg",
         inlineKey = "facebook", -- corresponds to svgIcons["facebook"]
         prefix = "https://www.facebook.com/",
         prefix   = "https://www.facebook.com/",
         label = "Facebook"
         label     = "Facebook"
     },
     },
     {
     {
         param = "instagram",
         param     = "instagram",
         icon  = "File:SocialInstagramIcon.svg",
         inlineKey = "instagram",
         prefix = "https://www.instagram.com/",
         prefix   = "https://www.instagram.com/",
         label = "Instagram"
         label     = "Instagram"
     },
     },
     {
     {
         param = "linkedin",
         param     = "linkedin",
         icon  = "File:SocialLinkedInIcon.svg",
         inlineKey = "linkedin",
         prefix = "https://www.linkedin.com/",
         prefix   = "https://www.linkedin.com/",
         label = "LinkedIn"
         label     = "LinkedIn"
     },
     },
     {
     {
         param = "telegram",
         param     = "telegram",
         icon  = "File:SocialTelegramIcon.svg",
         inlineKey = "telegram",
         prefix = "https://t.me/",
         prefix   = "https://t.me/",
         label = "Telegram"
         label     = "Telegram"
     },
     },
     {
     {
         param = "threads",
         param     = "threads",
         icon  = "File:SocialThreadsIcon.svg",
         inlineKey = "threads",
         prefix = "https://www.threads.net/",
         prefix   = "https://www.threads.net/",
         label = "Threads"
         label     = "Threads"
     },
     },
     {
     {
         param = "tiktok",
         param     = "tiktok",
         icon  = "File:SocialTikTokIcon.svg",
         inlineKey = "tiktok",
         prefix = "https://www.tiktok.com/",
         prefix   = "https://www.tiktok.com/",
         label = "TikTok"
         label     = "TikTok"
     },
     },
     {
     {
         -- Multiple aliases: the editor can supply "x" or "twitter"
         -- Accepts either |x= or |twitter= from the user, but we'll use the same inline SVG
         param = { "x", "twitter" },
         param     = { "x", "twitter" },
         icon  = "File:SocialXIcon.svg",
         inlineKey = "twitter",
         prefix = "https://x.com/",
         prefix   = "https://x.com/",
         label = "X (Twitter)"
         label     = "X (Twitter)"
     },
     },
     {
     {
         param = "youtube",
         param     = "youtube",
         icon  = "File:SocialYouTubeIcon.svg",
         inlineKey = "youtube",
         prefix = "https://www.youtube.com/",
         prefix   = "https://www.youtube.com/",
         label = "YouTube"
         label     = "YouTube"
     },
     },
}
}


--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
-- Helper to find the first non-empty user handle from a param or table of params
-- Read the user's handle from the template args. If 'param' is a table of aliases,
-- If param is a single string (e.g. "facebook"), we do args["facebook"]
-- we check each one in order (e.g. "x", then "twitter").
-- If it's a table like { "x", "twitter" }, we check args["x"] then args["twitter"]
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
local function getUserHandle(args, param)
local function getUserHandle(args, param)
Line 124: Line 122:
end
end


-- Build a clickable icon link (24px) with alt text for accessibility:
--------------------------------------------------------------------------------
-- [[File:Something.svg|24px|alt=ALT_TEXT|link=URL]]
-- Fetch the inline SVG content from our top-of-module svgIcons table (not shown here),
local function buildIconLink(iconFile, altText, url)
-- using 'inlineKey'. If there's no match, we return an empty string.
     return string.format("[[%s|24px|alt=%s|link=%s]]", iconFile, altText, url)
--------------------------------------------------------------------------------
local function getInlineSVG(inlineKey, svgIcons)
    return svgIcons[inlineKey] or ""
end
 
--------------------------------------------------------------------------------
-- Build an individual <a>…</a> wrapping the inline <svg>.
-- 'platform.label' becomes the alt/title, 'handle' is appended to the prefix,
-- and 'svgIcons' is the table of actual SVG code defined at the top of the module.
--------------------------------------------------------------------------------
local function buildIcon(platform, handle, svgIcons)
    local iconSVG  = getInlineSVG(platform.inlineKey, svgIcons)
    local fullURL  = platform.prefix .. handle
    local altText  = platform.label
 
    -- We wrap the raw SVG code in an <a> so it links to the social profile:
    -- Add classes or other attributes as needed for external CSS styling.
     return string.format(
        '<a href="%s" class="social-icon" title="%s">%s</a>',
        fullURL, altText, iconSVG
    )
end
end


-- Build a single table row with colspan=2, containing a flex container for icons
--------------------------------------------------------------------------------
-- Build a single table row (row + cell) that contains a flex container with the icons.
-- We rely on an external CSS (e.g., "display:flex;" in a .social-icons class).
--------------------------------------------------------------------------------
local function buildSocialRow(icons)
local function buildSocialRow(icons)
     local iconMarkup = table.concat({
     local iconMarkup = table.concat({
         '<div style="display: flex; flex-wrap: wrap; gap: 0.5em; margin-top: 0.2em;">',
         '<div class="social-icons">',
             table.concat(icons, ""),
             table.concat(icons, ""),
         '</div>'
         '</div>'
Line 144: Line 165:
end
end


-- Main render function, takes a table of arguments (handles), returns wiki markup with social icons
--------------------------------------------------------------------------------
function sf.render(args)
-- Main render function. We expect the caller to pass 'args' (template arguments)
-- and 'svgIcons' (the table of inline SVG data at the top of the module).
--------------------------------------------------------------------------------
function m.render(args, svgIcons)
     local icons = {}
     local icons = {}


Line 151: Line 175:
         local handle = getUserHandle(args, platform.param)
         local handle = getUserHandle(args, platform.param)
         if handle and handle ~= "" then
         if handle and handle ~= "" then
            local url = platform.prefix .. handle
             local iconLink = buildIcon(platform, handle, svgIcons)
             local iconLink = buildIconLink(platform.icon, platform.label, url)
             table.insert(icons, iconLink)
             table.insert(icons, iconLink)
         end
         end
     end
     end


    -- If no handles were provided, return nothing.
     if #icons == 0 then
     if #icons == 0 then
         return ""
         return ""
     end
     end


     -- Return a row that fits nicely in the template, with a flex container for icons
     -- Return a table row with a cell that contains our flex container of icons
     return buildSocialRow(icons)
     return buildSocialRow(icons)
end
end


return sf
return m
Retrieved from "https://staging.icannwiki.org/Module:SocialMedia"