Skip to content

Replace section glasses with the shared difficulty tier rail #14

Closed

Description

@cchacs

Effort: L

Target File / Section

Category

Calibration | Consistency | Workflow

Flaw Analysis

Section Map currently embeds 12–20 px “glasses” inside each section block. Their physical size represents top_difficulty, their liquid height represents presented tier, and their fixed amber styling differs from Difficulty Ladder's standalone blue/gold/red canvas. The same data therefore changes visual meaning when Section Map is installed.

The glass also competes with already constrained section labels. Narrow sections lose readable space, while hover-only titles leave keyboard and assistive-technology users without the tier details.

Difficulty Ladder should stop emitting presentation fields such as glassSize; Section Map should render semantic tier data using its own layout while preserving a shared cross-plugin meaning.

Remediation

Implement the Section Map side of the Difficulty Ladder tier-rail redesign:

  1. Consume the new semantic contract (currentTier, topTier, maxTier, time range/context) rather than fillPercentage and glassSize.
  2. Replace .sm-glass with a compact tier rail along the bottom or edge of each section block. Lit segments indicate current tier and a distinct notch/outline marks the full-detail threshold.
  3. Preserve section labels and avoid inserting a fixed-width ornament into very narrow blocks. Collapse to a single marker when available width cannot show segments.
  4. Add focusable/readable detail: Section name · tier X of Y · full detail at Z.
  5. Use shared FeedBack color tokens and the same semantic states as Difficulty Ladder's standalone guide.
  6. Update only affected nodes when tier data changes; retain the current no-full-rerender behavior.
  7. Support the v2 event during a bounded transition, then delete _smRenderGlassFilling, .sm-glass, .sm-glass-fill, and glassSize handling.
  8. Add responsive, keyboard/accessibility, late-provider, malformed-payload, and narrow-section tests.

Base Section Map navigation must continue to work without Difficulty Ladder.

Activity

  1. pullfrog commented on Sep 26, 2026

    @pullfrog
  2. added theissue type on Sep 26, 2026
  3. pullfrog commented on Oct 5, 2026

    @pullfrog

    Staying open, deliberately. #13 closed this session, and it is worth being precise about where the boundary sits: the merged main commit b4ad015 (v1.3.0) hardened and documented the v2 glass contract, and its closing comment names the two follow-ups it did not take on. This issue is the second one.

    Nothing in this issue's remediation list has been started — the eight items (consume currentTier / topTier / maxTier, replace .sm-glass with a tier rail, preserve labels and collapse to a single marker on narrow blocks, add focusable detail, shared color tokens, targeted updates, a bounded v2 transition then delete _smRenderGlassFilling / .sm-glass / .sm-glass-fill / glassSize handling, and the responsive / a11y / late-provider / malformed-payload / narrow-section tests) are all still ahead.

    Two dependencies worth knowing before this is scheduled:

    • The peer side is feedback-plugin-difficulty-ladder#131 — item 1 (the semantic payload) needs Difficulty Ladder to stop emitting glassSize before the Section Map side can render tiers instead of glasses.
    • Item 7's bounded transition is safe to plan around today because Difficulty Ladder's own transition policy keeps emitting the frozen difficulty_ladder.sections.v2 event for un-upgraded consumers. That is the window this rework is meant to land in, and it is not closing.

    Base Section Map navigation has no dependency on any of this and is unaffected.

    Pullfrog  | View workflow run | via Pullfrog | Using big-pickle (free) | 𝕏

  4. pullfrog commented on Oct 17, 2026

    @pullfrog

    Issue #14 is complete and the PR is open.

    Implemented the semantic difficulty tier rail in place of the old glasses: v3 payload preferred (feature-detected via sectionsSchema) with a bounded v2 fallback, normalized payloads, responsive collapse-to-marker, focusable readable detail, in-place repaints via per-section signatures, and a resize re-decision. Glass code deleted; README/CLAUDE.md/plugin.json updated to 1.4.0; node tests/screen.test.js → 44/44.

    Self-review (reviewfrog) caught two issues I fixed before commit: tabindex wasn't managed on the in-place update path (a phantom focus stop), and the maxTier 0 easy case lost its outline in the segments form.

    PR: #18

    Task list (1/5 completed)
    • Rewrite screen.js: consume v3 semantic payload, render tier rails, v2 transition fallback, delete glass code
    • Update tests/screen.test.js: tier-rail, responsive/narrow, a11y, late-provider, malformed-payload
    • Update README.md, CLAUDE.md, plugin.json (description/capabilities/version)
    • Run node tests; self-review diff with reviewfrog
    • Commit, push branch, open PR

    Pullfrog  | View workflow run | via Pullfrog | Using big-pickle (free) | 𝕏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions