web-player-controller-mcp

WebPlayerControllerClient 관련 코드를 작성할 때 Claude가 API를 정확히 이해하고 도움을 줄 수 있도록 하는 개발용 MCP 서버입니다.

API 레퍼런스와 코드 예제를 제공하며, 별도 연결이나 설정 없이 바로 사용할 수 있습니다.

설치

Claude Desktop — claude_desktop_config.json에 직접 추가합니다.

| OS | 경로 | | ------- | --------------------------------------------------------------- | | macOS | ~/Library/Application Support/Claude/claude_desktop_config.json | | Windows | %APPDATA%\Claude\claude_desktop_config.json | | Linux | ~/.config/Claude/claude_desktop_config.json |

{
  "mcpServers": {
    "web-player-controller": {
      "command": "npx",
      "args": ["@catenoid/web-player-controller-mcp"]
    }
  }
}

Claude Code (CLI) — 다음 명령어를 실행합니다:

# Claude Code — 현재 프로젝트에만
claude mcp add web-player-controller npx @catenoid/web-player-controller-mcp

# Claude Code — 전체 프로젝트에서 사용
claude mcp add web-player-controller -s user npx @catenoid/web-player-controller-mcp

제공 도구 (Tools)

| 도구 | 설명 | | -------------- | ----------------------------------------- | | list_methods | 전체 메서드 목록 조회 | | list_events | 전체 이벤트 목록 조회 | | get_method | 특정 메서드의 시그니처·파라미터·설명 조회 | | get_event | 특정 이벤트의 페이로드·설명 조회 |

제공 리소스 (Resources)

| URI | 내용 | | ------------------- | ------------------------------------------------------- | | player://api | 생성자, 메서드, 이벤트, 타입 정의 전체 레퍼런스 | | player://examples | 초기화, 재생 제어, 이벤트 구독, React Hook 등 코드 예제 |

사용 예시

WebPlayerControllerClient로 재생/일시정지 토글 버튼 만들어 줘

e_progress 이벤트로 프로그레스 바 구현하는 React 컴포넌트 짜 줘

플레이어 초기화 코드 예제 보여 줘

화질 변경 드롭다운 UI 코드 작성해 줘