Template:ItemBox: Difference between revisionsGive feedback
Restore the icon mask and real masked wear on the lowGraphics path, keeping only texture off, to measure whether the masks affect scroll caching (with help from vergir-bot LLM) |
Add texture=mask, mask-inv and mask-soft switch values (with help from vergir-bot LLM) |
||
| Line 22: | Line 22: | ||
lowGraphics=true is the setting for callers that place dozens of cards on | lowGraphics=true is the setting for callers that place dozens of cards on | ||
one page. It drops the paper texture, because every way of drawing it | one page. It drops the paper texture, because every way of drawing it as a | ||
multiply blends two images together, and WebRender re-rasterises 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 and icon masks are clips of a single image, not blends of | |||
two, so they cache once rasterised and are kept at full detail here. | |||
-->{{#vardefine:lowGraphics|{{#ifeq:{{{lowGraphics|}}}|true|itembox-no-texture}}}}<!-- | -->{{#vardefine:lowGraphics|{{#ifeq:{{{lowGraphics|}}}|true|itembox-no-texture}}}}<!-- | ||
| Line 38: | Line 37: | ||
soft - tint stays on top, uniform and lighter, with the name lifted clear | soft - tint stays on top, uniform and lighter, with the name lifted clear | ||
texture handles the paper grain: | texture handles the paper grain: | ||
no - drop it entirely | no - drop it entirely | ||
1/2/3 - one shared paper via the mix-blend overlay | 1/2/3 - one shared paper via the mix-blend overlay (does not cache) | ||
blend / blend1..3 - paper multiplied into the card art | blend / blend1..3 - paper multiplied into the card art (does not cache) | ||
mask / mask-inv / mask-soft - paper used as a mask over a dark tint, a clip | |||
rather than a blend, so it caches while scrolling. mask and mask-inv | |||
-->{{#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}}}}<!-- | differ in whether the grain reads from the paper's brightness or its | ||
alpha; mask-soft is a lighter luminance version. | |||
-->{{#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|mask=itembox-mask-texture itembox-mask-any-texture|mask-inv=itembox-mask-inv-texture itembox-mask-any-texture|mask-soft=itembox-mask-soft-texture itembox-mask-any-texture}}}}<!-- | |||
Links. | Links. | ||
Revision as of 21:44, 24 July 2026
Usage
{{ItemBox}} renders a Deadlock shop item as a card: icon, tier art, and the item name auto-sized to fit. Pass an item name and everything else — tier, slot, tags, image — is pulled from Module:ItemData.
{{ItemBox|Extended Magazine}}
Parameters
| Parameter | Description | Type | Status | |
|---|---|---|---|---|
| itemName | itemName 1 | Item name; keys into Module:ItemData. Positional.
| String | required |
| size | size | Scales the whole card. 1 = default (80px wide), 1.5 = 150%, 0.75 = 75%.
| Number | optional |
| showTierTag | showTierTag | Set to true to show the tier corner badge.
| Boolean | optional |
| lowGraphics | lowGraphics | Set to true for pages that place many cards at once (the card navboxes). Swaps the paper texture to a cacheable overlay so scrolling stays smooth; the look is nearly identical.
| Boolean | optional |
| overrideDisplayName | overrideDisplayName | Replaces the name shown on the card.
| String | optional |
| overrideTier | overrideTier | Replaces the card's tier.
| Number | optional |
| overrideSlot | overrideSlot | Replaces the card's background (type).
| String | optional |
| overrideIsActive | overrideIsActive | Forces the ACTIVE tag on or off.
| Boolean | optional |
| overrideIsImbue | overrideIsImbue | Forces the IMBUE tag on or off.
| Boolean | optional |
| overrideLinkTooltip | overrideLinkTooltip | Page the hover tooltip reads its info from.
| String | optional |
| overrideLinkImage | overrideLinkImage | Page/file the icon image comes from.
| String | optional |
| overrideLinkClick | overrideLinkClick | Page the card links to when clicked.
| String | optional |
Examples
Basic
{{ItemBox|Close Quarters}}
{{ItemBox|Spirit Shredder Bullets}}
{{ItemBox|Silencer}}
{{ItemBox|Extra Health}}
{{ItemBox|Echo Shard}}
{{ItemBox|Celestial Blessing}}
Tier tag
{{ItemBox|Extended Magazine|showTierTag = true}}
{{ItemBox|Berserker|showTierTag = true}}
{{ItemBox|Echo Shard|showTierTag = true}}
{{ItemBox|Celestial Blessing|showTierTag = true}}
Size
{{ItemBox|Extended Magazine|size = 0.75}}
{{ItemBox|Extended Magazine}}
{{ItemBox|Extended Magazine|size = 1.5}}
Low graphics
For pages that place many cards at once. The paper texture becomes a single cacheable overlay so scrolling stays smooth; the look is nearly identical.
{{ItemBox|Extra Health}}
{{ItemBox|Kinetic Dash}}
{{ItemBox|Metal Skin}}
{{ItemBox|Echo Shard}}
{{ItemBox|Extra Health|lowGraphics = true}}
{{ItemBox|Kinetic Dash|lowGraphics = true}}
{{ItemBox|Metal Skin|lowGraphics = true}}
{{ItemBox|Echo Shard|lowGraphics = true}}
Normal
Low graphics
Overrides
{{ItemBox|High-Velocity Rounds|overrideDisplayName = Test Name}}
{{ItemBox|Intensifying Magazine|overrideTier = 4}}
{{ItemBox|Weakening Headshot|overrideSlot = Spirit}}
{{ItemBox|Recharging Rush|overrideIsActive = true}}
{{ItemBox|Alchemical Fire|overrideIsImbue = true}}
{{ItemBox|Bullet Lifesteal|overrideLinkClick = Heroes}}
References
- Item data — Data:ItemData.json, read by Module:ItemData
- Name sizing and texture variety — Module:ItemBox
- Card styling — Template:ItemBox/styles.css