maniator / maniator/verticopolis

[Feature]: [P3] Top audio button opens a mini audio panel (mute + volume), not just instant-mute

Open
#483 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
TypeScript
Stars
5
Forks
1
PR merge metrics
No merged PRs in 30d

Description

Backlog story audio-button-panel. UX follow-on to the composed-music work (#479/#480); its own PR.

Problem / motivation

The top 🔊 button mutes everything in one tap, and that is the ONLY audio control most players ever see. The per-channel volume sliders (music vs. effects) live in the Settings dialog, which many players never open, so the common outcome is "music was a bit much, so I nuked all sound," and now that there is real music worth keeping, that is a loss. Idea from the owner: make the button surface the audio controls instead of only toggling mute.

Proposed solution (from an agent-party pass, 2026-07-17)

The party favored a small popover over the button rather than jumping straight to the full Settings dialog: tap the 🔊 button, a compact panel drops down with a mute toggle plus the music and SFX sliders, right where the eye already goes. Keep instant-mute reachable so the "panic button" muscle memory is not lost. Two shapes to decide between during design:

  • A. Popover with a mute toggle inside: tap opens the panel; mute is a toggle at the top of it (mute becomes two taps).
  • B. Split behavior: tap still mutes instantly (muscle memory preserved); a small caret or long-press opens the mini panel (power users keep the fast nuke, everyone else discovers the sliders).

Open questions the party raised (do not ship without answering)

  • Icon semantics: today 🔊/🔇 shows mute STATE at a glance. If the button becomes a menu-opener it is a door, not a state. Resolve what the icon conveys.
  • Accessibility: a toggle button and a menu button are different ARIA roles. Pick one and implement it honestly (the settings copy that says "The 🔊 button up top mutes everything" also needs updating).
  • Mobile: the popover and any long-press/caret must have real tap targets and not obscure the tower.

Scope / review

UI-plumbing with a real a11y + mobile surface: /bmad-code-review. Player-facing, so a version bump and changelog note when it ships. Independent PR; not part of #482.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start at the existing top audio button and the Settings copy that describes its mute behavior. Read the /bmad-code-review guidance, then resolve the interaction, icon semantics, ARIA role, and mobile behavior before implementation. Done includes the chosen mini-panel behavior plus the required version bump and changelog note.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
accessibility, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.