webchat-audio-notifications

What This Skill Does

The webchat-audio-notifications skill provides a robust, configurable audio alert system designed for Moltbot and Clawdbot webchat interfaces. At its core, the skill intelligently monitors the visibility state of the user's browser tab. When a new message arrives, it evaluates whether the user is actively viewing the page. If the tab is in the background, it triggers an audio notification to ensure the user stays informed of incoming communications without requiring them to keep the chat window focused at all times. This prevents missed messages while maintaining a non-intrusive user experience.

The system includes five distinct intensity levels, ranging from a subtle "whisper" for soft pings to an "impossible-to-miss" alert for urgent mentions. It supports custom sound file uploads (MP3, WAV, OGG, WebM), persistent local storage to remember user preferences, and a configurable cooldown period of three seconds to prevent audio spamming during high-volume chat traffic.

Installation

To install this skill, use the ClawHub command-line interface within your project environment:

clawhub install openclaw/skills/skills/brokemac79/webchat-audio-notifications

Once installed, integrate it by initializing the WebchatNotifications object with your preferred soundPath and defaultVolume. It is recommended to call the init() method after your audio engine (Howler) has loaded to ensure proper browser compatibility and state management.

Use Cases

This skill is ideal for customer support dashboards, collaborative team chat applications, and personal productivity tools where users need to multitask. It allows users to browse other content while remaining tethered to the chat activity. Furthermore, developers can map different intensity levels to specific events, such as using a subtle sound for general messages and the loudest intensity for direct mentions or critical system alerts.

Example Prompts

1. "Moltbot, please set the notification intensity to level 4 so I can hear when my manager messages me."
2. "Enable webchat audio notifications and set the volume to 50% for my current session."
3. "Disable the notification sounds while I am in a meeting, but keep the current intensity settings for later."

Tips & Limitations

To maximize the utility of this skill, ensure that your site handles autoplay policies correctly, as modern browsers often block audio until a user has interacted with the page. The skill includes an enableButton configuration to help prompt users to interact with the audio system early. Note that on mobile browsers, support may be limited by strict power-saving and media-playback constraints. Always test the intensity levels in the development environment to find the right balance for your specific user base.