Module:Notice: Difference between revisions

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
-local p = {}
+-- Define constants --
+local TEMPLATE_STYLES = 'Module:Notice/styles.css'
-function p.getStyleForColor(color)
+-- Define tables of valid values --
-    result = {
+local borderColors ={
-        ["green"] = "rgb(170, 220, 0)",
+	["blue"] = true,
-        ["teal"] = "rgb(47, 172, 172)",
+	["gray"] = true,
-        ["blue"] = "rgb(0, 153, 255)",
+	["green"] = true,
-        ["orange"] = "rgb(255, 128, 0)",
+	["maroon"] = true,
-        ["yellow"] = "rgb(235, 238, 61)",
+	["orange"] = true,
-        ["red"] = "rgb(217, 0, 0)",
+	["pink"] = true,
-        ["pink"] = "rgb(240, 60, 120)",
+	["purple"] = true,
-        ["maroon"] = "rgb(174, 21, 102)",
+	["red"] = true,
-        ["gray"] = "rgb(201, 201, 201)",
+	["teal"] = true,
-    }
+	["yellow"] = true
+}
-    return result[color] or color
+local backgroundColors ={
-end
+	["blue"] = true,
+	["gray"] = true,
-function p.getStyleForColorBack(colorBack)
+	["green"] = true,
-    result = {
+	["maroon"] = true,
-        ["green"] = "rgba(170, 220, 0, 0.2)",
+	["orange"] = true,
-        ["teal"] = "rgba(47, 172, 172, 0.2)",
+	["pink"] = true,
-        ["blue"] = "rgba(0, 153, 255, 0.2)",
+	["purple"] = true,
-        ["orange"] = "rgba(255, 128, 0, 0.2)",
+	["red"] = true,
-        ["yellow"] = "rgba(235, 238, 61, 0.2)",
+	["teal"] = true,
-        ["red"] = "rgba(217, 0, 0, 0.2)",
+	["yellow"] = true
-        ["pink"] = "rgba(240, 60, 120, 0.2)",
+}
-        ["maroon"] = "rgba(174, 21, 102, 0.2)",
+local alignValues = {
-        ["gray"] = "rgba(201, 201, 201, 0.2)",
+	["center"] = true,
-    }
+	["left"] = true,
-    return result[colorBack] or colorBack
+	["right"] = true
-end
+}
+local textAlignValues = {
+	["center"] = true,
+	["left"] = true,
+	["right"] = true
+}
+local p = {}
--- Entry point for the module
+-- Entry point for the module --
 function p.main(frame)
-    local args = frame:getParent().args
-    local color = args.color or 'green'
-    local colorBack = args.colorBack or ''
-    local align = args.align or ''
-    local textAlign = args['text-align'] or 'left'
-    local width = args.width or ''
-    local file = args.file or ''
-    local fileSize = args.filesize or '48px'
-    local header = args.header or ''
-    local content = args.content or ''
-    local root = mw.html.create('div')
-        :addClass('notice')
-        :css('text-align', textAlign)
-        :css('border-color', p.getStyleForColor(color))
-        :css('border-radius', "5px 5px 5px 5px")
-        :css('border-style', "solid")
-        :css('border-width', "1px 5px 1px 5px")
-        :css('column-gap', "1em")
-        :css('display', "flex")
-        :css('flex-direction', "row")
-        :css('margin', "auto")
-        :css('padding', ".5em")
-    if colorBack ~= '' then
-    	root:css('background-color', p.getStyleForColorBack(colorBack))
-    end
-     if width ~= '' then
+     local args = require('Module:ProcessArgs').merge(true)
-        root:css('width', width)
-    end
+	local alignBox = args.align or 'left'
+	local alignContent = args.alignContent or ''
+	local alignHeader = args.alignHeader or ''
+	local alignText = args.alignText or 'left'
+	local class = args.class or ''
+	local color = args.color or 'green'
+	local colorBack = args.colorBack or ''
+	local content = args.content or ''
+	local file = args.file or ''
+	local fileRight = args.fileRight or ''
+	local fileSize = args.filesize or '48px'
+	local header = args.header or ''
+	local small = args.small or ''
+	local width = args.width or ''
+	if alignText ~= '' then
+		if alignHeader == '' then alignHeader = alignText end
+		if alignContent == '' then alignContent = alignText end
+	end
+    -- use template styles --
+	local root = mw.html.create()
+	root:wikitext(frame:extensionTag{
+		name = 'templatestyles',
+		args = { src = TEMPLATE_STYLES},
+	})
+	-- base div-section of the notice box --
+	local box = root:tag('div')
+	if small == 'yes' then
+		box:addClass('notice-small')
+	else
+		box:addClass('notice')
+		if alignValues[alignBox] then
+			box:addClass(string.format('notice-%s', alignBox))
+		else
+			box:addClass('notice-left')
+		end
+	end
+	if borderColors[color] then
+		box:addClass(string.format('notice-border-%s', color))
+	else
+		box:css('border-color', color)
+	end
+	if colorBack ~= '' then
+		if backgroundColors[colorBack] then
+			box:addClass(string.format('notice-background-%s', colorBack))
+		else
+			box:css('background-color', colorBack)
+		end
+	end
+	if width ~= '' then
+		box:css('width', width)
+	end
+	-- add additional classes to the box (optional) --
+	if class ~= '' then box:addClass(class) end
+	-- adding elements to the box --
+	-- place file left --
      if file ~= '' then
-        root:tag('div')
+		if fileRight == '' then
-            :addClass('notice-image')
+			box:tag('div')
-            :css('position', "relative")
+			   :addClass('notice-image')
-            --:css('top', "50%")
+			   :wikitext(string.format('[[File:%s|%s|link=|class=notpageimage]]', file, fileSize))
-            :css("margin", "auto")
+		end
-            :wikitext(string.format('[[File:%s|%s|link=|class=notpageimage]]', file, fileSize))
+	end
-    end
+	-- place text content --
-    local contentDiv = root:tag('div')
+	local contentDiv = ''
-            :addClass('notice-content')
+	if header ~= '' then
-            :css('flex-grow', 1)
+		contentDiv = box:tag('div')
+						:addClass('notice-content')
-    if header ~= '' then
+		local headerDiv = contentDiv:tag('div')
-        contentDiv:tag('div')
+									:addClass('notice-header')
-            :addClass('notice-header')
+									:addClass(string.format('notice-text-%s', alignHeader))
-            :css('font-weight', 600)
+									:wikitext(header)
-            :wikitext(header)
      end
-    contentDiv:tag('div')
+	if content ~= '' then
-            :addClass('notice-description')
+		if contentDiv == '' then
-            :css('font-size', "9pt")
+			contentDiv = box:tag('div')
-            :wikitext(content)
+							:addClass('notice-content')
+		end
-     return tostring(root)
+		local descriptionDiv = contentDiv:tag('div')
+										 :addClass('notice-description')
+										 :addClass(string.format('notice-text-%s', alignContent))
+										 :wikitext(content)
+	end
+	-- place file right --
+	if fileRight ~= '' then
+		if file ~= '' then
+			box:tag('div')
+					:addClass('notice-image')
+					:wikitext(string.format('[[File:%s|%s|link=|class=notpageimage]]', file, fileSize))
+		end
+    end
+	return tostring(root)
 end
 return p