Editing Template:ItemBoxGive feedback
The edit can be undone.
Please check the comparison below to verify that this is what you want to do, and then publish the changes below to finish undoing the edit.
| Latest revision | Your text | ||
| Line 8: | Line 8: | ||
-->{{#vardefine:displayName|{{{overrideDisplayName|{{#var:displayName}}}}}}}<!-- | -->{{#vardefine:displayName|{{{overrideDisplayName|{{#var:displayName}}}}}}}<!-- | ||
Measured name size ( | Measured name size (em) and stable per-item texture variety. | ||
-->{{#vardefine:fontSize|{{#invoke:ItemBox|getFontSize|{{#var:displayName}}}}}}<!-- | -->{{#vardefine:fontSize|{{#invoke:ItemBox|getFontSize|{{#var:displayName}}}}}}<!-- | ||
-->{{#vardefine:variants|{{#invoke:ItemBox|variants|{{#var:itemName}}}}}}<!-- | -->{{#vardefine:variants|{{#invoke:ItemBox|variants|{{#var:itemName}}}}}}<!-- | ||
| Line 21: | Line 21: | ||
-->{{#vardefine:isImbue|{{#ifeq:{{#var:isImbue}}|true|itembox-imbue}}}}<!-- | -->{{#vardefine:isImbue|{{#ifeq:{{#var:isImbue}}|true|itembox-imbue}}}}<!-- | ||
lowGraphics=true is for callers that place dozens of cards on one page | lowGraphics=true is the setting for callers that place dozens of cards on | ||
one page. It drops the paper texture entirely, because every way of drawing | |||
it multiplies two images together, and WebRender re-rasterises and re-uploads | |||
any such blend on every scrolled frame instead of caching it as a static | |||
tile. On the profiled navbox that blend was the whole cost: dropping it took | |||
the render thread's OpenGL work from ~230 ms/s to ~10 and roughly doubled | |||
the frame rate. The wear tint also becomes a gradient and the icon mask is | |||
dropped, both cheaper per card, though the texture is the change that matters. | |||
-->{{#vardefine:lowGraphics|{{#ifeq:{{{lowGraphics|}}}|true|itembox-ramp-wear itembox-flat-icon itembox-no-texture}}}}<!-- | |||
-->{{#vardefine: | The same layers individually, for testing combinations or overriding the | ||
bundle above. wearMask drops the mask from the wear tint three ways: | |||
no - tint moves behind the artwork, so only the card stock is coloured | |||
ramp - tint stays on top, fading in from the card's edges | |||
soft - tint stays on top, uniform and lighter, with the name lifted clear | |||
texture handles the paper grain: | |||
no - drop it entirely (the only option that caches while scrolling) | |||
1/2/3 - one shared paper via the mix-blend overlay | |||
blend / blend1..3 - paper multiplied into the card art. Both of these | |||
multiply two images and so are re-rasterised every scrolled frame; | |||
they are fine for a handful of cards but not for a full page. | |||
-->{{#vardefine:lite|{{#switch:{{{wearMask|}}}|no=itembox-flat-wear|ramp=itembox-ramp-wear|soft=itembox-soft-wear}} {{#ifeq:{{{iconMask|}}}|no|itembox-flat-icon}} {{#switch:{{{texture|}}}|no=itembox-no-texture|1=itembox-force-tex-1|2=itembox-force-tex-2|3=itembox-force-tex-3|blend=itembox-blend-texture|blend1=itembox-blend-texture itembox-blend-tex-1|blend2=itembox-blend-texture itembox-blend-tex-2|blend3=itembox-blend-texture itembox-blend-tex-3}}}}<!-- | |||
Links. | Links. | ||
| Line 38: | Line 49: | ||
-->{{#vardefine:linkClick|{{{overrideLinkClick|{{#var:itemName}}{{If lang}}}}}}}<!-- | -->{{#vardefine:linkClick|{{{overrideLinkClick|{{#var:itemName}}{{If lang}}}}}}}<!-- | ||
--><div class="itembox {{#var:showTierTag}} {{#var:tier}} {{#var:slot}} {{#var:isActive}} {{#var:isImbue}} {{#var:variants}} {{#var:lowGraphics}}" style="font-size:{{#expr: 10 * {{#if:{{{size|}}}|{{{size}}}|1}} }}px;"> | --><div class="itembox {{#var:showTierTag}} {{#var:tier}} {{#var:slot}} {{#var:isActive}} {{#var:isImbue}} {{#var:variants}} {{#var:lowGraphics}} {{#var:lite}}" style="font-size:{{#expr: 10 * {{#if:{{{size|}}}|{{{size}}}|1}} }}px;"> | ||
<div class="itembox-background"> | <div class="itembox-background"> | ||
<div class="itembox-card"> | <div class="itembox-card"> | ||
| Line 50: | Line 61: | ||
<div class="itembox-imbue-tag">{{#invoke:Lang|get_string|item_info_imbue}}</div> | <div class="itembox-imbue-tag">{{#invoke:Lang|get_string|item_info_imbue}}</div> | ||
</div> | </div> | ||
<div class="itembox-name-area"> | |||
<div class="itembox-name-area | <p class="itembox-name" style="font-size:{{#var:fontSize}}em;text-wrap:balance;">{{#var:displayName}}</p> | ||
<p class="itembox-name" style="font-size:{{#var:fontSize}};text-wrap:balance;">{{#var:displayName}}</p> | |||
</div> | </div> | ||
<div class="itembox-wear"></div> | <div class="itembox-wear"></div> | ||