Module:Falloff: Difference between revisions
TeamSpecBot (talk | contribs) Damage falloff chart |
TeamSpecBot (talk | contribs) Damage falloff chart |
||
| Line 21: | Line 21: | ||
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" style="position:relative;height:180px;border-left:1px solid ' .. LINE | ||
.. ';border-bottom:1px solid ' .. LINE .. ';display:flex;align-items:flex-end;">') | .. ';border-bottom:1px solid ' .. LINE .. ';display:flex;align-items:flex-end;">') | ||
-- The full-damage line. | -- The full-damage line. | ||
| Line 34: | Line 34: | ||
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="flex:1;height:%.2f%%;background:%s;border-right:1px solid #fff;cursor:crosshair;"></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, BAR)) | ||
end | end | ||
table.insert(out, '</div>') | table.insert(out, '</div>') | ||
| Line 48: | Line 48: | ||
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 style="font-size:85%;color:#54595d;">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) | ||