Module:Sandbox/苛性氢/LLbg

模块文档  

local p = {}

function p.draw(frame)
	local args = (frame == mw.getCurrentFrame() and frame.args) or frame
	local opacity, color, zindex, scale, period =
		mw.text.trim(args["opacity"] or "0.5"),
		mw.text.trim(args["color"] or "#BDF"),
		mw.text.trim(args["zindex"] or "auto"),
		mw.text.trim(args["scale"] or "75%"),
		mw.text.trim(args["period"] or "8s")

	return string.format("<div class=\"llbg\">\n\t<svg class=\"llbg-symbol-svg\" style=\"display:none\">\n\t\t<symbol id=\"llbg-symbol\" viewBox=\"0 0 1300 1300\">\n\t\t\t<g>\n\t\t\t\t<path d=\"M190.17,190.17c-253.55,253.55-253.55,666.12,0,919.67s666.12,253.55,919.67,0s253.55-666.12,0-919.67S443.72-63.39,190.17,190.17z M850.44,850.44c79.58-79.58,101.85-195.08,66.83-294.78l59.56-59.56c62.92,133.95,39.15,298.85-71.37,409.37c-140.86,140.86-370.07,140.86-510.93,0s-140.86-370.06,0-510.93c110.53-110.53,275.42-134.29,409.37-71.37l-59.56,59.56c-99.7-35.02-215.2-12.75-294.78,66.83c-110.52,110.52-110.52,290.36,0,400.88S739.92,960.96,850.44,850.44z M1062.47,1062.47c-227.44,227.44-597.5,227.43-824.94,0c-198.02-198.02-223.6-504.15-76.8-730.14l27.91,27.91C56.23,570.66,81.61,851.93,264.84,1035.16c212.72,212.72,557.6,212.72,770.32,0s212.72-557.6,0-770.32C851.93,81.61,570.66,56.23,360.24,188.65l-27.91-27.91c225.99-146.8,532.12-121.23,730.14,76.8C1289.9,464.97,1289.91,835.03,1062.47,1062.47z\" style=\"opacity:%s;fill:%s;\"></path>\n\t\t\t</g>\n\t\t</symbol>\n\t</svg>\n\t<style>\n\t\t.llbg-use {\n\t\t\tz-index: %s;\n\t\t\tposition: fixed;\n\t\t\ttop: 50%%;\n\t\t\tleft: 50%%;\n\t\t\ttranslate: -50%% -50%%;\n\t\t\tscale: %s;\n\t\t\t-webkit-animation-name: bg-rotate;\n\t\t\tanimation-name: bg-rotate;\n\t\t\t-webkit-animation-duration: %s;\n\t\t\tanimation-duration: %s;\n\t\t\t-webkit-animation-timing-function: linear;\n\t\t\tanimation-timing-function: linear;\n\t\t\t-webkit-animation-iteration-count: infinite;\n\t\t\tanimation-iteration-count: infinite;\n\t\t\tpointer-events: none;\n\t\t}\n\t\t@keyframes bg-rotate {\n\t\t\t0%% {\n\t\t\t\ttransform: rotate(0deg);\n\t\t\t}\n\n\t\t\t25%% {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\n\t\t\t50%% {\n\t\t\t\ttransform: rotate(180deg);\n\t\t\t}\n\n\t\t\t75%% {\n\t\t\t\ttransform: rotate(270deg);\n\t\t\t}\n\n\t\t\t100%% {\n\t\t\t\ttransform: rotate(360deg);\n\t\t\t}\n\t\t}\n\t\t@-webkit-keyframes bg-rotate {\n\t\t\t0%% {\n\t\t\t\t-webkit-transform: rotate(0deg);\n\t\t\t}\n\n\t\t\t25%% {\n\t\t\t\t-webkit-transform: rotate(90deg);\n\t\t\t}\n\n\t\t\t50%% {\n\t\t\t\t-webkit-transform: rotate(180deg);\n\t\t\t}\n\n\t\t\t75%% {\n\t\t\t\t-webkit-transform: rotate(270deg);\n\t\t\t}\n\n\t\t\t100%% {\n\t\t\t\t-webkit-transform: rotate(360deg);\n\t\t\t}\n\t\t}\n\t</style>\n\t<div class=\"llbg-use\">\n\t\t<svg class=\"llbg-use-svg\" width=\"1300\" height=\"1300\">\n\t\t\t<use xmlns:xlink=\"http://www.w3.org/1999/xlink\" xlink:href=\"#llbg-symbol\"></use>\n\t\t</svg>\n\t</div>\n</div>",
	opacity, color, zindex, scale, period, period)
end

return p