JSPM

@markharrison/markjsaudio

1.20251226.6
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1
  • Score
    100M100P100Q34297F
  • License MIT

A reusable audio system for web applications.

Package Exports

  • @markharrison/markjsaudio
  • @markharrison/markjsaudio/markjsaudio

Readme

MarkJSAudio

🎵 MarkJSAudio - A comprehensive JavaScript audio library for web games and interactive applications

npm version License: MIT

Overview

MarkJSAudio is a modern JavaScript audio library built on the Web Audio API, designed specifically for web games. It provides high-level functionality for managing sound effects (SFX) and background music with advanced features like volume control, smooth transitions, and seamless audio management.

Key Features

  • 🚀 Modern Web Audio API - Low-latency, high-performance audio processing
  • 🎼 Dual Audio Types - Optimized handling for SFX (short, frequent) and Music (long, streaming)
  • 🔊 Simultaneous Playback - Play multiple audio sources at the same time
  • 🎛️ Advanced Volume Control - Separate controls for master, music, and SFX volumes
  • 🌊 Smooth Transitions - Crossfade between music tracks with customizable timing
  • 📦 ArrayBuffer Support - Load audio directly from raw ArrayBuffer data
  • Preloading Workflow - Fetch audio before user interaction, decode after AudioContext is available
  • 📱 Browser Compatibility - Works with modern browsers (Chrome, Firefox, Safari, Edge)
  • 🎯 Format Support - MP3 and WAV audio formats
  • Easy Integration - Simple API with comprehensive error handling

Installation

npm install @markharrison/markjsaudio --save

Quick Start

import { MarkJSAudio } from "@markharrison/markjsaudio";

// Create and initialize
const audioMark = new MarkJSAudio();
await audioMark.initialize(); // Call after user interaction

// Load audio files
await audioMark.loadAudio("bgmusic", "path/to/music.mp3");
await audioMark.loadAudio("jump", "path/to/jump.wav");

// Alternative: Load from ArrayBuffer
const response = await fetch("path/to/sound.wav");
const arrayBuffer = await response.arrayBuffer();
await audioMark.loadFromArrayBuffer("sound", arrayBuffer);

// Preload audio before user interaction (optimized workflow)
await audioMark.preloadAudio("gamemusic", "path/to/game.mp3");
// ... after user interaction and initialize() ...
await audioMark.processAllPreloadedAudio();

// Play background music
audioMark.playMusic("bgmusic", { loop: true });

// Play sound effects
audioMark.playSFX("jump");

// Control volumes (0-100)
audioMark.setVolume("master", 80);
audioMark.setVolume("music", 60);
audioMark.setVolume("sfx", 90);

Documentation

See the complete documentation for detailed usage instructions and examples.

Test Application

image

Open index.html in your browser to see the comprehensive test interface with:

  • File loading and unloading
  • ArrayBuffer & Preloading functionality - Test the new preload/process workflow
  • Music and SFX playback controls
  • Volume controls
  • Smooth music transitions
  • Real-time logging

Browser Requirements

MarkJSAudio requires modern browsers with Web Audio API support:

  • Chrome 66+
  • Firefox 60+
  • Safari 14.1+
  • Edge 79+

License

MIT License - see LICENSE file for details.