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

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions