ext-apps/examples/sheet-music-server
Repository files (latest commit first)
Filename Latest commit message Latest commit date
Jonathan Hefner 94bc708963 Replace deprecated RESOURCE_URI_META_KEY with _meta.ui.resourceUri
Update all example servers to use the new recommended metadata format
for associating UI resources with tools. The old `RESOURCE_URI_META_KEY`
constant is deprecated in favor of the nested `_meta.ui.resourceUri`
structure.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-12 13:00:11 -06:00
..
src feat: publish example servers to npm (#184) 2026-01-08 20:08:50 +00:00
mcp-app.html Add sheet-music-server example 2026-01-05 16:06:09 -06:00
package.json chore: release 0.3.1 (#224) 2026-01-09 18:22:27 +00:00
README.md Add sheet-music-server example 2026-01-05 16:06:09 -06:00
server-utils.ts fix: add error handling for server startup failures (#236) 2026-01-11 16:52:55 +00:00
server.ts Replace deprecated RESOURCE_URI_META_KEY with _meta.ui.resourceUri 2026-01-12 13:00:11 -06:00
tsconfig.json Add sheet-music-server example 2026-01-05 16:06:09 -06:00
vite.config.ts Add sheet-music-server example 2026-01-05 16:06:09 -06:00

Example: Sheet Music Server

A demo MCP App that renders ABC notation as sheet music with interactive audio playback using the abcjs library.

Twinkle, Twinkle Little Star Playing on repeat

Features

  • Audio Playback: Built-in audio player with play/pause and loop controls
  • Sheet Music Rendering: Displays ABC notation as properly formatted sheet music

Running

  1. Install dependencies:

    npm install
    
  2. Build and start the server:

    npm run start:http  # for Streamable HTTP transport
    # OR
    npm run start:stdio  # for stdio transport
    
  3. View using the basic-host example or another MCP Apps-compatible host.

Tool Input

When calling the play-sheet-music tool, provide ABC notation:

{
  "abcNotation": "X:1\nT:C Major Scale\nM:4/4\nL:1/4\nK:C\nC D E F | G A B c |"
}

ABC Notation Examples

C Major Scale:

X:1
T:C Major Scale
M:4/4
L:1/4
K:C
C D E F | G A B c |

Twinkle, Twinkle Little Star:

X:1
T:Twinkle, Twinkle Little Star
M:4/4
L:1/4
K:C
C C G G | A A G2 | F F E E | D D C2 |
G G F F | E E D2 | G G F F | E E D2 |
C C G G | A A G2 | F F E E | D D C2 |

Architecture

Server (server.ts)

Exposes a single play-sheet-music tool that accepts:

  • abcNotation: ABC notation string to render

The tool validates the ABC notation server-side using the abcjs parser and returns any parse errors. The actual rendering happens client-side when the UI receives the tool input.

App (src/mcp-app.ts)

  • Receives ABC notation via ontoolinput handler
  • Uses abcjs for audio playback controls and sheet music rendering (in renderAbc())