Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 699 lines (524 sloc) 34.011 kB
1938714 @scottschiller Special 10-year "SM2 <3 You" thank-you header notice, and validation …
authored
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3 <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
4 <head>
5834f7b Documentation/demo UI tweaks, updates
Scott Schiller authored
5 <title>SoundManager 2: JavaScript Sound For The Web</title>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
6 <meta name="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."/>
7 <meta name="keywords" content="javascript sound, html5 audio, html5 sound, javascript audio, javascript play mp3, javascript sound control, mp3, mp4, mpeg4, aac, Scott Schiller, Schill, Schillmania"/>
8 <meta name="author" content="Scott Schiller"/>
9 <meta name="copyright" content="Copyright (C) 1997 onwards Scott Schiller"/>
10 <meta name="language" content="en-us"/>
11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
12
13 <!-- inline demo CSS (combined + minified for performance; see comments for raw source URLs) -->
14 <link rel="stylesheet" type="text/css" href="demo/index-rollup.css"/>
15
16 <!-- the SoundManager 2 API -->
f05046f Appease the W3C gods
Scott Schiller authored
17 <script type="text/javascript" src="script/soundmanager2.js"></script>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
18
4a8eb81 V2.95a.20090501: New allowFullVideo, onfullscreenchange(), SMSound.on…
Scott Schiller authored
19 <!-- 360 UI demo, canvas magic for IE -->
f516a0a Minor layout tweaks
Scott Schiller authored
20 <!--[if lt IE 9]><script type="text/javascript" src="demo/360-player/script/excanvas.js"></script><![endif]-->
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
21
22 <!-- SM2 demo/homepage-specific stuff -->
f05046f Appease the W3C gods
Scott Schiller authored
23 <script type="text/javascript">var is_home = true;</script>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
24
25 <!-- inline demo JS (combined + minified; see comments for raw source URLs) -->
26 <script type="text/javascript" src="demo/index-rollup.js"></script>
f516a0a Minor layout tweaks
Scott Schiller authored
27 <!-- IE CSS font hax -->
28 <!--[if lte IE 8]>
29 <style>
30 h2.special {
31 /* IE 6-8 font reset, doesn't like sort-of-defined @font-family */
32 font-family:"helvetica neue",helvetica,arial,verdana,tahoma,"sans serif";
33 }
34 </style>
35 <![endif]-->
1938714 @scottschiller Special 10-year "SM2 <3 You" thank-you header notice, and validation …
authored
36 <style type="text/css">
37 /* "SM2 loves you" */
38 #heart {
39 line-height: 1em;
40 padding-top: 0px;
41 text-indent: 1em;
42 }
43
44 #heart-icon {
45 width: auto;
46 font-family: arial;
47 color: red;
48 font-size: 48px;
49 }
50 </style>
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
51 </head>
52
f22660a Big docs update, meaningful #links for API methods, alphabetized, cor…
Scott Schiller authored
53 <body class="home">
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
54
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
55 <div id="content">
8c1b058 V2.94a.20090206: New isBuffering + onbufferchange() (flash 9), soundM…
Scott Schiller authored
56
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
57 <div id="lights"></div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
58
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
59 <div id="top">
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
60
61 <h1>A JavaScript Sound API supporting MP3, MPEG4 and HTML5 Audio.</h1>
62
63 <div id="nav">
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
64 <div id="version" title="Version of SM2 loaded on this page"></div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
65 <ul>
66 <li>
67 <strong><a href="#home">Home</a></strong>
68 </li>
69 <li>
70 <a href="#">Demos</a>
71 <ul>
bc843c8 @scottschiller Upgrading to soundManager.setup({...}) for most configuration cases (…
authored
72 <li><a href="demo/template/">Basic Template</a></li>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
73 <li><a href="demo/api/">API Examples</a></li>
74 <li><a href="demo/play-mp3-links/">Playable MP3 links</a></li>
75 <li><a href="demo/mp3-player-button/" class="exclude">Basic MP3 Play Button</a></li>
76 <li><a href="demo/page-player/">Muxtape-style UI</a></li>
77 <li><a href="demo/360-player/">360&deg; Player UI</a></li>
78 <li><a href="demo/mpc/">Drum Machine (MPC)</a></li>
79 <li><a href="demo/animation/">DOM/Animation Demos</a></li>
80 <li><a href="demo/flashblock/">FlashBlock Handling</a></li>
81 </ul>
82 </li>
83 <li>
84 <a href="doc/getstarted/">Getting Started</a>
85 <ul>
86 <li><a href="doc/getstarted/#how-sm2-works">How SoundManager 2 works</a></li>
87 <li><a href="doc/getstarted/#basic-inclusion">Including SM2 on your site</a></li>
88 <li><a href="doc/getstarted/#troubleshooting">Troubleshooting</a></li>
89 </ul>
90 </li>
91 <li>
92 <a href="doc/">Documentation</a>
93 <ul>
94 <li><a href="doc/#sm-config">SoundManager Properties</a></li>
95 <li><a href="doc/#sound-object-properties">Sound Object Properties</a></li>
96 <li><a href="doc/#smdefaults">Global Sound Defaults</a></li>
97 <li><a href="doc/#api">SoundManager Core API</a></li>
98 <li><a href="doc/#smsoundmethods">Sound Object (SMSound) API</a></li>
aeefdbd @scottschiller Nice-looking generated docs via Rocco (a Ruby port of Docco.) Minor d…
authored
99 <li><a href="doc/generated/script/soundmanager2.html">Generated Documentation</a></li>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
100 </ul>
101 </li>
102 <li>
103 <a href="doc/download/">Download</a>
104 <ul>
105 <li><a href="doc/download/#latest">Get SoundManager 2</a></li>
106 <li><a href="doc/download/#revision-history">Revision History</a></li>
107 </ul>
108 </li>
109 <li>
110 <a href="doc/technotes/">Technical Notes</a>
111 <ul>
112 <li><a href="doc/technotes/#requirements">System Requirements</a></li>
113 <li><a href="doc/technotes/#debug-output">Debug + Console Output</a></li>
114 </ul>
115 </li>
116 <li>
117 <a href="doc/resources/">Resources</a>
118 <ul>
119 <li><a href="doc/resources/#licensing">Licensing</a></li>
120 <li><a href="doc/resources/#related">Related Projects</a></li>
121 <li><a href="http://getsatisfaction.com/schillmania/products/schillmania_soundmanager_2/">SM2 support / discussion</a></li>
122 <li><a href="http://www.schillmania.com/content/react/contact/">Contact Info @ Schillmania.com</a></li>
123 </ul>
124 </li>
125 </ul>
126 <div class="clear"></div>
8c1b058 V2.94a.20090206: New isBuffering + onbufferchange() (flash 9), soundM…
Scott Schiller authored
127 </div>
82e2326 Homepage doc/demo layout/copy updates
Scott Schiller authored
128 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
129
07e9e6e @scottschiller Homepage layout updates: More circles, radii and a bit of texturing.
authored
130 <div id="main-wrapper">
131
132 <div id="main" class="triple">
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
133
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
134 <div id="col3" class="c3">
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
135
ac816b2 @scottschiller More transitions, extravagant "glowy" download button and homepage de…
authored
136 <div id="support-wrapper">
137 <div id="get-satisfaction" class="box">
138 <div id="gsfn_list_widget">
139 <h2><a href="http://getsatisfaction.com/schillmania/products/schillmania_soundmanager_2/" title="User discussion, FAQs and support for SoundManager 2" rel="nofollow">Discussion / Support</a><span class="l"></span><span class="r"></span></h2>
140 <div id="gsfn_content">
141 </div>
142 <div class="powered_by">
61551de @scottschiller Update GSFN links
authored
143 <a href="http://getsatisfaction.com/" rel="nofollow">Get Satisfaction support network</a>
ac816b2 @scottschiller More transitions, extravagant "glowy" download button and homepage de…
authored
144 </div>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
145 </div>
ac816b2 @scottschiller More transitions, extravagant "glowy" download button and homepage de…
authored
146 <!-- /.box -->
147 </div>
148
149 <div id="sm2-options">
150 <p>
151 SM2 options:&nbsp; <span id="with-html5"><a href="?sm2-usehtml5audio=1" title="View this page with HTML5 audio support enabled">+html5</a></span>
152 <span id="options-divider-with-html5" class="options-divider">&nbsp;|&nbsp;</span>
153 <span id="without-html5"><a href="?sm2-usehtml5audio=0" title="View this page with HTML5 audio support disabled">-html5</a></span>
154 <span id="options-divider-without-html5" class="options-divider">&nbsp;|&nbsp;</span>
155 <span id="with-debug"><a href="#debug=1" 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></span>
156 </p>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
157 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
158
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
159 </div>
160
161 <!-- /main -->
162 </div>
163
164 <div id="live-demos" class="columnar">
82e2326 Homepage doc/demo layout/copy updates
Scott Schiller authored
165
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
166 <div id="about-sm2">
1d020d0 Home demo/UI updates
Scott Schiller authored
167
80411dd @scottschiller Homepage UI tweaks
authored
168 <div id="about-header">
169
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
170 <div id="sm2-support-warning">
171 <!-- as needed, warning is displayed here -->
172 </div>
82e2326 Homepage doc/demo layout/copy updates
Scott Schiller authored
173
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
174 <div class="sm2-speaker">
175 <img src="demo/_image/soundmanager2-speaker.png" alt="SoundManager 2 speaker logo" class="ie6sucks" />
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
176 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
177
baed3eb @scottschiller Larger speaker and ZOMG responsive design elements (larger font sizes…
authored
178 <h2 class="special">SoundManager 2 makes it easier to play audio using JavaScript.</h2>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
179
baed3eb @scottschiller Larger speaker and ZOMG responsive design elements (larger font sizes…
authored
180 <p style="line-height:2em">
181 Using HTML5 and Flash, SoundManager 2 provides reliable cross-platform audio under a single JavaScript API.&nbsp; <a href="doc/download/" title="Download SoundManager 2" class="feature" style="font-family:helvetica;font-weight:bold;margin:0px;white-space:nowrap">Get SoundManager 2</a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
182 </p>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
183
80411dd @scottschiller Homepage UI tweaks
authored
184 </div>
1d020d0 Home demo/UI updates
Scott Schiller authored
185
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
186 <hr />
1d020d0 Home demo/UI updates
Scott Schiller authored
187
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
188 <div class="threeup first">
1d020d0 Home demo/UI updates
Scott Schiller authored
189
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
190 <div class="column">
191 <div class="column-wrapper">
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
192
193 <h3>Speak and <b style="white-space:nowrap">be heard<span class="music-note icon"></span></b></h3>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
194 <h4>More sound, <b>in more places</b></h4>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
195
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
196 <p>Despite being one of the senses, sound has largely been missing from the web due to inconsistent technology support. SoundManager 2 bridges this gap, making it easier to use audio across a growing variety of devices and platforms, both desktop and mobile.</p>
d9ef8d1 Prep for next release: HTML5, homepage + stylistic updates, source co…
Scott Schiller authored
197
5720c1b @scottschiller +experimental demo, content shuffle ("getting started" up higher)
authored
198 <p><a href="#getting-started" class="cta">Getting started</a> is pretty easy, too.</p>
199
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
200 <p>A few live examples:</p>
d9ef8d1 Prep for next release: HTML5, homepage + stylistic updates, source co…
Scott Schiller authored
201
ac816b2 @scottschiller More transitions, extravagant "glowy" download button and homepage de…
authored
202 <div id="sm2-support" class="demo-block">
203 <!-- "oh snap", SM2 didn't load etc. messaging -->
204 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
205
80411dd @scottschiller Homepage UI tweaks
authored
206 <div style="position:relative;*zoom:1;min-width:275px">
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
207
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
208 <div id="special-demo-left" class="sm2-inline-list">
1d020d0 Home demo/UI updates
Scott Schiller authored
209
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
210 <div class="ui360">
42ce081 @scottschiller Remove sm2_link class (layout fix)
authored
211 <a href="demo/_mp3/office_lobby.mp3" class="norewrite exclude button-exclude inline-exclude">Office lobby sound</a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
212 </div>
1d020d0 Home demo/UI updates
Scott Schiller authored
213
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
214 <div class="ui360" style="float:left;display:inline">
215 <a href="demo/_mp3/mak.mp3" title="360 demo: Angry Cow Sound" class="norewrite exclude button-exclude inline-exclude">Random</a>
216 </div>
1d020d0 Home demo/UI updates
Scott Schiller authored
217
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
218 <div class="ui360" style="float:left;display:inline">
219 <a href="http://freshly-ground.com/data/audio/sm2/water-drop.mp3" title="360 Demo: Water Drop" class="exclude button-exclude inline-exclude">Water Drop</a>
220 </div>
1d020d0 Home demo/UI updates
Scott Schiller authored
221
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
222 <div class="demo-more-abs" style="margin-right:1.5em">
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
223 <a href="demo/360-player/" title="360&deg; UI player demo" class="cta">360&deg; UI <span>&raquo;</span></a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
224 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
225
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
226 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
227
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
228 <div id="special-demo-right">
229 <a href="demo/_mp3/coins.mp3" title="Play &quot;Change&quot;" class="sm2_button exclude inline-exclude norewrite">coins.mp3</a>
230 &nbsp;&nbsp; <a href="demo/christmas-lights/sound/glass0.mp3" class="sm2_button exclude inline-exclude norewrite" title="Play &quot;Glass break 1&quot;">glass0.mp3</a>
231 &nbsp;&nbsp; <a href="demo/christmas-lights/sound/glass1.mp3" class="sm2_button exclude inline-exclude threesixty-exclude norewrite" title="Play &quot;Glass break 2&quot;">glass1.mp3</a>
1d020d0 Home demo/UI updates
Scott Schiller authored
232
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
233 <div class="demo-more-abs">
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
234 <a href="demo/mp3-player-button/" title="MP3 buttons demo" class="cta">mp3 buttons <span>&raquo;</span></a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
235 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
236
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
237 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
238
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
239 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
240
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
241 </div>
242 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
243
244
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
245 <div class="column">
246 <div class="column-wrapper">
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
247
2798213 @scottschiller More verbiage tweaking
authored
248 <h3>HTML5 + flash <b style="white-space:nowrap">hybrid<span class="package icon"></span></b></h3>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
249 <h4>Complexity, <b>reduced</b></h4>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
250
251 <p>Supporting HTML5 audio can be tedious in modern browsers, let alone legacy ones. With real-world visitors using browsers ranging from mobile Safari to IE 6 across a wide range of devices, there can be many support cases to consider.</p>
252
2798213 @scottschiller More verbiage tweaking
authored
253 <p>SoundManager 2 gives you a single, powerful API that supports both new and old, using HTML5 audio where supported and optional Flash-based fallback where needed. Ideally when using SoundManager 2, audio "just works."</p>
36bad06 @scottschiller More homepage tweaks
authored
254
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
255 <div class="icons">
256 <ul>
257 <li class="desktop" title="Desktop support: Windows, Mac OS, Linux">Desktop support: Windows, Mac OS, Linux</li>
258 <li class="laptop" title="Laptop/tablet support: Windows, Mac OS, Linux / Blackberry Playbook, Kindle Fire + other HTML5/Flash devices">Laptop/tablet support: Windows, Mac OS, Linux / Blackberry Playbook, Kindle Fire + other HTML5/Flash devices</li>
259 <li class="iphone" title="iPhone support: iPhone with iOS 4.0 and newer">iPhone support: iOS 4.0 and newer</li>
260 <li class="ipad" title="iPad support: Version 1.0 (iOS 3.2) and newer">iPad support: Version 1.0 (iOS 3.2) and newer</li>
261 <li class="android" title="Android platforms supporting HTML5 and/or Flash">Android platforms supporting HTML5 and/or Flash</li>
262 </ul>
36bad06 @scottschiller More homepage tweaks
authored
263 The details: <a href="doc/getstarted/#intro" class="cta" style="text-align:right">how it works <span>&raquo;</span></a>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
264 </div>
265
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
266 </div>
267 </div>
268
269 <div class="column">
270 <div class="column-wrapper">
54a358a @scottschiller Updated documentation + downloads for V2.97a.20120513
authored
271 <h3 style="cursor:help" title="Gzip-compressed file size on a typical set-up is 11 KB. And was it supposed to be the &quot;Swiss Army&quot; kind? I forget.">The ginsu knife: <b style="white-space:nowrap">11 KB<span style="color:#999">*</span><span class="performance icon"></span></b></h3>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
272 <h4>Big&nbsp;features, <b>small footprint</b></h4>
273 <p><em>But wait, there's more!</em></p>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
274 <div>
54a358a @scottschiller Updated documentation + downloads for V2.97a.20120513
authored
275 <p>Performance is an important metric, too. SoundManager 2 packs a comprehensive, feature-rich API into as little as <a href="doc/getstarted/#basic-inclusion" title="SoundManager 2: Build options (down to ~11 KB in size)" style="white-space:nowrap" class="cta">11 KB</a> over the wire when optimized; that's less than 8% of the original, uncompressed file size.</p>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
276 </div>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
277 <p>The source code is BSD-licensed and is provided in fully-commented, non-debug and compiler-optimized "minified" versions appropriate for development and production use.</p>
54a358a @scottschiller Updated documentation + downloads for V2.97a.20120513
authored
278 <p class="sidenote">* Gzip-compressed file size on a typical set-up is 11 KB. And was it supposed to be the <i>Swiss Army</i> kind? I forget.</p>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
279 </div>
280 </div>
8c1b058 V2.94a.20090206: New isBuffering + onbufferchange() (flash 9), soundM…
Scott Schiller authored
281
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
282 </div>
283
284
285 <div class="threeup">
286
287 <div class="column">
288 <div class="column-wrapper">
289
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
290 <h3>Basic</h3>
bf728cc @scottschiller More homepage tweaks
authored
291 <h4>Playable <b>links and playlists</b></h4>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
292
293 <p>These demos use unordered lists with MP3 links that play in-place; the UI is easily customized via CSS.</p>
294
295 <ul class="graphic">
296 <li><a href="demo/_mp3/rain.mp3" class="exclude">Rain</a></li>
297 <li><a href="demo/_mp3/walking.mp3" class="exclude">Walking</a></li>
298 <!-- files from the web (note that ID3 information will *not* load from remote domains without permission, Flash restriction) -->
299 <li><a href="http://freshly-ground.com/data/video/Rain%20on%20Car%20Roof.aac" title="Rain on car roof (AAC)" class="exclude">Rain On Car Roof <span class="sidenote">(AAC)</span></a></li>
300 </ul>
301
302 <div class="demo-more" style="text-align:right;white-space:normal">
303 <a href="demo/play-mp3-links/" title="&quot;Play MP3 Links&quot; demo" class="cta">play MP3 links <span>&raquo;</span></a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
304 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
305
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
306 <div style="clear:both"></div>
307
308 <p>A richer playlist theme with optional time, seekable progress bar and a VU meter where supported:</p>
309
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
310 <ul id="inline-playlist" class="playlist">
311 <li><a href="http://freshly-ground.com/data/audio/mpc/20060826 - Armstrong.mp3" class="button-exclude inline-exclude threesixty-exclude">Armstrong Beat</a></li>
312 <li><a href="http://freshly-ground.com/data/audio/mpc/20090119 - Untitled Groove.mp3" class="button-exclude inline-exclude threesixty-exclude">Untitled Groove</a></li>
313 <li><a href="http://freshly-ground.com/data/audio/sm2/quail-64kbps-he-aac-from-itunes-renamed-from-mp4.aac" title="48 kbps MPEG4 High-Efficiency AAC test sound: BC Quail" class="button-exclude inline-exclude threesixty-exclude">BC Quail <span class="sidenote">(HE-AAC)</span></a></li>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
314 <li><a href="http://freshly-ground.com/data/audio/sm2/20060924%20-%20Ghosts%20&amp;%20Goblins%20Reconstructed.ogg" title="Ghosts + Goblins Reconstructed: OGG sound format, requires HTML5 Audio() support to play" class="muxtape-html5 button-exclude inline-exclude threesixty-exclude">Ghosts+Goblins Reconstructed <span class="sidenote">(OGG)</span></a></li>
315 <li><a href="http://freshly-ground.com/data/audio/sm2/bottle-pop.wav" title="WAV sound format, requires HTML5 Audio() support to play" class="muxtape-html5 button-exclude inline-exclude threesixty-exclude">A corked beer bottle <span class="sidenote">(WAV)</span></a></li>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
316 </ul>
317 <div class="demo-more">
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
318 <a href="demo/page-player/" title="Muxtape-style UI demo" class="cta">muxtape-style UI <span>&raquo;</span></a>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
319 </div>
4a8eb81 V2.95a.20090501: New allowFullVideo, onfullscreenchange(), SMSound.on…
Scott Schiller authored
320
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
321 </div>
322 </div>
323
324 <div class="column">
325 <div class="column-wrapper">
326
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
327 <h3>Shiny</h3>
bf728cc @scottschiller More homepage tweaks
authored
328 <h4>Data <b>visualization features</b></h4>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
329
80411dd @scottschiller Homepage UI tweaks
authored
330 <p>The 360&deg; player UI demo uses &lt;canvas&gt; and includes options for waveform and spectrum analysis data via Flash 9, adding beautiful visual feedback to the interface.</p>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
331
49f84c5 @scottschiller Revised documentation layout. Now two-column, improved legibility, sp…
authored
332 <p style="font-size:92%;text-align:left;color:#666;white-space:normal"><em>Seven Or Eight Days</em> courtesy of <a href="http://www.adrianglynn.com/" title="Adrian Glynn, Vancouver, Canadian singer/songwriter" class="cta">Adrian Glynn</a>, from&nbsp;the album <em>Bruise</em>. For more, see the <a href="https://www.youtube.com/watch?v=dFc2QQiGcUQ" title="Adrian Glynn: &quot;Seven Or Eight Days&quot; video" rel="nofollow" class="cta">music video</a>.</p>
07e9e6e @scottschiller Homepage layout updates: More circles, radii and a bit of texturing.
authored
333
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
334 <!--
335 <div id="inline-demos">
336 <h4 id="inline-demo-header">Inline demos using SoundManager 2</h4>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
337 </div>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
338 -->
339
340 <div>
341
342 <div id="sm2-visualization" class="sm2-inline-list">
82e2326 Homepage doc/demo layout/copy updates
Scott Schiller authored
343
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
344 <div class="ui360 ui360-vis">
8561d1d @scottschiller Added "Seven Or Eight Days" (360 demo) from http://adrianglynn.com/
authored
345 <a href="http://freshly-ground.com/data/audio/sm2/Adrian%20Glynn%20-%20Seven%20Or%20Eight%20Days.mp3" class="exclude button-exclude inline-exclude" style="position:absolute;color:#333">Adrian Glynn - Seven Or Eight Days</a>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
346 </div>
347
348 </div>
349
350 <div class="demo-more" style="width:256px;margin:0.5em auto 0px auto;clear:both">
351 <a href="demo/360-player/canvas-visualization.html" title="360&deg; UI: JavaScript + Canvas Visualization" class="cta">360&deg; + spectrum UI <span>&raquo;</span></a>
352 </div>
353
354 </div>
355
356 </div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
357 </div>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
358
359 <div class="column">
5720c1b @scottschiller +experimental demo, content shuffle ("getting started" up higher)
authored
360
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
361 <div class="column-wrapper">
8c1b058 V2.94a.20090206: New isBuffering + onbufferchange() (flash 9), soundM…
Scott Schiller authored
362
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
363 <h3>Experimental</h3>
bf728cc @scottschiller More homepage tweaks
authored
364 <h4>Advanced <b>prototypes</b></h4>
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
365
5720c1b @scottschiller +experimental demo, content shuffle ("getting started" up higher)
authored
366 <p>The Cassette Tape UI is a skinnable player based on the TDK MA-R90 cassette tape, a classic design from 1982.</p>
367
368 <div>
369 <a href="demo/cassette-tape/" title="Cassette Tape UI (Prototype Demo)"><img src="demo/_image/cassette-tape-ui-screenshot.jpg" alt="Cassette Tape UI Prototype Screenshot" style="max-width:506px;min-width:100%;width:100%;border-radius:12px" /></a>
370 </div>
371
372 <p style="margin:0.5em 0px 0px 0px;padding:0px;font-size:92%;text-align:left;color:#666;margin-bottom:0.5em;white-space:normal">Remember Type IV, Metal &amp; Chromium/CrO2? <a href="http://www.youtube.com/watch?v=1FDgUfeG8q4" title="Cassette Tape TV ads from Japan, 1979-1989 (YouTube)" class="cta">Those were the days</a>.</p>
373
374 <p>The "Wheels Of Steel" started as a simple CSS prototype, and evolved to replicate most of the UI and functionality of a traditional DJ set-up. Pitch bending, scratch and EQ effects are present where supported.</p>
375 <p style="margin:0px 0px 0.5em 0px;padding:0px;text-align:center" class="bonus-demo"><a href="http://wheelsofsteel.net/" title="The Wheels Of Steel: Online turntable / browser-based DJ prototype" style="margin:0px;padding:0px;background:#fff"><img src="demo/_image/wheelsofsteel-full-ui.jpg" alt="wheelsofsteel.net: Online turntable demo (screenshot)" style="display:block;width:100%;min-width:100%;max-width:315px;margin-left:-4px;border:none" /></a></p>
baed3eb @scottschiller Larger speaker and ZOMG responsive design elements (larger font sizes…
authored
376 <p style="margin:0px;padding:0px;font-size:92%;text-align:left;color:#666;margin-bottom:0.5em;white-space:normal">The <a href="http://wheelsofsteel.net/" title="The Wheels Of Steel: Online turntable / browser-based DJ prototype" class="cta">Wheels Of Steel</a>, a browser-based DJ turntable prototype. For the tech details, read <a href="http://www.schillmania.com/content/entries/2011/wheels-of-steel/" title="The making of 'The Wheels Of Steel': An Ode To Turntables (in HTML)" class="cta">An Ode To Turntables (in HTML.)</a></p>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
377
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
378 </div>
379 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
380
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
381 </div>
382
5720c1b @scottschiller +experimental demo, content shuffle ("getting started" up higher)
authored
383 <div id="how-to" class="twoup">
384
385 <div class="column">
386 <div id="getting-started" class="column-wrapper">
387
388 <h3>Getting <b>started</b></h3>
389
390 <h4>Basic SoundManager 2 set-up</h4>
391
392 <p>Including the script, configuring the <code>url</code> and registering an <code>onready()</code> callback:</p>
393
394 <pre class="block"><code>&lt;script src="soundmanager2.js"&gt;&lt;/script&gt;
395 &lt;script&gt;
396 soundManager.setup({
397 <span><span>// where to find flash audio SWFs, as needed</span></span>
398 url: '<span>/path/to/swf-files/</span>',
399 onready: function() {
400 <span><span>// SM2 is ready to play audio!</span></span>
401 })
402 });
403 &lt;/script&gt;</code></pre>
404
405 <p>Upon execution of soundmanager2.js, SM2 will determine what Flash SWF to load (if any) based on the path defined in <code>soundManager.url</code>.</p>
406 <p>After successful initialization, <code>soundManager.onready()</code> will fire and sounds can be played.</p>
407 <p>By default, SM2 uses a Flash 8-based SWF build. Some <a href="#flash9-features" title="SoundManager 2: Flash 9 API-based features" class="cta">additional features</a> are available when using the Flash 9-based build.</p>
408
409 <p>For a live example, see the <a href="demo/template/" class="cta">basic template demo</a>.</p>
410
411 </div>
412
413 </div>
414
415
416 <div class="column">
417
418 <div class="column-wrapper">
419
420 <h3>Playing <b>audio</b></h3>
421 <h4>Basic playback control</h4>
422
423 <p>Once <code>soundManager.onready()</code> has fired, sounds can be loaded and played.</p>
424
425 <h4>Creating and playing a sound object</h4>
426
427 <pre class="block"><code><span><span>// create "mySound"...</span></span>
428 soundManager.createSound({
429 id: '<span>mySound</span>',
430 url: '<span>/path/to/an.mp3</span>'
431 });
432
433 <span><span>// ...and play it</span></span>
434 soundManager.play('<span>mySound</span>');
435 </code></pre>
436
437 <p>Additional options and events can be specified when loading and playing sounds. For more examples of playback features, see <a href="demo/api/" class="cta">API Demos</a>.</p>
438
439 </div>
440
441 </div>
442
443 </div>
444
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
445 <div class="twoup">
446
447 <div class="column">
448 <div class="column-wrapper">
449
450 <h3>Bonus</h3>
451 <h4>Additional <b>demos</b></h4>
452
36bad06 @scottschiller More homepage tweaks
authored
453 <p>
6e59d90 @scottschiller SMSound.sID -> SMSound.id for demos/docs
authored
454 Examples using multi-track playback, progress and combinations of sound and animation:
1e240e8 @scottschiller More homepage updates
authored
455 </p>
456
36bad06 @scottschiller More homepage tweaks
authored
457 <ul class="bonus-demos">
458
459 <li>
6e59d90 @scottschiller SMSound.sID -> SMSound.id for demos/docs
authored
460 <p class="smaller"><strong>SURVIVOR remake</strong></p>
cd192ff @scottschiller +"SURVIVOR" demo
authored
461 <a href="http://www.schillmania.com/survivor/" style="display:inline-block" title="SURVIVOR (1982 Commodore 64 game remake)"><img src="demo/_image/survivor-screenshot.png" alt="SURVIVOR (C64 game remake) demo screenshot" style="display:block;width:100%;max-width:200px" /></a>
36bad06 @scottschiller More homepage tweaks
authored
462 </li>
463
464 <li>
6e59d90 @scottschiller SMSound.sID -> SMSound.id for demos/docs
authored
465 <p class="smaller"><strong>MPC (Drum Machine)</strong></p>
cd192ff @scottschiller +"SURVIVOR" demo
authored
466 <a href="demo/mpc/" style="display:inline-block" title="MPC (sampler/drum machine) demo"><img src="demo/_image/mpc-screenshot.png" alt="MPC (drum machine) demo screenshot" style="display:block;width:100%;max-width:200px" /></a>
467 </li>
468
469 <li>
6e59d90 @scottschiller SMSound.sID -> SMSound.id for demos/docs
authored
470 <p class="smaller"><strong>Christmas Lights</strong></p>
cd192ff @scottschiller +"SURVIVOR" demo
authored
471 <a href="demo/christmas-lights/" style="display:inline-block" title="Smashable Christmas Lights demo"><img src="demo/_image/christmas-lights.jpg" alt="Smash Christmas Lights demo" style="display:block;width:100%;max-width:200px;border-radius:7px" /></a>
36bad06 @scottschiller More homepage tweaks
authored
472 </li>
473
474 </ul>
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
475
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
476 <h4 style="clear:left;padding-top:1em">"Audio sprites" (sound segments / samples) demo</h4>
1e240e8 @scottschiller More homepage updates
authored
477
36bad06 @scottschiller More homepage tweaks
authored
478 <p>With sound playback options like <code>from</code> and <code>to</code>, you can play portions of a larger, single-file "sprite" of many sounds.</p>
479
480 <p class="bonus-demo clear">
8ab8230 @scottschiller png -> jpg
authored
481 <a href="demo/api/#fitter-happier" title="&quot;Fitter, Happier&quot; sound sample demo"><img src="demo/_image/fitter-happier-waveform.jpg" alt="&quot;Fitter, Happier&quot; waveform screenshot" style="width:100%;max-width:562px" /></a>
1e240e8 @scottschiller More homepage updates
authored
482 </p>
483
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
484
485 <p>
486 For more live examples, see the <a href="demo/api/" title="SoundManager 2 API demos" class="cta">API Demos</a>.
487 </p>
488
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
489 </div>
490 </div>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
491
492 <div class="column">
493 <div class="column-wrapper">
494
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
495 <h3>Elsewhere</h3>
496 <h4>As heard on <b><span class="scratched-out">TV</span> the internets</b></h4>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
497
498 <p>A few nifty places SoundManager 2 has been seen in use on the Wild World Web:</p>
499
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
500 <div class="inthewild active">
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
501
ce8aa97 @scottschiller More homepage demo fiddling
authored
502 <ul class="inthewild">
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
503 <li>
504 <a id="soundcloud" href="http://thecloudplayer.com/" title="Soundcloud / The Cloud Player"><span>SoundCloud / The Cloud Player</span></a>
505 </li>
506 <li>
507 <a id="lastfm" href="http://www.last.fm/" title="last.fm"><span>last.fm</span></a>
508 </li>
509 <li>
3efb25f @scottschiller +Pitchfork under "in the wild." Optimized logo sprite.
authored
510 <a id="pitchfork" href="http://www.pitchfork.com/" title="Pitchfork"><span>Pitchfork</span></a>
511 </li>
512 <li>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
513 <a id="opera" href="http://www.opera.com/" title="Opera Software ASA (Media Player component)"><span>Opera Software ASA</span></a>
514 </li>
515 <li>
516 <a id="eight-tracks" href="http://8tracks.com/" title="8tracks"><span>8tracks</span></a>
517 </li>
518 <li>
519 <a id="discogs" href="http://www.discogs.com/" title="Discogs"><span>Discogs</span></a>
520 </li>
521 <li>
522 <a id="hypem" href="http://hypem.com/" title="The Hype Machine"><span>The Hype Machine</span></a>
523 </li>
524 <li>
525 <a id="nyancat" href="http://nyan.cat/" title="NON-STOP NYAN CAT!"><span>NON-STOP NYAN CAT!</span></a>
526 </li>
527 <li>
528 <a id="turntable-dot-fm" href="http://turntable.fm/" title="Turntable.fm"><span>Turntable.fm</span></a>
529 </li>
530 <li>
531 <a id="audiogalaxy" href="http://audiogalaxy.com/" title="Audiogalaxy"><span>Audiogalaxy</span></a>
532 </li>
533 <li>
3efb25f @scottschiller +Pitchfork under "in the wild." Optimized logo sprite.
authored
534 <a id="freesound" href="http://freesound.org" title="Freesound.org"><span>freesound.org</span></a>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
535 </li>
536 <li>
3efb25f @scottschiller +Pitchfork under "in the wild." Optimized logo sprite.
authored
537 <a id="baroque-me" href="http://blog.chenalexander.com/2011/baroque-bach-cello/" title="Alexander Chen's &quot;baroque.me&quot;"><span>baroque.me</span></a>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
538 </li>
539 </ul>
540
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
541 </div>
ce8aa97 @scottschiller More homepage demo fiddling
authored
542
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
543 <h4 style="padding-top:1em">Articles and presentations</h4>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
544
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
545 <p>Some other words, pictures and video on the subject of HTML5 and web audio:</p>
ce8aa97 @scottschiller More homepage demo fiddling
authored
546
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
547 <ul class="standard">
e1d6625 @scottschiller Updated HTML5 talk, credits layout
authored
548 <li>Video, 02/2012: <a href="http://www.youtube.com/watch?v=C2Tw0BeZb8Q" title="Scott Schiller: Web Audio: HTML5 + Flash (in a tree)" class="cta">Web Audio: HTML5 + Flash (in a tree)</a> (<a href="http://isflashdeadyet.com/talks/html5/bayjax_yahoo_sunnyvale_02-06-2012/" title="&quot;Web Audio: HTML5 + Flash (in a tree)&quot; presentation slides" class="cta">slides</a>.) Updated HTML5 content, demos and <a href="http://www.schillmania.com/content/entries/2012/survivor-c64-html-remake/" title="SURVIVOR: Remaking a Commodore 64 game in HTML" class="cta">SURVIVOR</a> C64 game demo.</li>
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
549 <li>Video presentation: <a href="http://www.youtube.com/watch?v=KjdPNtWV3Z0#t=56s" title="Scott Schiller: &quot;Adding Sound To HTML&quot;" class="cta">Adding Sound To HTML</a> (<a href="http://isflashdeadyet.com/talks/html5/" title="&quot;Adding Sound To HTML&quot; presentation slides" class="cta">slides</a>) (12/2011)</li>
550 <li>Video: <a href="http://www.youtube.com/watch?v=ffk65q5Rl9I" title="Yahoo!/YUI Blog, video presentation: Scott Schiller on the State of HTML5 Audio" class="cta">Probably, Maybe, No: The State of HTML5 Audio</a> + turntable demo (05/2011)</li>
e1d6625 @scottschiller Updated HTML5 talk, credits layout
authored
551 <li>24ways.org article, <a href="http://24ways.org/2010/the-state-of-html5-audio" title="Probably, Maybe, No: The State Of HTML5 Audio (24ways.org)" class="cta">The State Of HTML5 Audio</a> (12/2010)</li>
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
552 </ul>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
553
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
554 <h4 style="padding-top:1em">Credits and thank-yous</h4>
20d2fd3 @scottschiller More iconography, credits and thank-yous
authored
555
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
556 <ul class="standard">
557 <li>Icons: Desktop / mobile / iOS device iconography via <a href="http://glyphish.com/" class="cta">glyphish.com</a> (<a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons Attribution 3.0 Unported" class="cta">CC</a>)</li>
8561d1d @scottschiller Added "Seven Or Eight Days" (360 demo) from http://adrianglynn.com/
authored
558 <li>Music: <em>Seven Or Eight Days</em> courtesy of <a href="http://www.adrianglynn.com/" title="Adrian Glynn, Vancouver-based Singer/Songwriter" class="cta">Adrian Glynn</a>. <em>Graffiti Sex</em> courtesy of <a href="http://www.fugitives.ca/" title="The Fugitives, multi-instrumentalists from Vancouver" class="cta">The Fugitives</a>, from the album <em>In Streetlight Communion</em>. <em>I Tried</em> and <em>People Asking</em> courtesy of <a href="http://sonreal.bandcamp.com/album/the-lightyear-mixtape" title="The Lightyear Mixtape from SonReal, Vancouver-based hip-hop artist" class="cta">SonReal</a>.</li>
1938714 @scottschiller Special 10-year "SM2 <3 You" thank-you header notice, and validation …
authored
559 <li>Homepage header typeface: <a href="http://work.meredithmandel.com/#379252/Typeface-Chunk-Five" class="cta">Chunk (Five)</a> by Meredith Mandel (<a href="http://scripts.sil.org/cms/scripts/page.php?site_id=nrsi&amp;id=OFL&amp;_sc=1" title="SIL Open Font License (OFL)" class="cta">OFL</a>)</li>
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
560 </ul>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
561
562 </div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
563
564 </div>
e2bbc9d Updated homepage layout + demos (WIP)
Scott Schiller authored
565
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
566 <!--
567 <div class="column">
568 <div class="column-wrapper">
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
569
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
570 <h3>Download <b>the code</b></h3>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
571
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
572 <p>
573 <a href="doc/download/" class="feature">Get SoundManager 2</a>
574 </p>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
575
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
576 </div>
577 </div>
578 -->
f516a0a Minor layout tweaks
Scott Schiller authored
579
580
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
581 </div>
582
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
583 <div class="threeup">
584
585 <div class="column">
586 <div class="column-wrapper">
587
bf728cc @scottschiller More homepage tweaks
authored
588 <h3>Technical <b>overview</b></h3>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
589
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
590 <h4>HTML5 audio + optional Flash fallback</h4>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
591
592 <ul id="html5-audio-notes" class="standard">
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
593 <li>100% Flash-free audio on iPad, iPhone (iOS4) and other HTML5-enabled devices + browsers</li>
594 <li>Invisible Flash SWF provides HTML5 fallback as needed</li>
595 <li>API is consistent whether using HTML5 or Flash</li>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
596 <li>See <a href="doc/#soundmanager-usehtml5audio" title="soundManager.useHTML5Audio HTML5 Audio() support feature documentation" class="cta">useHTML5Audio</a> for implementation details</li>
d9ef8d1 Prep for next release: HTML5, homepage + stylistic updates, source co…
Scott Schiller authored
597 </ul>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
598
d9ef8d1 Prep for next release: HTML5, homepage + stylistic updates, source co…
Scott Schiller authored
599 </div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
600 </div>
601
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
602 <div class="column">
bf728cc @scottschiller More homepage tweaks
authored
603 <div class="column-wrapper"> <!-- spaced-out -->
604
605 <h3>API <b>specifics</b></h3>
606 <h4>Basic API features (HTML5, Flash 8*)</h4>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
607
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
608 <ul class="standard">
609 <li>Load, stop, play, pause, mute, seek, pan*, volume control from JavaScript</li>
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
610 <li>Events: <code>onload()</code>, <code>whileloading()</code>, <code>whileplaying()</code>, <code>onfinish()</code> and more</li>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
611 <li>ID3V1 + ID3V2 tag support for MP3s (title, artist, genre etc.)*</li>
612 </ul>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
613
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
614 <br />
615
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
616 <h4 id="flash9-features">Additional Flash 9-based API features</h4>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
617
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
618 <ul class="standard">
619 <li>RTMP / Flash Media Server streaming support (experimental) - see <a href="doc/#smsound-serverurl" title="SMSound.serverURL parameter" class="cta">serverURL</a></li>
620 <li>MPEG-4 (AAC, HE-AAC, H.264) audio support</li>
621 <li>"MultiShot" play (layered/chorusing effects)</li>
622 <li>Waveform/frequency spectrum data</li>
623 <li>Peak (L/R channel volume) data</li>
624 <li>Audio buffering state/event handling</li>
625 </ul>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
626
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
627 </div>
628 </div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
629
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
630 <div class="column">
bf728cc @scottschiller More homepage tweaks
authored
631 <div class="column-wrapper"> <!-- spaced-out -->
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
632
bf728cc @scottschiller More homepage tweaks
authored
633 <h3>Everything <b>else</b></h3>
634 <h4>Documentation, tools and demos</h4>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
635
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
636 <ul class="standard">
637 <li>Extensive <a href="doc/" title="SoundManager 2 documentation" class="cta">API Documentation</a> with examples and notes</li>
8d57c97 @scottschiller Upgraded Christmas Lights demo to use YUI 3.4 animation (fetched on-d…
authored
638 <li>Built-in <a href="doc/technotes/#debug-output" title="SoundManager 2 console.log()-style debug output" class="cta">debugging</a> and <a href="doc/getstarted/#troubleshooting" title="SoundManager 2 troubleshooting tool" class="cta">troubleshooting tools</a></li>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
639 <li>Community-based <a href="http://getsatisfaction.com/schillmania/products/schillmania_soundmanager_2" title="discussion/support for SoundManager 2 on Get Satisfaction" class="cta">discussion/support</a></li>
640 <li id="licensing"><a href="license.txt" title="SoundManager 2 BSD license" class="cta norewrite">BSD licensed</a></li>
641 </ul>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
642
8469dbd @scottschiller More new homepage updates + docs / layout tweaks; new rolled-up + min…
authored
643 <br />
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
644 <h4 class="home-shopping-network">Not only do you get the ginsu knife...</h4>
baed3eb @scottschiller Larger speaker and ZOMG responsive design elements (larger font sizes…
authored
645 <p style="font-size:92%">Even more demos and examples using the SoundManager 2 API...</p>
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
646 <ul class="standard">
647 <li><a href="demo/play-mp3-links/" title="Links to MP3 files that play inline" class="cta">Playable MP3 links</a></li>
648 <li><a href="demo/mpc/" title="MPC sampler/drum machine demo" class="cta">MPC sampler/drum machine</a></li>
649 <li><a href="demo/animation-1/" title="Bouncing ball animation with sound effects" class="cta">Basic animation + sound</a></li>
650 <li><a href="demo/christmas-lights/" title="Smashable christmas lights demo (animation and sound)" class="cta">Smashable christmas lights</a></li>
651 <li><a href="demo/api/" title="See the code, click the button, watch it run: Live API demos using test sounds" class="cta">Live API + code examples</a></li>
652 </ul>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
653
654
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
655 </div>
656 </div>
657
658 <!--/min-width -->
659
660 </div>
661
662 <!-- three -->
663
664 <!-- /#about-sm2 -->
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
665 </div>
666
667 </div>
668
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
669 <div class="clear">&nbsp;</div>
670
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
671 <!-- /content -->
bceeb17 @scottschiller Homepage design/layout refresh, much nicer (even in IE 6)
authored
672
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
673 </div>
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
674
f05046f Appease the W3C gods
Scott Schiller authored
675 <script type="text/javascript">
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
676 // <![CDATA[
677 if (document.location.href.match(/debug=1/i)) {
678 document.getElementById('with-debug').style.display = 'none';
679 }
680 if (document.location.href.match(/debug/i)) {
681 document.getElementById('options-divider-with-html5').style.display = 'none';
682 }
683 if (soundManager.useHTML5Audio || document.location.href.match(/html5audio=1/i)) {
684 document.getElementById('with-html5').style.display = 'none';
685 document.getElementById('options-divider-with-html5').style.display = 'none';
686 } else {
687 document.getElementById('without-html5').style.display = 'none';
688 document.getElementById('options-divider-without-html5').style.display = 'none';
689 }
690 init();
691 // ]]>
692 </script>
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
693
07e9e6e @scottschiller Homepage layout updates: More circles, radii and a bit of texturing.
authored
694 </div>
695
97a7785 Initial commit, V2.91a.20081205: Redesigned cocs, soundmanager2.js ru…
Scott Schiller authored
696 </div>
697
e4c169a Homepage layout improvements, code shuffle, externalized JS/CSS
Scott Schiller authored
698 </body>
699 </html>
Something went wrong with that request. Please try again.