Module:Falloff: Difference between revisions

From TeamSpec Wiki
Jump to navigation Jump to search
Damage falloff chart
 
TeamSpec theme: colours move from inline styles to MediaWiki:Common.css classes
 
(One intermediate revision by one other user not shown)
Line 4: Line 4:
local p = {}
local p = {}


local BAR = '#5b8def'
local LINE = '#a2a9b1'


function p.chart(frame)
function p.chart(frame)
Line 21: Line 19:
end
end
local out = {}
local out = {}
table.insert(out, '<div style="max-width:640px;margin:8px 0 4px 0;">')
table.insert(out, '<div class="ts-falloff" style="max-width:640px;margin:8px 0 4px 0;">')
table.insert(out, '<div style="position:relative;height:180px;border-left:1px solid ' .. LINE
table.insert(out, '<div class="ts-falloff-plot">')
.. ';border-bottom:1px solid ' .. LINE .. ';display:flex;align-items:flex-end;">')
-- The full-damage line.
-- The full-damage line.
table.insert(out, string.format('<div style="position:absolute;left:0;right:0;bottom:%.2f%%;border-top:1px dashed %s;"></div>',
table.insert(out, string.format('<div class="ts-falloff-full" style="bottom:%.2f%%;"></div>', 100 / top))
100 / top, LINE))
for _, t in ipairs(w.thresholds) do
for _, t in ipairs(w.thresholds) do
table.insert(out, string.format(
table.insert(out, string.format(
'<div style="position:absolute;top:0;bottom:0;left:%.2f%%;border-left:1px dotted %s;"></div>',
'<div class="ts-falloff-threshold" style="left:%.2f%%;"></div>',
t / w.max * 100, LINE))
t / w.max * 100))
end
end
for _, s in ipairs(w.samples) do
for _, s in ipairs(w.samples) do
table.insert(out, string.format(
table.insert(out, string.format(
'<div title="%s" style="flex:1;height:%.2f%%;background:%s;border-right:1px solid #fff;cursor:crosshair;"></div>',
'<div class="ts-falloff-bar" title="%s" data-readout="%s" style="height:%.2f%%;"></div>',
mw.text.encode(s[3]), s[2] / top * 100, BAR))
mw.text.encode(s[3]), mw.text.encode(s[3]), s[2] / top * 100))
end
end
table.insert(out, '</div>')
table.insert(out, '</div>')
Line 48: Line 44:
mw.language.getContentLanguage():formatNum(math.floor(w.max * 10 + 0.5) / 10)))
mw.language.getContentLanguage():formatNum(math.floor(w.max * 10 + 0.5) / 10)))
table.insert(out, '</div>')
table.insert(out, '</div>')
table.insert(out, '<div style="font-size:85%;color:#54595d;">Hover the chart to read the damage at each distance. The dashed line is full damage; dotted lines mark where the falloff changes.</div>')
table.insert(out, '<div class="ts-falloff-caption">Hover or touch the chart to read the damage at each distance. The dashed line is full damage; dotted lines mark where the falloff changes.</div>')
table.insert(out, '</div>')
table.insert(out, '</div>')
return table.concat(out)
return table.concat(out)

Latest revision as of 08:01, 20 October 2026

Documentation for this module may be created at Module:Falloff/doc

-- Draws a weapon's damage falloff as a bar chart. Hovering a bar shows the
-- damage at that distance, as the game's inspect window reads it out.
local data = mw.loadData('Module:Falloff/data')
local p = {}


function p.chart(frame)
	local name = frame.args[1]
	if not name or name == '' then
		name = mw.title.getCurrentTitle().text
	end
	local w = data[name]
	if not w then
		return ''
	end
	local top = 1
	for _, s in ipairs(w.samples) do
		top = math.max(top, s[2])
	end
	local out = {}
	table.insert(out, '<div class="ts-falloff" style="max-width:640px;margin:8px 0 4px 0;">')
	table.insert(out, '<div class="ts-falloff-plot">')
	-- The full-damage line.
	table.insert(out, string.format('<div class="ts-falloff-full" style="bottom:%.2f%%;"></div>', 100 / top))
	for _, t in ipairs(w.thresholds) do
		table.insert(out, string.format(
			'<div class="ts-falloff-threshold" style="left:%.2f%%;"></div>',
			t / w.max * 100))
	end
	for _, s in ipairs(w.samples) do
		table.insert(out, string.format(
			'<div class="ts-falloff-bar" title="%s" data-readout="%s" style="height:%.2f%%;"></div>',
			mw.text.encode(s[3]), mw.text.encode(s[3]), s[2] / top * 100))
	end
	table.insert(out, '</div>')
	-- Distances under the axis: the start, every threshold, the end.
	table.insert(out, '<div style="position:relative;height:1.4em;font-size:85%;">')
	table.insert(out, '<span style="position:absolute;left:0;">0 m</span>')
	for _, t in ipairs(w.thresholds) do
		table.insert(out, string.format('<span style="position:absolute;left:%.2f%%;transform:translateX(-50%%);">%s m</span>',
			t / w.max * 100, mw.language.getContentLanguage():formatNum(math.floor(t * 10 + 0.5) / 10)))
	end
	table.insert(out, string.format('<span style="position:absolute;right:0;">%s m</span>',
		mw.language.getContentLanguage():formatNum(math.floor(w.max * 10 + 0.5) / 10)))
	table.insert(out, '</div>')
	table.insert(out, '<div class="ts-falloff-caption">Hover or touch the chart to read the damage at each distance. The dashed line is full damage; dotted lines mark where the falloff changes.</div>')
	table.insert(out, '</div>')
	return table.concat(out)
end

return p