Skip to content

difficulty_ladder's glass HUD paints over section_map's bar #48

Description

@carochacs

Summary

plugins/difficulty_ladder/screen.js and plugins/section_map/ (feedBack-plugin-sectionmap) both independently render a difficulty/glass visualization from the same highway.getPhrases()/hasPhraseData()/getMastery() data (confirmed intentional, no shared API — see difficulty_ladder/INTEGRATION.md), but nobody coordinated their screen real estate:

  • section_map pins a ~20px bar to the very top of #player (top:0, full width, z-index:5) and draws small glass icons inline inside its own section blocks.
  • difficulty_ladder's ensureHudCanvas() (screen.js) creates a separate floating canvas (#dynamic-difficulty-hud) at top:8px; left:50%; transform:translateX(-50%); z-index:15, up to GLASS_MAX_H + 12 = 56px tall (y range ~8–64px).

Since difficulty_ladder's HUD has a higher z-index (15 > 5) and its vertical band (8–64px) overlaps section_map's bar (0–20px) at the horizontal center of the screen, whenever both plugins are active and the current song has phrase data, difficulty_ladder's translucent glass icons paint directly over the middle of section_map's bar — visually breaking/hiding the sections there.

Fix

Mirror the existing #section-map ~ #player-hud core CSS pattern (static/style.css) that already solves this exact conflict for the player HUD: offset difficulty_ladder's canvas below section_map's bar when it's present.

Patch applied locally in ensureHudCanvas():

```js
function _hudTopOffset() {
return document.getElementById('section-map') ? 28 : 8;
}
// ...
_hudCanvas.style.cssText =
'position:absolute;left:50%;transform:translateX(-50%);' +
'pointer-events:none;z-index:15;top:' + _hudTopOffset() + 'px;';
```

Checked once per canvas (re)creation rather than every rAF tick, consistent with this plugin's own per-frame-DOM-query rule in CLAUDE.md.

Note

This was found while investigating a separate report of section_map's bar not rendering at all (barExists: false in the reporter's DOM, independent of this overlap) — that root cause is still open and being tracked separately. This issue is scoped only to the z-index/positioning conflict between the two plugins' independent glass overlays when section_map's bar IS present.

Metadata

Metadata

Assignees

Labels

invalidThis doesn't seem right

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions