<title>SoundManager 2: JavaScript Sound For The Web</title>
<metaname="robots"content="noindex"/>
<metaname="description"content="Play sound from JavaScript including MP3, MPEG-4 and HTML5-supported audio formats with SoundManager 2, a cross-browser/platform sound API. BSD licensed."/>
if (!window.location.href.toString().match(/sm2-usehtml5audio/i)) {
soundManager.useHTML5Audio = true; // w00t.
}
soundManager.useFlashBlock = true;
soundManager.bgColor = '#ffffff';
soundManager.debugMode = false;
soundManager.url = 'swf/';
soundManager.wmode = 'transparent'; // hide initial flash of white on everything except firefox/win32
var PP_CONFIG = {
autoStart: false, // begin playing first sound when page loads
playNext: true, // stop after one sound, or play through list until end
useThrottling: false, // try to rate-limit potentially-expensive calls (eg. dragging position around)</span>
usePeakData: true, // [Flash 9 only] whether or not to show peak data (left/right channel values) - nor noticable on CPU
useWaveformData: false,// [Flash 9 only] show raw waveform data - WARNING: LIKELY VERY CPU-HEAVY
useEQData: false, // [Flash 9 only] show EQ (frequency spectrum) data
useFavIcon: false, // try to apply peakData to address bar (Firefox + Opera) - performance note: appears to make Firefox 3 do some temporary, heavy disk access/swapping/garbage collection at first(?) - may be too heavy on CPU
useMovieStar: true // Flash 9.0r115+ only: Support for a subset of MPEG4 formats.
}
if (navigator.platform.match(/win32/i) && navigator.userAgent.match(/firefox/i)) {
// extra-special homepage case (you should never see this), prevent out-of-view SWF load failure WITH high performance AND flashblock AND SWF in a placed element
if (!window.location.toString().match(/sm2\-ignorebadua/i) && _ua.match(/safari/i) && !_ua.match(/chrome/i) && _ua.match(/OS X 10_6_(3|4|5)/i)) { // Safari 4 and 5 occasionally fail to load/play HTML5 audio on Snow Leopard due to bug(s) in QuickTime X and/or other underlying frameworks. :/ Known Apple "radar" bug. https://bugs.webkit.org/show_bug.cgi?id=32159
var complaint = document.createElement('li');
complaint.innerHTML = '<b>Note</b>: HTML5 audio disabled for this browser/OS due to load/play failures in Safari 4 + 5 on Snow Leopard 10.6.3/4/5, caused by bugs in QuickTime X and/or underlying frameworks. See <ahref="https://bugs.webkit.org/show_bug.cgi?id=32159#c9">bugs.webkit.org #32519</a>. (Safari on Leopard + Win32, and iPad OK, however.)<br>Try <ahref="?sm2-ignorebadua">HTML5 anyway?</a> ("water drop" MP3 playback seems to fail most often.)';
_id('html5-audio-notes').appendChild(complaint);
}
}
soundManager.onready(function() {
_id('sm2-support').style.display = 'none';
doChristmasLights();
// if using HTML5, show some additional format support info
// written while watching The Big Lebowski for the Nth time. Donny, you're out of your element!
li.innerHTML = 'This browser\'s <emclass="true"><HTML5></em> vs. <emclass="partial">Flash</em> support (best guess):<b>' + items.join('') + '</b>' + (!soundManager._use_maybe ? ' (Try <ahref="#sm2-useHTML5Maybe=1"onclick="window.location.href=this.href;window.location.reload()"title="Try using probably|maybe for HTML5 Audio().canPlayType(), more buggy but may get HTML5 support on Chrome/OS X and other browsers.">less-strict HTML5 checking</a>?)' : ' (allowing <b>maybe</b> for <code>canPlayType()</code>, less-strict HTML5 audio support tests)');
_id('html5-audio-notes').appendChild(li);
_id('without-html5').style.display = 'inline';
} else {
_id('without-html5').style.display = 'none';
}
checkBadSafari();
// check inline player / HTML 5 bits
var items = _id('muxtape-html5').getElementsByTagName('a');
for (var i = 0, j = items.length; i <j;i++){
if (!soundManager.canPlayLink(items[i])) {
items[i].className += ' not-supported';
items[i].title += ' \n\nNOTE: Format apparently not supported by this browser.';
}
}
});
soundManager.ontimeout(function() {
// failed to load
var o = _id('sm2-support');
var smLoadFailWarning = '<divstyle="margin:0.5em;margin-top:-0.25em"><h3>Oh snap!</h3><p>' + (soundManager.hasHTML5 ? 'The flash portion of ' : '') + 'SoundManager 2 was unable to start. ' + (soundManager.useHTML5Audio ? (soundManager.hasHTML5 ? '</p><p>Partial HTML5 Audio() is present, but flash is needed for MP3 and/or MP4 support.' : '<br>(No HTML5 Audio() support found, either.)') : '') + '<br>All links to audio will degrade gracefully.</p><pid="flashblocker">If you have a flash blocker, try allowing the SWF to run - it should be visible above.</p><pid="flash-offline">' + (!soundManager._overHTTP ? '<b>Viewing offline</b>? You may need to change a Flash security setting.' : 'Other possible causes: Missing .SWF, or no Flash?') + ' Not to worry, as guided help is provided.</p><p><ahref="doc/getstarted/index.html#troubleshooting"class="feature-hot">Troubleshooting</a></p></div>';
var hatesFlash = (navigator.userAgent.match(/(ipad|iphone)/i));
o.innerHTML = smLoadFailWarning;
if (hatesFlash || soundManager.getMoviePercent()) {
// movie loaded at least somewhat, so don't show flashblock things
_id('flashblocker').style.display = 'none';
if (hatesFlash) {
// none of that here.
_id('flash-offline').style.display = 'none';
}
}
o.style.marginBottom = '1.5em';
o.style.display = 'block';
});
// side note: If it's not december but you want to smash things, try #christmas=1 in the homepage URL.
<pstyle="margin-top:0.5em">By wrapping and extending HTML5 and Flash Audio APIs, SoundManager 2 brings reliable cross-platform audio to JavaScript. <ahref="doc/getstarted/#intro"class="cta"style="white-space:nowrap">How it works <span>»</span></a></p>
<h3class="wedge"style="border-bottom:none;margin-top:0px">360° Player UI<spanclass="l"></span><spanclass="r"></span><ahref="demo/360-player/"title="360° Player UI demo"class="cta-more">More »</a></h3>
<li><ahref="http://freshly-ground.com/data/audio/sm2/20060924%20-%20Ghosts%20&%20Goblins%20Reconstructed.ogg"title="OGG sound format, requires HTML5 Audio() support to play"class="button-exclude inline-exclude threesixty-exclude"style="font-size:0.8em">Ghosts+Goblins Reconstructed <spanclass="sidenote">(OGG)</span></a></li>
<li><ahref="http://freshly-ground.com/data/audio/sm2/bottle-pop.wav"title="WAV sound format, requires HTML5 Audio() support to play"class="button-exclude inline-exclude threesixty-exclude"style="font-size:0.8em">A corked beer bottle <spanclass="sidenote">(WAV)</span></a></li>
</ul>
<pclass="note"style="margin-top:3px;margin-bottom:0px;margin-left:0.8em">More: <ahref="demo/api/"title="SoundManager 2 API examples">API</a> | <ahref="demo/mpc/"title="SoundManager 2 MPC/Drum Machine demo">Drum Machine</a> | <ahref="demo/animation/"title="SoundManager 2 DOM / Animation demos"class="exclude">Animation</a></p>
<spanid="without-html5"style="display:none"><ahref="#sm2-usehtml5audio=0"onclick="document.location.href=this.href;document.location.reload()"title="View this page without HTML5 Audio support">-html5</a> | </span>
<ahref="#debug=1"id="with-debug"title="View this page with debug output mode enabled (console.log() or HTML-based)"onclick="document.location.href=this.href;document.location.reload()">+debug</a>
<h4style="clear:left;margin-top:0.5em">HTML5 Audio Support <spanstyle="color:#888">(Beta-ish)</span></h4>
<ulid="html5-audio-notes"class="standard">
<li>100% Flash-free MP3 + MP4/AAC where supported. Works on iPad, iPhone iOS 4</li>
<li>Fallback to Flash for MP3/MP4 support, as needed</li>
<li>SM2 API is unchanged, transparent; HTML5/Flash switching handled internally</li>
<li>HTML5 API support approximates Flash 8 API features, minus ID3, plus buffering</li>
<li>Some other formats (WAV/OGG) supported via HTML5, depending on browser</li>
<li>See <ahref="doc/#soundmanager-usehtml5audio"title="soundManager.useHTML5Audio HTML5 Audio() support feature documentation">soundManager<wbr>.useHTML5Audio</a> for implementation details</li>
<li>RTMP / Flash Media Server streaming support (experimental) - see <ahref="doc/#smsound-serverurl"title="SMSound.serverURL parameter">serverURL</a> for details</li>
<li>Community-based <ahref="http://getsatisfaction.com/schillmania/products/schillmania_soundmanager_2"title="discussion/support for SoundManager 2 on Get Satisfaction">discussion/support</a></li>
<h2><ahref="http://getsatisfaction.com/schillmania/products/schillmania_soundmanager_2/"title="User discussion, FAQs and support for SoundManager 2"rel="nofollow">Discussion / Support</a><spanclass="l"></span><spanclass="r"></span></h2>
<divid="gsfn_content"></div>
<divclass="powered_by"><ahref="http://getsatisfaction.com/">Get Satisfaction support network</a></div>
</div>
<!-- /.box -->
</div>
<!-- /main -->
</div>
<!-- /content -->
</div>
<divid="control-template">
<!-- control markup inserted dynamically after each link -->
