diff --git a/audio/18979__bebeto__Loop008_acid.wav b/audio/18979__bebeto__Loop008_acid.wav new file mode 100644 index 0000000..f46efa4 Binary files /dev/null and b/audio/18979__bebeto__Loop008_acid.wav differ diff --git a/audio/35684__jobro__Laser7.wav b/audio/35684__jobro__Laser7.wav new file mode 100644 index 0000000..ac135bf Binary files /dev/null and b/audio/35684__jobro__Laser7.wav differ diff --git a/audio/39023__wildweasel__Dual_Neutron_Disruptor.wav b/audio/39023__wildweasel__Dual_Neutron_Disruptor.wav new file mode 100644 index 0000000..9572949 Binary files /dev/null and b/audio/39023__wildweasel__Dual_Neutron_Disruptor.wav differ diff --git a/audio/41525__Jamius__BigLaser.wav b/audio/41525__Jamius__BigLaser.wav new file mode 100644 index 0000000..81e5b52 Binary files /dev/null and b/audio/41525__Jamius__BigLaser.wav differ diff --git a/audio/51483__suonho__suonho_rmx_Berklee_BrianTranseau_132_Let_Me_See_Ya_Bounce_I_crusher.wav b/audio/51483__suonho__suonho_rmx_Berklee_BrianTranseau_132_Let_Me_See_Ya_Bounce_I_crusher.wav new file mode 100644 index 0000000..75f81c7 Binary files /dev/null and b/audio/51483__suonho__suonho_rmx_Berklee_BrianTranseau_132_Let_Me_See_Ya_Bounce_I_crusher.wav differ diff --git a/audio/87045__RunnerPack__weapGone.wav b/audio/87045__RunnerPack__weapGone.wav new file mode 100644 index 0000000..b71f493 Binary files /dev/null and b/audio/87045__RunnerPack__weapGone.wav differ diff --git a/css/style.css b/css/style.css index 65885c2..1362a6a 100644 --- a/css/style.css +++ b/css/style.css @@ -1,4 +1,4 @@ -/* BASICS */ +/* GOOGLE FONT */ .orbitron { font-family: 'Orbitron', serif; font-style: normal; @@ -10,7 +10,8 @@ word-spacing: 0em; line-height: 1.2; } - + +/* Global Container */ .container { width: 100%; height: 100%; @@ -110,14 +111,8 @@ height: 68px; } -/* Ennemies */ -/*#game .ennemy { border: 1px solid blue; } */ - - /* The HUD */ -#hud { - z-index: 90; -} +#hud { z-index: 90; display: none; } #hud #score { font-size:36px; @@ -138,7 +133,7 @@ font-weight: bold; text-shadow: 0 0 5px rgba(115, 171, 255, 0.4) ; position: absolute; - display: block; + display: none; top:100px; right: 30px; } @@ -155,13 +150,53 @@ right: 30px; } -/* Debug Panel */ +/* GameIntro Panel */ +#game-intro { + position: absolute; + display: block; + left: 0px; + top: 50%; + margin-top: -150px; + color:#fff; + z-index: 1000; + width:100%; + text-align: center; +} + +#game-intro .text { + position: relative; + display: block; + font-size: 64px; +} + +#game-intro #start-game { + position: relative; + display: block; + margin: 20px auto; + width: 300px; + -moz-border-radius: 10px; + -webkit-border-radius: 10px; + border-radius: 10px; + border: 5px solid rgba(0,0,0, 0.3); + padding: 15px 0 10px; + font-size: 24px; + background: rgba(0,0,0, 0.1); +} + +#game-intro #start-game.hover { + cursor: pointer; + background: rgba(0,0,0, 0.2); + box-shadow: 0 0 20px rgba(27, 161, 255, 0.5) ; + -moz-box-shadow: 0 0 20px rgba(27, 161, 255, 0.5) ; +} + +/* GameOver Panel */ #game-over { position: absolute; display: none; left: 0px; top: 50%; - margin-top: -100px; + margin-top: -150px; color:#fff; z-index: 1000; width:100%; @@ -191,9 +226,34 @@ #game-over #restart-game.hover { cursor: pointer; background: rgba(0,0,0, 0.2); - box-shadow: 0 0 10px rgba(27, 161, 255, 0.5) ; + box-shadow: 0 0 20px rgba(27, 161, 255, 0.5) ; + -moz-box-shadow: 0 0 20px rgba(27, 161, 255, 0.5) ; } +#game-over #share-buttons { + position: relative; + display: block; + text-align: center; + padding: 10px 0; +} + +#game-over #share-buttons div { + display: inline-block; + margin: 0 10px; + position: relative; +} + +#game-over #share-buttons a { + position: relative; + display: block; + opacity: 0.1; + outline: none; +} + +#game-over #share-buttons a img { border:none; outline: none; } +#game-over #share-buttons a:hover { opacity: 0.9; cursor: pointer; } + + /* Credits */ #credits { position: absolute; @@ -207,11 +267,7 @@ font-family: "Lucida Grande", Verdana; } -#credits a { - text-decoration: none; - color: #1ba1ff; -} - -#credits a:hover { - text-decoration: underline; -} \ No newline at end of file +#credits a { text-decoration: none; color: #1ba1ff; } +#credits a:hover { text-decoration: underline; } +#credits a.author { color: #baff58; } +#credits a.quote { color: #fa8100; } \ No newline at end of file diff --git a/images/facebook_button.png b/images/facebook_button.png new file mode 100644 index 0000000..69407d3 Binary files /dev/null and b/images/facebook_button.png differ diff --git a/images/twitter_button.png b/images/twitter_button.png new file mode 100644 index 0000000..8d087fe Binary files /dev/null and b/images/twitter_button.png differ diff --git a/index.html b/index.html index 98a393d..778f584 100644 --- a/index.html +++ b/index.html @@ -3,31 +3,49 @@ xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"> + + + + + + + Wyrian - A clone Game of Tyrian in HTML5 + + + + + + + + - - - - -Wyrian - A clone Game of Tyrian in HTML5 - - - - - - - + + + +
+
Wyrian
+
Play
+
+ +
GAME OVER
Restart
+
+ + +
-
- HTML5 Game Jam 2011
- Wyrian v0.2a | Guillaume DE LA RUE
Thanks to Glenux for design and Matthieu Bosquet and all people presents :) -
+ +
@@ -50,10 +68,30 @@
+ + - - + + + - + + + + + diff --git a/js/.DS_Store b/js/.DS_Store new file mode 100644 index 0000000..5008ddf Binary files /dev/null and b/js/.DS_Store differ diff --git a/js/GameClass.js b/js/GameClass.js index 58c5609..43e73fe 100644 --- a/js/GameClass.js +++ b/js/GameClass.js @@ -68,7 +68,7 @@ app.prototype.log = function(txt) { app.prototype.loopAnimation = function() { // -- Search for elements that have to be updated - Wyrian.activeElements = 0 ; + Game.activeElements = 0 ; for ( var i in Layouts ) { var _layout = Layouts[i] ; if ( _layout && _layout.running ) { @@ -77,7 +77,7 @@ app.prototype.loopAnimation = function() { } // -- Get level - Level = Math.floor((Wyrian.score||0)/1000) ; + Level = Math.floor((Game.score||0)/1000) ; // -- Create ennemies if needed var numEnnemies = 0 ; @@ -90,10 +90,10 @@ app.prototype.loopAnimation = function() { } // -- Init loops counter - Wyrian.loops = Wyrian.loops||0 ; + Game.loops = Game.loops||0 ; // -- Init vars - if ( Wyrian.loops == 0 ) { + if ( Game.loops == 0 ) { this.frameCount = 0; this.fps = 0; this.maxfps = 1 / (FPS / 1000); @@ -111,11 +111,11 @@ app.prototype.loopAnimation = function() { this.frameCount++; // -- Increase loop counter - Wyrian.loops++ ; + Game.loops++ ; // -- Refresh Scores and HUD informations - $('#score span').html(Wyrian.score) ; - $('#activeElements span').html(Wyrian.activeElements) ; + $('#score span').html(Game.score) ; + $('#activeElements span').html(Game.activeElements) ; $('#fpsCounter span').html(this.fps) ; } diff --git a/js/Wyrian.js b/js/Wyrian.js deleted file mode 100644 index 40fa0c5..0000000 --- a/js/Wyrian.js +++ /dev/null @@ -1,112 +0,0 @@ -/************************************************************************** -* Init Game Bootstrap -***************************************************************************/ -Wyrian = new app({ - 'libs': [ - 'order!jquery.transform-0.9.3.min', - 'order!LayoutClass' - ], - 'layers': [ - 'order!layouts/BgLayer', - 'order!layouts/PlayerLayer', - 'order!layouts/Ennemies' - ], - 'wrapper': $('#GameContainer') -}) ; - - -// Init Application and bind all games events -jQuery(document).ready(function() { - - /************************************************************************** - * Load Dependencies & Create Application - ***************************************************************************/ - require({ - baseUrl: "js/", - urlArgs: "bust=" + Wyrian.version - }, Wyrian.settings.libs, - - // -- All objects are loaded => can run - function() { - - // -- Init Stage or show IE popup - if ( ! $.browser.msie ) { - Wyrian.init() ; - } else { - $.facebox.settings.opacity = 0.8 ; - $.facebox.settings.closeImage = '/common/img/facebox/apple-close.png' ; - $(document).unbind('close.facebox') ; - $.facebox({ajax: '/popup-ie/'}, 'popup-ie' ) ; - } - } - ); - - - /************************************************************************** - * Game Controls Events - ***************************************************************************/ - - // -- Game is loaded - $(document).bind('gameLoaded', function(e, res) { - if ( timers.loopGame ) clearInterval(timers.loopGame) ; - timers.loopGame = setInterval(Wyrian.loopAnimation, 1000/FPS) ; - }); - - // -- Init Game - $(document).bind('gameInit', function(e, res) { - $(document).trigger('gameReset') ; - }) ; - - // -- Game Reset - $(document).bind('gameReset', function(e, res) { - Wyrian.score = 0 ; - Wyrian.loops = 0 ; - Layouts.Ennemies.els = [] ; - $('.sprite').remove() ; - $.each(Layouts, function(key, val){ - Layouts[key].running = true ; - $.each(val.els, function(key2, val2){ - if ( Layouts[key].els.length && Layouts[key].els[key2] ) { - Layouts[key].els[key2].x = Layouts[key].els[key2].settings.origin.x ; - Layouts[key].els[key2].y = Layouts[key].els[key2].settings.origin.y ; - } - }) ; - }) ; - - if ( timers.loopGame ) clearInterval(timers.loopGame) ; - timers.loopGame = setInterval(Wyrian.loopAnimation, 1000/FPS) ; - }) ; - - // -- Start Animation - $(document).bind('gameStart', function(e, res) { - - }) ; - - // -- On Complete Launch - $(document).bind('gameComplete', function(e, res) { - - // -- Stop layouts running - $('.sprite').not('.explosion').remove() ; - Layouts.Ennemies.running = false ; - Layouts.Background.running = false ; - - // -- Show game over overlay - $('#game-over:hidden').fadeIn(500) ; - - // -- Stop loopAnimation - if ( timers.loopGame ) clearInterval(timers.loopGame) ; - - }) ; - - // -- Bind Restart Screen controls - $('#game-over #restart-game').click(function() { - $('#game-over:visible').fadeOut(500, function() { - $(document).trigger('gameReset') ; - }) ; - }).hover(function() { - $(this).addClass('hover') ; - }, function() { - $(this).removeClass('hover') ; - }) ; - -}) ; \ No newline at end of file diff --git a/js/layouts/Ennemies.js b/js/layouts/Ennemies.js index 4137c37..b1d44f9 100644 --- a/js/layouts/Ennemies.js +++ b/js/layouts/Ennemies.js @@ -4,13 +4,14 @@ Layouts.Ennemies = new Layout({ // -- Define elements to draw with options el: [], + images: ['images/sprites/alien_1.png?_=1', 'images/sprites/alien_2.png?_=1', 'images/sprites/explosion-sprite.png' ], // -- Define current Speed speed: 7, direction: 1, // -- Define canvas parent - dom: $('div#game') + dom: $('div#ground') }) ; @@ -32,13 +33,13 @@ Layouts.Ennemies.createRandom = function(opts) { { width: 80, height: 80, - imageSrc: 'images/sprites/alien_1.png?_=1', + imageSrc: self.settings.images[0], sprites: [0,1,2,3] }, { width: 80, height: 80, - imageSrc: 'images/sprites/alien_2.png?_=1', + imageSrc: self.settings.images[1], sprites: [0] } ] ; @@ -60,8 +61,8 @@ Layouts.Ennemies.createRandom = function(opts) { obj.box.hide(0); obj = self.reinitObj(obj); - Wyrian.score = Wyrian.score || 0 ; - Wyrian.score += obj.settings.power ; + Game.score = Game.score || 0 ; + Game.score += obj.settings.power ; } ; alien.animate = function (obj) { if ( obj.explosing ) { @@ -87,7 +88,7 @@ Layouts.Ennemies.createExplosion = function(object) { type: 'neutral', width:330, height:330, - imageSrc: 'images/sprites/explosion-sprite.png', + imageSrc: self.settings.images[2], sprites: [0,1,2], origin: {x: object.x-330/2+object.width/2, y: object.y-330/2+object.height/2}, animate: function(obj) { diff --git a/js/LayoutClass.js b/js/layouts/LayoutClass.js similarity index 77% rename from js/LayoutClass.js rename to js/layouts/LayoutClass.js index 73a85b5..03cdf83 100644 --- a/js/LayoutClass.js +++ b/js/layouts/LayoutClass.js @@ -34,34 +34,6 @@ var Layout = function(opts) { return this; }; -// -- Return or set settings -Layout.prototype.option = function(optName, optValue) { - - // No params => return all settings - if ( typeof optName == 'undefined' ) return this.settings; - - // If optName and optValue set => modify it - else if ( typeof optValue != 'undefined' ) this.settings[optName] = this.settings ; - - // In other cases, simply return the setting value - else return this.settings[optName] ; - -}; - -// -- Return an object by name -Layout.prototype.getObj = function(name) { - this.cache = this.cache || {} ; - - if ( this.cache[name] ) return this.cache[name] ; - - for ( var i in this.els ) { - if ( this.els[i].settings.name == name ) { - this.cache[name] = this.els[i] ; - return this.cache[name] ; - } - } -} - // -- Update elements into layout Layout.prototype.update = function() { for ( var j in this.els ) { @@ -100,7 +72,7 @@ Layout.prototype.createObj = function(opts) { // -- Store options this.parent = self ; this.name = settingsObj.name || 'default' ; - this.id = settingsObj.id || 'element_'+Wyrian.uniqId++ ; + this.id = settingsObj.id || 'element_'+Game.uniqId++ ; this.width = settingsObj.width ? settingsObj.width : self.width ; this.height = settingsObj.height ? settingsObj.height : self.height ; this.settings = settingsObj ; @@ -118,36 +90,42 @@ Layout.prototype.createObj = function(opts) { // -- Create a DOM object this.box = $('#'+this.id) ; + this.dynamic = false ; + this.cssObj = {} ; if ( ! this.box.length ) { + this.box = $('
', { class:'sprite '+this.name, - id: this.id, - css:{ - position: 'absolute', - display: 'block', - top: 0, - left: 0, - backgroundColor: settingsObj.backgroundColor, - backgroundRepeat: settingsObj.backgroundRepeat, - backgroundPosition: settingsObj.backgroundPosition, - backgroundImage: settingsObj.imageSrc ? 'url('+settingsObj.imageSrc+')' : '' - } - }).appendTo(self.dom) ; - } else { - this.box.show(0) ; + id: this.id + }) ; + + this.cssObj = { + position: 'absolute', + top: 0, + left: 0, + display: 'block', + backgroundColor: settingsObj.backgroundColor, + backgroundRepeat: settingsObj.backgroundRepeat, + backgroundPosition: settingsObj.backgroundPosition, + backgroundImage: settingsObj.imageSrc ? 'url('+settingsObj.imageSrc+')' : '' + } ; + + this.dynamic = true ; } // -- Apply CSS - this.box.css({ - width: this.width, - height: this.height - }) ; + this.cssObj.width = this.width ; + this.cssObj.height = this.height ; // -- Move if ( ! this.settings.nomove ) { - this.box.transform({'translate': this.x+'px, '+this.y+'px'}) ; + this.cssObj.translate = this.x+'px, '+this.y+'px' ; } + // -- Apply CSS Append and display + this.box.css(this.cssObj) ; + if ( this.dynamic ) this.box.appendTo(self.dom) ; + } ; // -- Init @@ -163,14 +141,14 @@ Layout.prototype.createObj = function(opts) { // -- Draw object into scene Obj.prototype.draw = function() { - if ( (this.y >= -2*this.height) && (this.y <= (Wyrian.height+this.height)) && this.x >= -this.width && this.x <= (Wyrian.width+this.width) ) { + if ( (this.y >= -2*this.height) && (this.y <= (Game.height+this.height)) && this.x >= -this.width && this.x <= (Game.width+this.width) ) { - Wyrian.activeElements++ ; + Game.activeElements++ ; // -- Set sprite to display if ( this.settings.sprites ) { this.lastSprite = this.lastSprite || 0 ; - if ( (Wyrian.loops%(this.settings.spriteMod||1)) == 0 ) this.lastSprite++ ; + if ( (Game.loops%(this.settings.spriteMod||1)) == 0 ) this.lastSprite++ ; if ( typeof this.settings.sprites[this.lastSprite] == 'undefined' ) this.lastSprite = 0 ; this.box.css({'backgroundPosition': -1*this.settings.sprites[this.lastSprite]*this.settings.width+'px 0'}) ; } @@ -270,7 +248,7 @@ Layout.prototype.createObj = function(opts) { this.settings.explode(this) ; } - Wyrian.log('█▬█ █ ▀█▀') ; + Game.log('█▬█ █ ▀█▀') ; } } diff --git a/js/layouts/PlayerLayer.js b/js/layouts/PlayerLayer.js index 2180402..de2a7a1 100644 --- a/js/layouts/PlayerLayer.js +++ b/js/layouts/PlayerLayer.js @@ -11,8 +11,8 @@ Layouts.Player = new Layout({ type: 'human', sprites: [0,1], origin: { - x: Wyrian.width/2 - 80, - y: Wyrian.height-220 + x: Game.width/2 - 80, + y: Game.height-220 }, fireInterval: 300, explode: function(obj) { @@ -24,23 +24,23 @@ Layouts.Player = new Layout({ animate: function(obj) { // -- KEY up /down - if ( Wyrian.input.keyboard.up ) { + if ( Game.input.keyboard.up ) { if ( obj.y > 0 ) obj.y -= obj.parent.settings.speed ; } - if ( Wyrian.input.keyboard.down && (obj.y < (Wyrian.height-obj.height) ) ) { + if ( Game.input.keyboard.down && (obj.y < (Game.height-obj.height) ) ) { obj.y += obj.parent.settings.speed; } // -- Left/Right move : choose sprite sequence to display - if ( Wyrian.input.keyboard.left && (obj.x > 0)) { + if ( Game.input.keyboard.left && (obj.x > 0)) { obj.x -= obj.parent.settings.speed; } - if ( Wyrian.input.keyboard.right && (obj.x < Wyrian.width-obj.width) ) { + if ( Game.input.keyboard.right && (obj.x < Game.width-obj.width) ) { obj.x += obj.parent.settings.speed; } // -- Press Space : fire - if ( Wyrian.input.keyboard.space ) { + if ( Game.input.keyboard.space ) { obj.parent.fire(obj) ; } @@ -56,7 +56,7 @@ Layouts.Player = new Layout({ animate: function(obj) { obj.settings.spriteMod = 3 ; obj.settings.sprites = [0,1] ; - if ( Wyrian.input.keyboard.up ) { + if ( Game.input.keyboard.up ) { obj.settings.sprites = [2,3,4] ; } } @@ -124,7 +124,7 @@ Layouts.Player.bulletLib = function(obj, bulletType) { if ( obj.deleteAfter ) return false; if ( obj.explosing ) { - Wyrian.log(obj) ; + Game.log(obj) ; return false ; } obj.y += obj.settings.speed*obj.settings.direction ; diff --git a/js/jquery-1.5.js b/js/libs/jquery-1.5.js similarity index 100% rename from js/jquery-1.5.js rename to js/libs/jquery-1.5.js diff --git a/js/jquery.transform-0.9.3.min.js b/js/libs/jquery.transform-0.9.3.min.js similarity index 100% rename from js/jquery.transform-0.9.3.min.js rename to js/libs/jquery.transform-0.9.3.min.js diff --git a/js/require.js b/js/libs/require.js similarity index 100% rename from js/require.js rename to js/libs/require.js diff --git a/js/libs/soundmanager/README.rdoc b/js/libs/soundmanager/README.rdoc new file mode 100644 index 0000000..b121244 --- /dev/null +++ b/js/libs/soundmanager/README.rdoc @@ -0,0 +1,98 @@ +== SoundManager 2: JavaScript Sound for the Web + +By wrapping and extending HTML5 and Flash Audio APIs, SoundManager 2 brings reliable cross-platform audio to JavaScript. + +== HTML5 Audio() Support (Beta-ish) + + * 100% Flash-free MP3 + MP4/AAC where supported, compatible with Apple iPad 3.2, iPhone/iOS 4 + * Fallback to Flash for MP3/MP4 support, as needed + * SM2 API is unchanged, transparent; HTML5/flash switching handled internally + * HTML5 API support approximates Flash 8 API features, minus ID3, plus buffering + * Some other formats (WAV/OGG) supported via HTML5, depending on browser + * See soundManager.useHTML5Audio for implementation details. + +== Basic API Features (Flash 8) + + * Load, stop, play, pause, mute, seek, pan and volume control of sounds from Javascript + * Events: onload, whileloading, whileplaying, onfinish and more + * ID3V1 and ID3V2 tag support for MP3s (title, artist, genre etc.) + +== Shiny Flash 9 Features + + * RTMP / Flash Media Server streaming support (new, experimental) + * MPEG-4 (AAC, HE-AAC, H.264) audio support + * "MultiShot" play (layered/chorusing effects) + * Waveform/frequency spectrum data + * Peak (L/R channel volume) data + * Audio buffering state/event handling + +== General Tech Stuff + + * Full API Documentation with examples and notes + * console.log()-style debug output and troubleshooting tools + * Community-based discussion/support + +== As heard on The Internets + +A few nifty sites that have implemented SM2 for driving audio: + + * Muxtape + * SoundCloud / The Cloud Player + * 8tracks + * Last.fm + * Opera (media player component) + * Discogs + * Mixcrate + +== Project home, documentation, live demos etc.: + +http://www.schillmania.com/projects/soundmanager2/ + + +== Merged fork ( kjvarga: http://github.com/kjvarga/SoundManager2/ ) + +This SM2 fork contains the SoundManager2 implementation that is used on http://www.kazaa.com. + +We added RTMP support to SM2 which is now part of the SM2 (experimental) branch as of V2.96a.20100606. + +Downloads: http://www.schillmania.com/projects/soundmanager2/doc/download/ + +For more background on the addition of RTMP check out http://getsatisfaction.com/schillmania/topics/soundmanager_doesnt_support_rtmp + +Our old branch of development has been moved to http://github.com/kjvarga/SoundManager2/tree/pre_merge. + +== Changes + +In addition to the documented SM2 options, we have added the following. + +New options to SM2: + +* ondebuglog callback called with every debugging message. Useful if you need to programatically have access to the debug logs. We use this in our automated reporting of stream failures for QA. + +New options to createSound: + +* bufferTimes optional array of buffer times for double/multiple-buffering. Just specify an array of incrementing buffer sizes (in seconds) e.g. [0.5, 2, 8] for a half-second, then 2 second, then 8 second buffer. Buffers increment when full and reset to the smallest buffer when empty, or when starting to play an unbuffered portion of the stream. +* onstats callback called with statistics including how long it took to connect to the server, and how long it took to play (useful for QA). + +Our FMS server has some peculiarities that we have to deal with: +* bytesLoaded is always 0 for a streaming sound +* NetStream.Play.Stop is sent when it shouldn't +* We cannot get the stream length using a typical getStreamLength call +* We cannot get bandwidth information + +== Debugging + +1. Set soundManager.debugFlash = true; +2. Use a debug version of the SWF e.g. soundmanager2_flash9_debug.swf +3. Open the Flash IDE. Open the SM2 source code files. Start a remote debugging session. +4. Refresh the application in the browser (make sure caching is off). +5. The SWF should connect to Flash and allow you to step through the source. + +If it doesn't: +1. Make sure that the Flash version you have installed supports debugging +2. Make sure that the Flash debugger application is using the same version of Flash. + +== SM2 + +Project home, documentation, live demos etc.: +http://www.schillmania.com/projects/soundmanager2/ diff --git a/js/libs/soundmanager/demo/360-player/360 button.psd b/js/libs/soundmanager/demo/360-player/360 button.psd new file mode 100644 index 0000000..afd0498 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360 button.psd differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-pause-light.gif b/js/libs/soundmanager/demo/360-player/360-button-pause-light.gif new file mode 100644 index 0000000..cf9eab3 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-pause-light.gif differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-pause-light.png b/js/libs/soundmanager/demo/360-player/360-button-pause-light.png new file mode 100644 index 0000000..8f66539 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-pause-light.png differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-pause.gif b/js/libs/soundmanager/demo/360-player/360-button-pause.gif new file mode 100644 index 0000000..6e589ea Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-pause.gif differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-pause.png b/js/libs/soundmanager/demo/360-player/360-button-pause.png new file mode 100644 index 0000000..dc84def Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-pause.png differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-play-light.gif b/js/libs/soundmanager/demo/360-player/360-button-play-light.gif new file mode 100644 index 0000000..eb36483 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-play-light.gif differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-play-light.png b/js/libs/soundmanager/demo/360-player/360-button-play-light.png new file mode 100644 index 0000000..a2f6557 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-play-light.png differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-play.gif b/js/libs/soundmanager/demo/360-player/360-button-play.gif new file mode 100644 index 0000000..b97cd7f Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-play.gif differ diff --git a/js/libs/soundmanager/demo/360-player/360-button-play.png b/js/libs/soundmanager/demo/360-player/360-button-play.png new file mode 100644 index 0000000..ce2d9a3 Binary files /dev/null and b/js/libs/soundmanager/demo/360-player/360-button-play.png differ diff --git a/js/libs/soundmanager/demo/360-player/360player-visualization.css b/js/libs/soundmanager/demo/360-player/360player-visualization.css new file mode 100644 index 0000000..98115f8 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/360player-visualization.css @@ -0,0 +1,100 @@ +/* larger canvas, spectrum + EQ visualization and other items */ + +.ui360, +.sm2-360ui { + /* size of the container for the circle, etc. */ + width:256px; + height:256px; +} + +.ui360 { + position:relative; + /* a little extra spacing */ + padding-top:1px; + padding-bottom:1px; + margin-bottom:-18px; /* approximate "line height" we want */ + padding-left:248px; + margin-left:0px; + background-position:22.6% 50%; /* (~109px) initial play button position */ +} + +.ui360 a { + font:14px "helvetica neue",helvetica,monaco,lucida,terminal,monospace; + white-space:nowrap; + line-height:256px; +} + +.sm2-360ui { + margin-left:-256px; +} + +.ui360 .sm2-timing { + line-height:256px; +} + +.ui360 .sm2-timing { + font:bold 24px "helvetica neue",helvetica,monaco,lucida,terminal,monospace; + color:#333; + text-align:center; + line-height:256px; + text-indent:0px; +} + +.sm2-inline-list .ui360, +.sm2-inline-list .sm2-360ui { + margin-left:0px; +} + +.sm2-inline-list .ui360 { + margin:8px 13px 7px 0px; + padding-left:0px; + background-position:50% 50%; /* initial play button position */ +} + +.sm2-inline-list .sm2-360ui { + border:1px solid #eee; + /* offset the border */ + margin-left:-1px; + margin-top:-1px; +} + +.sm2-inline-list .ui360 a { + position:absolute; + display:inline; + left:0px; + bottom:0px; + width:100%; /* 2px padding in box */ + height:100%; + *height:256px; /* IE is dumb. */ + overflow:hidden; + font-size:small; + font-weight:300; + color:#333; + margin:0px; + padding:0px; + line-height:488px; /* bottom vertical alignment for text */ + *line-height:480px; /* IE again */ + text-align:center; + -moz-border-radius:0px; + -khtml-border-radius:0px; + border-radius:0px; +} + +.sm2-inline-list .ui360:hover { + background-color:#fbfbfb; +} + +.sm2-inline-list .ui360 a.sm2_link:hover, +.sm2-inline-list .ui360 a:focus, +.sm2-inline-list .ui360 a:active { + background-color:transparent; +} + +/* Use a bigger loading image for this layout */ + + +.ui360:hover .sm2-360btn-default { + background:transparent url(360-button-play-light.png) no-repeat 50% 50%; + _background:transparent url(360-button-play.gif) no-repeat 50% 50%; + cursor:pointer; +} diff --git a/js/libs/soundmanager/demo/360-player/360player.css b/js/libs/soundmanager/demo/360-player/360player.css new file mode 100644 index 0000000..63d92c4 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/360player.css @@ -0,0 +1,251 @@ +/* General warning: Beta-ish. Code could be a bit cleaner. */ + +.ui360, +.sm2-360ui { + /* size of the container for the circle, etc. */ + width:50px; + height:50px; +} + +.ui360 { + position:relative; + /* a little extra spacing */ + padding-top:1px; + padding-bottom:1px; + margin-bottom:-18px; /* approximate "line height" we want */ + padding-left:42px; /* 50px, with a few off - margin used for visualization UI */ + width:auto; +} + +.ui360, +.ui360 * { + position:relative; + vertical-align:middle; +} + + +.ui360 a { + line-height:50px; +} + +.sm2-360ui { + position:relative; + display:inline-block; /* firefox 3 et al */ + float:left; /* firefox 2 needs this, inline-block would work with fx3 and others */ + *float:left; /* IE 6+7 */ + *display:inline; + *clear:left; + margin-left:-50px; +} + +.sm2-360ui.sm2_playing, +.sm2-360ui.sm2_paused { + /* bump on top when active */ + z-index:10; +} + +.ui360 a.sm2_link { /* this class added to playable links by SM2 */ + position:relative; +} + +.ui360 a { + color:#000; + text-decoration:none; +} + +.ui360 a, +.ui360 a:hover, +.ui360 a:focus { + padding:2px; + margin-left:-2px; + margin-top:-2px; +} + +.ui360 a:hover, +.ui360 a:focus { + background:#eee; + -moz-border-radius:3px; + -webkit-border-radius:3px; + -khtml-border-radius:3px; + border-radius:3px; + outline:none; +} + +.ui360 .sm2-canvas { + position:absolute; + left:0px; + top:0px; +} + +.ui360 .sm2-timing { + position:absolute; + display:block; + left:0px; + top:0px; + width:100%; + height:100%; + margin:0px; + font:11px "helvetica neue",helvetica,monaco,lucida,terminal,monospace; + color:#666; + text-align:center; + line-height:50px; +} + +.ui360 .sm2-timing.alignTweak { + text-indent:1px; /* devious center-alignment tweak for Safari (might break things for others.) */ +} + +.ui360 .sm2-cover { + position:absolute; + left:0px; + top:0px; + width:100%; + height:100%; + z-index:2; + display:none; +} + +.ui360 .sm2-360btn { + position:absolute; + top:50%; + left:50%; + width:22px; + height:22px; + margin-left:-11px; + margin-top:-11px; + cursor:pointer; + z-index:3; +} + +.ui360 .sm2-360btn-default { +} + +.ui360 .sm2-360data { + display:inline-block; + font-family:helvetica; +} + +.ui360 .sm2-360ui.sm2_playing .sm2-cover, +.ui360 .sm2-360ui.sm2_paused .sm2-cover { + display:block; +} + +/* this could be optimized a fair bit. */ + +.ui360, +.ui360 .sm2-360btn-default { + background:transparent url(360-button-play.png) no-repeat 50% 50%; + _background:transparent url(360-button-play.gif) no-repeat 50% 50%; /* IE 6-only: special crap GIF */ + cursor:pointer; +} + +.ui360 { + /* + "fake" button shown before SM2 has started, non-JS/non-SM2 case etc. + background image will be removed via JS, in threeSixyPlayer.init() + */ + background-position:6px 50%; +} + +.ui360 .sm2-360ui.sm2_paused .sm2-360btn { + background:transparent url(360-button-play.png) no-repeat 50% 50%; + _background:transparent url(360-button-play.gif) no-repeat 50% 50%; + cursor:pointer; +} + +.ui360 .sm2-360btn-default:hover, +.ui360 .sm2-360ui.sm2_paused .sm2-360btn:hover { + background:transparent url(360-button-play-light.png) no-repeat 50% 50%; + _background:transparent url(360-button-play.gif) no-repeat 50% 50%; + cursor:pointer; +} + +.ui360 .sm2-360ui.sm2_playing .sm2-360btn:hover, +.ui360 .sm2-360btn-playing:hover { + background:transparent url(360-button-pause-light.png) no-repeat 50% 50%; + _background:transparent url(360-button-pause-light.gif) no-repeat 50% 50%; + cursor:pointer; +} + + +.ui360 .sm2-360ui.sm2_playing .sm2-timing { + visibility:visible; +} + +.ui360 .sm2-360ui.sm2_buffering .sm2-timing { + visibility:hidden; +} + +.ui360 .sm2-360ui .sm2-timing, +.ui360 .sm2-360ui .sm2-360btn:hover + .sm2-timing, +.ui360 .sm2-360ui.sm2_paused .sm2-timing { + visibility:hidden; +} + +.ui360 .sm2-360ui.sm2_dragging .sm2-timing, +.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover + .sm2-timing { + /* paused + dragging */ + visibility:visible; +} + +.ui360 .sm2-360ui.sm2_playing .sm2-360btn, +x.ui360 .sm2-360btn-playing, +.ui360 .sm2-360ui.sm2_dragging .sm2-360btn, +.ui360 .sm2-360ui.sm2_dragging .sm2-360btn:hover, +.ui360 .sm2-360ui.sm2_dragging .sm2-360btn-playing:hover { + /* don't let pause button show on hover when dragging (or paused and dragging) */ + background:transparent; + cursor:auto; +} + +.ui360 .sm2-360ui.sm2_buffering .sm2-360btn, +.ui360 .sm2-360ui.sm2_buffering .sm2-360btn:hover { + background:transparent url(icon_loading_spinner.gif) no-repeat 50% 50%; + opacity:0.5; + visibility:visible; +} + +/* inline list style */ + +.sm2-inline-list .ui360, +.sm2-inline-block .ui360 { + position:relative; + display:inline-block; + float:left; + _display:inline; + margin-bottom:-15px; +} + +.sm2-inline-list .ui360 { + margin-bottom:0px; +} + +.sm2-inline-block .ui360 { + margin-right:8px; +} + +.sm2-inline-list .ui360 a { + display:none; +} + +/* annotations */ + +ul.ui360playlist { + list-style-type:none; +} + +ul.ui360playlist, +ul.ui360playlist li { + margin:0px; + padding:0px; +} + +div.ui360 div.metadata { + display:none; +} + +div.ui360 a span.metadata, +div.ui360 a span.metadata * { + /* name of track, note etc. */ + vertical-align:baseline; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/360-player/canvas-visualization-basic.html b/js/libs/soundmanager/demo/360-player/canvas-visualization-basic.html new file mode 100644 index 0000000..4e45504 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/canvas-visualization-basic.html @@ -0,0 +1,125 @@ + + + +360° MP3 player UI demo (SoundManager 2): Javascript + Canvas Visualization, basic example + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

360° Player Demo - Visualization Example, Basic Template

+ +

Canvas-based UI with visualization options. Note: No EQ/spectrum support for IE (too slow.) Data not available in HTML5.

+ +
+ +
+ +
+ + + +

Inline list

+ +
+ + + + + + +
+ +

Block list

+ +
+ + +
+ +
+ +

+ SoundManager 2 project page (not an MP3 link) +

+ +
+ + + diff --git a/js/libs/soundmanager/demo/360-player/canvas-visualization.html b/js/libs/soundmanager/demo/360-player/canvas-visualization.html new file mode 100644 index 0000000..b5635f8 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/canvas-visualization.html @@ -0,0 +1,334 @@ + + + +360° MP3 player UI demo (SoundManager 2): Javascript + Canvas Visualization + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

SoundManager 2 / 360° Player Demo: JS + Canvas Visualization

+ +

Canvas-based UI with visualization options. Note: Spectrum/EQ visualizations disabled for IE (too slow.) Data is not currently available under HTML5.

+

You can also show FPS or customize the UI, or see the hi-fi version. Check the basic template for a minimal code example; also see the default 360° UI.

+ + + + + + + +
+ +
+ +

Inline list

+ +
+ + + + + + +
+ +

Artist thank-yous: "Blue Belle Lament" courtesy of Adrian Glynn. "I Tried" and "People Asking" courtesy of SonReal.

+ +

Block list

+ +
+ + + +
+ + +
+ +

Variant: Annotations/meta-data

+ + + + +
+ +

+ SoundManager 2 project page (not an MP3 link) +

+ + + +
+ + + diff --git a/js/libs/soundmanager/demo/360-player/demo-slider-controls.css b/js/libs/soundmanager/demo/360-player/demo-slider-controls.css new file mode 100644 index 0000000..ea057e8 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/demo-slider-controls.css @@ -0,0 +1,179 @@ +#cp-container { position:relative;float:left;display:inline; margin-left:1em;padding: 6px; background-color: #f6f6f6; border:1px solid #eee; width: 320px; height:180px;z-index:2; } + +.yui-picker-controls li, +.yui-picker-controls input { + font-size:1em; + font-family:"helvetica neue",helvetica,arial,verdana; +} + +#controls { + position:relative; + margin-top:1.5em; + font-size:0.85em; +} + +#options { + float:left; + display:inline; + margin-bottom:0.5em; + margin-top:-1.2em; +} + +#controls .checkbox { + float:left; + display:inline; + width:21.2em; + margin-right:2.5em; +} + +#controls .checkbox div { + /* tab */ + width:auto; + padding:0.4em; + border:1px solid #ddd; + border-bottom:none; + background:#eee; +} + +#controls .checkbox div, +#controls .checkbox input { + font-family:arial,tahoma,verdana,"sans serif"; + font-size:1em; + vertical-align:middle; +} + +#controls dl { + width:21em; +} + +#controls dl.col { + position:relative; + float:left; + display:inline; + margin:0px; + margin-right:1em; + padding:0.75em; +/* + height:12.4em; +*/ + height:auto; + border:1px solid #ddd; + background:#f6f6f6; +} + +#controls .disabled { + color:#ccc; +} + +#controls .disabled dt, +#controls .disabled dd { + color:#999; + opacity:0.5; +} + +#controls dl dd p { + margin:0px; + padding:0px; +} + +#controls dt, +#controls dd { + margin:0px; + padding:0px; +} + +#controls dt { + border-bottom:none; +} + +#controls dt { + float:left; + display:inline; + background:transparent; + padding-right:0.7em; + margin-right:0.7em; + border-right:1px solid #ccc; + font-size:1.1em; + color:#333; + font-family:"helvetica neue",helvetica,verdana,arial,"sans serif"; +} + +#controls dd { + margin:0px; + padding:0px; + font-size:0.9em; + vertical-align:middle; + color:#666; +} + +#controls .title { + float:left; + display:inline; + margin-right:0.6em; + color:#333; +} + +/* those slider bits you might be wondering about */ + +#controls .control { + position:relative; + border-left:0px; + width:214px; + height:20px; +} + +#controls .control .bar { + position:absolute; + left:0px; + top:0px; + width:214px; + height:20px; + background:transparent url(../_image/slider-bar.gif) no-repeat 0px 9px; + cursor:pointer; + cursor:hand; +} + +#controls .control .slider { + position:absolute; + left:0px; + top:0px; + width:20px; + height:20px; + background:transparent url(../_image/slider.png) no-repeat 0px 0px; + *background:none; + filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider.png'); + cursor:pointer; + cursor:hand; +} + +#controls .control .slider:hover { + background:transparent url(../_image/slider-1.png) no-repeat 0px 0px; + *background:none; +} + +#controls .control .slider.hover { + filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-1.png'); +} + +#controls .disabled .control .slider { + background:transparent url(../_image/slider-disabled.png) no-repeat 0px 0px; + *background:none; + filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-disabled.png'); +} + +#controls .disabled .control .slider:hover { + background:transparent url(../_image/slider-disabled-1.png) no-repeat 0px 0px; + *background:none; +} + +#controls .disabled .control .slider.hover { + filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../_image/slider-disabled-1.png'); +} + +#controls input[type=text] { + width:5em; +} + +#options div { + margin-bottom:0.25em; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/360-player/demo-slider-controls.js b/js/libs/soundmanager/demo/360-player/demo-slider-controls.js new file mode 100644 index 0000000..1da39d1 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/demo-slider-controls.js @@ -0,0 +1,714 @@ +/* + Ancient fireworks slider control code (2005) + http://schillmania.com/projects/fireworks/ + -------------------------------------------- + Not required for your use! +*/ + +function Animator2() { + var self = this; + this.tweens = []; + this.tweens['default'] = [1,2,3,4,5,6,7,8,9,10,9,8,7,6,5,4,3,2,1]; + this.tweens['blast'] = [12,12,11,10,10,9,8,7,6,5,4,3,2,1]; + this.tweens['fade'] = [10,10,10,10,10,10,10,10,10,10]; + this.queue = []; + this.queue.IDs = []; + this.active = false; + this.timer = null; + + this.createTween = function(start,end,type) { + // return array of tween coordinate data (start->end) + type = type||'default'; + var tween = [start]; + var tmp = start; + var diff = end-start; + var x = self.tweens[type].length; + for (var i=0; i= 0.4 && pos <= 0.6) { + pos = 0.5; + } + pos = parseInt(pos*100); + // writeDebug('getPanX('+x+'): '+pos+'%'); + return pos; + } + + this.isEmpty = function(o) { + // needs further hacking + return (typeof(o)=='undefined'||(o==null&&o!=0)||(o==''&&o!=0)||o=='null'); + } + + this.init = function() { +// self.oFW = document.getElementById('fw'); +// self.oFP = document.getElementById('fp'); +// if (typeof(enableDebugMode)!='undefined' && (self.DEBUG||window.location.toString().toLowerCase().indexOf('debug')>=0)) enableDebugMode(); + self.getWindowCoords(); + self.animator = new Animator2(); + } + + this.destructor = function() { +/* + for (var i=self.fireworks.length; i--;) { + self.fireworks[i] = null; + } + self.fireworks = null; + if (soundManager) { + soundManager.destructor(); + soundManager = null; + } +*/ + } + + if (this.isSafari || this.isOpera) this.getWindowCoords = this.getWindowCoordsAlt; + +} + + +function Controller(o) { + var self = this; + this.o = o; + this.controls = []; + this.cb = []; + this.options = []; + this.functionExample = document.getElementById('function-example'); + this.fbIE = null; + + this.randomize = function() { + for (var i=1; i,\n\ + autoPlay: "+threeSixtyPlayer.config.autoPlay+",\n\ + allowMultiple: "+threeSixtyPlayer.config.allowMultiple+",\n\ + loadRingColor: '"+threeSixtyPlayer.config.loadRingColor+"',\n\ + playRingColor: '"+threeSixtyPlayer.config.playRingColor+"',\n\ + backgroundRingColor: '"+threeSixtyPlayer.config.backgroundRingColor+"',\n\ + circleDiameter: "+threeSixtyPlayer.config.circleDiameter+",\n\ + circleRadius: "+threeSixtyPlayer.config.circleRadius+",\n\ + imageRoot: '"+threeSixtyPlayer.config.imageRoot+"',\n\ + animDuration: "+threeSixtyPlayer.config.animDuration+",\n\ + animTransition: Animator.tx.bouncy,\n\ + showHMSTime: "+threeSixtyPlayer.config.showHMSTime+",\n\ +\n\ + useWaveformData: "+threeSixtyPlayer.config.useWaveformData+",\n\ + waveformDataColor: '"+threeSixtyPlayer.config.waveformDataColor+"',\n\ + waveformDataDownsample: "+threeSixtyPlayer.config.waveformDataDownsample+",\n\ + waveformDataOutside: "+threeSixtyPlayer.config.waveformDataOutside+",\n\ + waveformDataConstrain: false,\n\ + waveformDataLineRatio: "+threeSixtyPlayer.config.waveformDataLineRatio+",\n\ +\n\ + useEQData: "+threeSixtyPlayer.config.useEQData+",\n\ + eqDataColor: '"+threeSixtyPlayer.config.eqDataColor+"',\n\ + eqDataDownsample: "+threeSixtyPlayer.config.eqDataDownsample+",\n\ + eqDataOutside: "+threeSixtyPlayer.config.eqDataOutside+",\n\ + eqDataLineRatio: "+threeSixtyPlayer.config.eqDataLineRatio+",\n\ +\n\ + usePeakData: "+threeSixtyPlayer.config.usePeakData+",\n\ + peakDataColor: '"+threeSixtyPlayer.config.peakDataColor+"',\n\ + peakDataOutside: "+threeSixtyPlayer.config.peakDataOutside+",\n\ + peakDataLineRatio: "+threeSixtyPlayer.config.peakDataLineRatio+",\n\ +\n\ + useAmplifier: "+threeSixtyPlayer.config.useAmplifier+"\n\ +\n\ +}"; +document.getElementById('config-code').style.display = 'block'; // weird Fx fix + } + + this.createCustomFirework = function() { + } + + this.destructor = function() { + for (var i=self.controls.length; i--;) { + self.controls[i].destructor(); + } + for (i=self.cb.length; i--;) { + self.cb.onclick = null; + self.cb[i] = null; + } + for (i=self.options.length; i--;) { + self.options[i] = null; + } + if (navigator.userAgent.match(/msie/i)) { + self.fbIE.onmouseover = null; + self.fbIE.onmouseout = null; + self.fbIE = null; + } + self.cb = null; + self.options = null; + self.controls = null; + self.functionExample = null; + self.o = null; + } + + var items = parseInt(this.o.length/3); + for (var i=0; iself.xMax) { + x = self.xMax; + } else if (x=self.tween.length-1) { + self.active = false; + self.frame = 0; + if (self._oncomplete) self._oncomplete(); +// self.doUpdate(); + return false; + } + self.doUpdate(); + return true; + } + + this.doUpdate = function(t) { + // if (!self.timer) self.timer = setTimeout(self.update,t||20); + self.update(); + } + + this.update = function() { + self.timer = null; + self.value = 1+parseInt(self.x/self.xMax*(self.scale-1)); + if (self.value<1) self.value = 1; + // if (self.oV.innerHTML != self.value) self.oV.innerHTML = self.value; + // self.oV.innerHTML = self.value; + } + + this.setValue = function(x) { + self.slide(self.x,Math.min(self.xMax,x)); + } + + this.randomize = function() { + self.slide(self.x,parseInt(Math.random()*self.xMax)); + } + + this.destructor = function() { + self.o.onmouseover = null; + self.o.onmouseout = null; + self.o.onmousedown = null; + self.o = null; + self.oV = null; + self.oB.onclick = null; + self.oB = null; + } + + if (soundManager.isIE) { + // IE is lame, no :hover + this.o.onmouseover = this.over; + this.o.onmouseout = this.out; + } + + this.o.onmousedown = this.down; + this.oB.onclick = this.barClick; + self.update(); + +} + +var gOID = 0; + +function demoInit() { + controller = new Controller(document.getElementById('controls').getElementsByTagName('dd')); +} + +function demoDestuctor() { + controller.destructor(); + controller = null; +} + +var controller = null; + +var mc = new MainController(); +// create null objects if APIs not present + +function createCP(oInput,oHandler) { + var Event = YAHOO.util.Event; + + cpHandler = oHandler; + if (picker != null) { + // picker.showcontrols(true); + var c = oInput.value.substr(1); + picker.setValue(hex2decArray([c.substr(0,2),c.substr(2,2),c.substr(4,2)]),true); // be silent + return false; + } + + Event.onDOMReady(function() { + picker = new YAHOO.widget.ColorPicker("cp-container", { + showhsvcontrols: true, + showhexcontrols: true, + images: { + PICKER_THUMB: "../_image/picker_thumb.png", + HUE_THUMB: "../_image/hue_thumb.png" + } + }); + +// picker.showcontrols(false); + //a listener for logging RGB color changes; + //this will only be visible if logger is enabled: + var onRgbChange = function(o) { + /*o is an object + { newValue: (array of R, G, B values), + prevValue: (array of R, G, B values), + type: "rgbChange" + } + */ + cpHandler(o.newValue); + controller.updateExampleCode(); + } + + //subscribe to the rgbChange event; + picker.on("rgbChange", onRgbChange); + + //use setValue to reset the value to white: + Event.on("reset", "click", function(e) { + picker.setValue([255, 255, 255], false); //false here means that rgbChange + //wil fire; true would silence it + }); + + //use the "get" method to get the current value + //of one of the Color Picker's properties; in + //this case, we'll get the hex value and write it + //to the log: + Event.on("gethex", "click", function(e) { + console.log("Current hex value: " + picker.get("hex")); + }); + + }); +} + +var picker = null; + +cpHandler = function() { +} + + + // hex -> dec / dec -> hex + // http://www.southwest.com.au/~jfuller/binary/converter.htm + + function dec2hex(cval) { + if (cval > 255) cval = 255; + var hexascii = "0123456789ABCDEF"; + var cval0 = Math.floor(cval/16); + var cval1 = cval-(cval0*16); + var c1 = hexascii.charAt(cval0); + var c2 = hexascii.charAt(cval1); + return (c1+c2); + } + + function hex2dec(cval) { + cval = cval.toUpperCase(); + var tval = 0; + var hexascii = "0123456789ABCDEF"; + var mychar, ch; + for (var c=0; c + + +360° MP3 player UI demo (SoundManager 2) + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

SoundManager 2 / 360° Player: JS + Canvas UI

+ +

Canvas-based UI. Load progress, seek, play/pause etc. Also see 360° UI visualization demo.

+ +
+ +
+ +
+ + + + +
+ +

Alternate style: inline

+ + + +
+ +
+ +
+ + +

How This Works

+ +

The script looks for a container element matching div.ui360, and then the first link inside of it.

+ +
+ +
<div class="ui360">
+ <a href="/path/to/an.mp3">
+</div>
+ +
+ +

When the link is clicked, the script adds a UI template to the block, prepending it in front of the MP3 link:

+ +
<div class="ui360">
+ <-- dynamically-inserted block -->
+ <div class="ui">
+  <canvas class="sm2-canvas"></canvas>
+  <img class="sm2-360btn" /> 
+  <div class="sm2-timing"></div>
+  <div class="sm2-cover"></div>
+ </div>
+ <-- /UI -->
+ <a href="/path/to/an.mp3">
+</div>
+ +

Customizing the UI

+ +

The player's default 50x50-pixel canvas is defined both within JavaScript and CSS. For an example with different values, see this larger version.

+ +
threeSixtyPlayer.config = {
+  playNext: false, // stop after one sound, or play through list until end
+  autoPlay: false, // start playing the first sound right away
+  allowMultiple: true, // let many sounds play at once (false = one at a time)
+  loadRingColor: '#ccc', // amount of sound which has loaded
+  playRingColor: '#000', // amount of sound which has played
+  backgroundRingColor: '#eee', // "default" color shown underneath everything else
+  imageRoot: '', // path to prepend for empty.gif used for play/pause button
+  animDuration: 500,
+  animTransition: Animator.tx.bouncy // http://www.berniecode.com/writing/animator.html
+}
+ +

The CSS for the canvas UI block is a bit ugly, but JavaScript reads the width of the .sm2-360ui element in the DOM as set by CSS and uses that to later draw and update the canvas element while playing.

+ +
.ui360,
+.sm2-360ui {
+  /* size of the container for the circle, etc. */
+  width:50px;
+  height:50px;
+}
+
+ +

Third-party Components

+ +

This demo includes use of Bernie's Better Animation Class (Apache licensed) for some animation effects.

+

Also, some loader/spinner icons from ajaxload.info are used for showing loading/buffering states.

+ +
+ +

+ SoundManager 2 project page (not an MP3 link) +

+ + +
+ + + diff --git a/js/libs/soundmanager/demo/360-player/script/360player.js b/js/libs/soundmanager/demo/360-player/script/360player.js new file mode 100644 index 0000000..1dd832d --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/script/360player.js @@ -0,0 +1,1225 @@ +/* + + SoundManager 2 Demo: 360-degree / "donut player" + ------------------------------------------------ + http://schillmania.com/projects/soundmanager2/ + + An inline player with a circular UI. + Based on the original SM2 inline player. + Inspired by Apple's preview feature in the + iTunes music store (iPhone), among others. + + Requires SoundManager 2 Javascript API. + Also uses Bernie's Better Animation Class (BSD): + http://www.berniecode.com/writing/animator.html + +*/ + +function ThreeSixtyPlayer() { + var self = this; + var pl = this; + var sm = soundManager; // soundManager instance + var uA = navigator.userAgent; + var isIE = (uA.match(/msie/i)); + var isOpera = (uA.match(/opera/i)); + var isSafari = (uA.match(/safari/i)); + var isChrome = (uA.match(/chrome/i)); + var isFirefox = (uA.match(/firefox/i)); + var isTouchDevice = (uA.match(/ipad|iphone/i)); + var hasRealCanvas = (typeof G_vmlCanvasManager === 'undefined' && typeof document.createElement('canvas').getContext('2d') !== 'undefined'); + this.excludeClass = 'threesixty-exclude'; // CSS class for ignoring MP3 links + this.links = []; + this.sounds = []; + this.soundsByURL = []; + this.indexByURL = []; + this.lastSound = null; + this.soundCount = 0; + this.oUITemplate = null; + this.oUIImageMap = null; + this.vuMeter = null; + + this.config = { + + playNext: false, // stop after one sound, or play through list until end + autoPlay: false, // start playing the first sound right away + allowMultiple: false, // let many sounds play at once (false = only one sound playing at a time) + loadRingColor: '#ccc', // how much has loaded + playRingColor: '#000', // how much has played + backgroundRingColor: '#eee', // color shown underneath load + play ("not yet loaded" color) + + // optional segment/annotation (metadata) stuff.. + segmentRingColor: 'rgba(255,255,255,0.33)', // metadata/annotation (segment) colors + segmentRingColorAlt: 'rgba(0,0,0,0.1)', + loadRingColorMetadata: '#ddd', // "annotations" load color + playRingColorMetadata: 'rgba(96,160,224,0.99)', // how much has played when metadata is present + playRingColorMetadata: 'rgba(128,192,256,0.9)', // how much has played when metadata is present + + circleDiameter: null, // set dynamically according to values from CSS + circleRadius: null, + imageRoot: '', // image path to prepend for transparent .GIF - eg. /images/ + animDuration: 500, + animTransition: Animator.tx.bouncy, // http://www.berniecode.com/writing/animator.html + showHMSTime: false, // hours:minutes:seconds vs. seconds-only + scaleFont: false, // also set the font size (if possible) while animating the circle + + // optional: spectrum or EQ graph in canvas (not supported in IE, too slow via ExCanvas) + useWaveformData: false, + waveformDataColor: '#0099ff', + waveformDataDownsample: 3, // use only one in X (of a set of 256 values) - 1 means all 256 + waveformDataOutside: false, + waveformDataConstrain: false, // if true, +ve values only - keep within inside circle + waveformDataLineRatio: 0.64, + + // "spectrum frequency" option + useEQData: false, + eqDataColor: '#339933', + eqDataDownsample: 4, // use only one in X (of 256 values) + eqDataOutside: true, + eqDataLineRatio: 0.54, + + // enable "amplifier" (canvas pulses like a speaker) effect + usePeakData: true, + peakDataColor: '#ff33ff', + peakDataOutside: true, + peakDataLineRatio: 0.5, + + useAmplifier: true, // "pulse" like a speaker + + fontSizeMax: null, // set according to CSS + + useFavIcon: false // Experimental (also requires usePeakData: true).. Try to draw a "VU Meter" in the favicon area, if browser supports it (Firefox + Opera as of 2009) + + } + + this.css = { + // CSS class names appended to link during various states + sDefault: 'sm2_link', // default state + sBuffering: 'sm2_buffering', + sPlaying: 'sm2_playing', + sPaused: 'sm2_paused' + } + + this.addEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.addEventListener(evtName,evtHandler,false):o.attachEvent('on'+evtName,evtHandler); + } + + this.removeEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.removeEventListener(evtName,evtHandler,false):o.detachEvent('on'+evtName,evtHandler); + } + + this.hasClass = function(o,cStr) { + return (typeof(o.className)!='undefined'?o.className.match(new RegExp('(\\s|^)'+cStr+'(\\s|$)')):false); + } + + this.addClass = function(o,cStr) { + if (!o || !cStr || self.hasClass(o,cStr)) return false; + o.className = (o.className?o.className+' ':'')+cStr; + } + + this.removeClass = function(o,cStr) { + if (!o || !cStr || !self.hasClass(o,cStr)) return false; + o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),''); + } + + this.getElementsByClassName = function(className,tagNames,oParent) { + var doc = (oParent||document); + var matches = []; + var i,j; + var nodes = []; + if (typeof tagNames != 'undefined' && typeof tagNames != 'string') { + for (i=tagNames.length; i--;) { + if (!nodes || !nodes[tagNames[i]]) { + nodes[tagNames[i]] = doc.getElementsByTagName(tagNames[i]); + } + } + } else if (tagNames) { + nodes = doc.getElementsByTagName(tagNames); + } else { + nodes = doc.all||doc.getElementsByTagName('*'); + } + if (typeof(tagNames)!='string') { + for (i=tagNames.length; i--;) { + for (j=nodes[tagNames[i]].length; j--;) { + if (self.hasClass(nodes[tagNames[i]][j],className)) { + matches.push(nodes[tagNames[i]][j]); + } + } + } + } else { + for (i=0; i 1) { + // only catch left-clicks + return true; + } + var o = self.getTheDamnLink(e); + if (o.nodeName.toLowerCase() != 'a') { + o = self.isChildOfNode(o,'a'); + if (!o) return true; + } + if (!self.isChildOfClass(o,'ui360')) { + // not a link we're interested in + return true; + } + var sURL = o.getAttribute('href'); + if (!o.href || !sm.canPlayLink(o) || self.hasClass(o,self.excludeClass)) { + return true; // pass-thru for non-MP3/non-links + } + sm._writeDebug('handleClick()'); + var soundURL = (o.href); + var thisSound = self.getSoundByURL(soundURL); + if (thisSound) { + // already exists + if (thisSound == self.lastSound) { + // and was playing (or paused) + thisSound.togglePause(); + } else { + // different sound + thisSound.togglePause(); // start playing current + sm._writeDebug('sound different than last sound: '+self.lastSound.sID); + if (!self.config.allowMultiple && self.lastSound) { + self.stopSound(self.lastSound); + } + } + } else { + // append some dom shiz + + // create sound + thisSound = sm.createSound({ + id:'ui360Sound'+(self.soundCount++), + url:soundURL, + onplay:self.events.play, + onstop:self.events.stop, + onpause:self.events.pause, + onresume:self.events.resume, + onfinish:self.events.finish, + onbufferchange:self.events.bufferchange, + whileloading:self.events.whileloading, + whileplaying:self.events.whileplaying + }); + var oContainer = o.parentNode; + // tack on some custom data + + thisSound._360data = { + oUI360: self.getParentByClassName(o,'ui360'), // the (whole) entire container + oLink: o, // DOM node for reference within SM2 object event handlers + className: self.css.sPlaying, + oUIBox: self.getElementsByClassName('sm2-360ui','div',oContainer)[0], + oCanvas: self.getElementsByClassName('sm2-canvas','canvas',oContainer)[0], + oButton: self.getElementsByClassName('sm2-360btn','img',oContainer)[0], + oTiming: self.getElementsByClassName('sm2-timing','div',oContainer)[0], + oCover: self.getElementsByClassName('sm2-cover','div',oContainer)[0], + lastTime: null, + didFinish: null, + pauseCount:0, + radius:0, + amplifier: (self.config.usePeakData?0.9:1), // TODO: x1 if not being used, else use dynamic "how much to amplify by" value + radiusMax: self.config.circleDiameter*0.175, // circle radius + width:0, + widthMax: self.config.circleDiameter*0.4, // width of the outer ring + lastValues: { + bytesLoaded: 0, + bytesTotal: 0, + position: 0, + durationEstimate: 0 + }, // used to track "last good known" values before sound finish/reset for anim + animating: false, + oAnim: new Animator({ + duration: self.config.animDuration, + transition:self.config.animTransition, + onComplete: function() { + // var thisSound = this; + // thisSound._360data.didFinish = false; // reset full circle + } + }), + oAnimProgress: function(nProgress) { + var thisSound = this; + thisSound._360data.radius = parseInt(thisSound._360data.radiusMax*thisSound._360data.amplifier*nProgress); + thisSound._360data.width = parseInt(thisSound._360data.widthMax*thisSound._360data.amplifier*nProgress); + if (self.config.scaleFont && self.config.fontSizeMax != null) { + thisSound._360data.oTiming.style.fontSize = parseInt(Math.max(1,self.config.fontSizeMax*nProgress))+'px'; + thisSound._360data.oTiming.style.opacity = nProgress; + } + if (thisSound.paused || thisSound.playState == 0 || thisSound._360data.lastValues.bytesLoaded == 0 || thisSound._360data.lastValues.position == 0) { + self.updatePlaying.apply(thisSound); + } + }, + fps: 0 + }; + + // "Metadata" (annotations) + if (typeof self.Metadata != 'undefined' && self.getElementsByClassName('metadata','div',thisSound._360data.oUI360).length) { + thisSound._360data.metadata = new self.Metadata(thisSound,self); + } + + // set the cover width/height to match the canvas + /* + thisSound._360data.oCover.style.width = self.config.circleDiameter+'px'; + thisSound._360data.oCover.style.height = self.config.circleDiameter+'px'; + */ + + // minimize ze font + if (self.config.scaleFont && self.config.fontSizeMax != null) { + thisSound._360data.oTiming.style.fontSize = '1px'; + } + + // set up ze animation + thisSound._360data.oAnim.addSubject(thisSound._360data.oAnimProgress,thisSound); + + // animate the radius out nice + self.refreshCoords(thisSound); + + self.updatePlaying.apply(thisSound); + + self.soundsByURL[soundURL] = thisSound; + self.sounds.push(thisSound); + if (!self.config.allowMultiple && self.lastSound) { + self.stopSound(self.lastSound); + } + thisSound.play(); + } + + self.lastSound = thisSound; // reference for next call + + if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') { + e.preventDefault(); + } else if (typeof event != 'undefined') { + event.returnValue = false; + } + return false; + } + + this.fanOut = function(oSound) { + var thisSound = oSound; + if (thisSound._360data.animating == 1) { + return false; + } + thisSound._360data.animating = 0; + soundManager._writeDebug('fanOut: '+thisSound.sID+': '+thisSound._360data.oLink.href); + thisSound._360data.oAnim.seekTo(1); // play to end + window.setTimeout(function() { + // oncomplete hack + thisSound._360data.animating = 0; + },self.config.animDuration+20); + } + + this.fanIn = function(oSound) { + var thisSound = oSound; + if (thisSound._360data.animating == -1) { + return false; + } + thisSound._360data.animating = -1; + soundManager._writeDebug('fanIn: '+thisSound.sID+': '+thisSound._360data.oLink.href); + // massive hack + thisSound._360data.oAnim.seekTo(0); // play to end + window.setTimeout(function() { + // reset full 360 fill after animation has completed (oncomplete hack) + thisSound._360data.didFinish = false; + thisSound._360data.animating = 0; + self.resetLastValues(thisSound); + },self.config.animDuration+20); + + } + + this.resetLastValues = function(oSound) { + var oData = oSound._360data; + oData.lastValues.position = 0; + // oData.lastValues.bytesLoaded = 0; // will likely be cached, if file is small + // oData.lastValues.bytesTotal = 0; + // oData.lastValues.durationEstimate = 0; + } + + this.refreshCoords = function(thisSound) { + thisSound._360data.canvasXY = self.findXY(thisSound._360data.oCanvas); + // thisSound._360data.canvasMid = [Math.floor(thisSound._360data.oCanvas.offsetWidth/2), Math.floor(thisSound._360data.oCanvas.offsetHeight/2)]; // doesn't work in IE, w/h are wrong + thisSound._360data.canvasMid = [self.config.circleRadius,self.config.circleRadius]; + thisSound._360data.canvasMidXY = [thisSound._360data.canvasXY[0]+thisSound._360data.canvasMid[0], thisSound._360data.canvasXY[1]+thisSound._360data.canvasMid[1]]; + } + + this.stopSound = function(oSound) { + soundManager._writeDebug('stopSound: '+oSound.sID); + soundManager.stop(oSound.sID); + soundManager.unload(oSound.sID); + } + + this.buttonClick = function(e) { + var o = e?(e.target?e.target:e.srcElement):event.srcElement; + self.handleClick({target:self.getParentByClassName(o,'sm2-360ui').nextSibling}); // link next to the nodes we inserted + return false; + } + + this.buttonMouseDown = function(e) { + // user might decide to drag from here + // watch for mouse move + if (!isTouchDevice) { + document.onmousemove = function(e) { + // should be boundary-checked, really (eg. move 3px first?) + self.mouseDown(e); + } + } else { + self.addEventHandler(document,'touchmove',self.mouseDown); + } + self.stopEvent(e); + return false; + } + + this.mouseDown = function(e) { + if (!isTouchDevice && e.button > 1) { + return true; // ignore non-left-click + } + if (!self.lastSound) { + self.stopEvent(e); + return false; + } + var thisSound = self.lastSound; // TODO: In multiple sound case, figure out which sound is involved etc. + // just in case, update coordinates (maybe the element moved since last time.) + self.refreshCoords(thisSound); + var oData = self.lastSound._360data; + self.addClass(oData.oUIBox,'sm2_dragging'); + oData.pauseCount = (self.lastSound.paused?1:0); + // self.lastSound.pause(); + self.mmh(e?e:event); + if (isTouchDevice) { + self.removeEventHandler(document,'touchmove',self.mouseDown); + self.addEventHandler(document,'touchmove',self.mmh); + self.addEventHandler(document,'touchend',self.mouseUp); + } else { + document.onmousemove = self.mmh; + document.onmouseup = self.mouseUp; + } + self.stopEvent(e); + return false; + } + + this.mouseUp = function(e) { + var oData = self.lastSound._360data; + self.removeClass(oData.oUIBox,'sm2_dragging'); + if (oData.pauseCount == 0) { + self.lastSound.resume(); + } + if (!isTouchDevice) { + document.onmousemove = null; + document.onmouseup = null; + } else { + self.removeEventHandler(document,'touchmove',self.mmh); + self.removeEventHandler(document,'touchend',self.mouseUP); + } + } + + var fullCircle = 360; + + this.mmh = function(e) { + if (typeof e == 'undefined') { + var e = event; + } + var oSound = self.lastSound; + var coords = self.getMouseXY(e); + var x = coords[0]; + var y = coords[1]; + var deltaX = x-oSound._360data.canvasMidXY[0]; + var deltaY = y-oSound._360data.canvasMidXY[1]; + var angle = Math.floor(fullCircle-(self.rad2deg(Math.atan2(deltaX,deltaY))+180)); + oSound.setPosition(oSound.durationEstimate*(angle/fullCircle)); + self.stopEvent(e); + return false; + } + + // assignMouseDown(); + + this.drawSolidArc = function(oCanvas, color, radius, width, radians, startAngle, noClear) { + + // thank you, http://www.snipersystems.co.nz/community/polarclock/tutorial.html + + var x = radius; + var y = radius; + + var canvas = oCanvas; + + if (canvas.getContext){ + // use getContext to use the canvas for drawing + var ctx = canvas.getContext('2d'); + } + + // var startAngle = 0; + var oCanvas = ctx; + + if (!noClear) { + self.clearCanvas(canvas); + } + // ctx.restore(); + + if (color) { + ctx.fillStyle = color; + } else { + // ctx.fillStyle = 'black'; + } + + oCanvas.beginPath(); + + if (isNaN(radians)) { + radians = 0; + } + + var innerRadius = radius-width; + var doesntLikeZero = (isOpera || isSafari); // safari 4 doesn't actually seem to mind. + + if (!doesntLikeZero || (doesntLikeZero && radius > 0)) { + oCanvas.arc(0, 0, radius, startAngle, radians, false); + var endPoint = self.getArcEndpointCoords(innerRadius, radians); + oCanvas.lineTo(endPoint.x, endPoint.y); + oCanvas.arc(0, 0, innerRadius, radians, startAngle, true); + oCanvas.closePath(); + oCanvas.fill(); + } + + } + + this.getArcEndpointCoords = function(radius, radians) { + return { + x: radius * Math.cos(radians), + y: radius * Math.sin(radians) + }; + } + + + this.deg2rad = function(nDeg) { + return (nDeg * Math.PI/180); + } + + this.rad2deg = function(nRad) { + return (nRad * 180/Math.PI); + } + + this.getTime = function(nMSec,bAsString) { + // convert milliseconds to mm:ss, return as object literal or string + var nSec = Math.floor(nMSec/1000); + var min = Math.floor(nSec/60); + var sec = nSec-(min*60); + // if (min == 0 && sec == 0) return null; // return 0:00 as null + return (bAsString?(min+':'+(sec<10?'0'+sec:sec)):{'min':min,'sec':sec}); + } + + this.clearCanvas = function(oCanvas) { + var canvas = oCanvas; + var ctx = null; + if (canvas.getContext){ + // use getContext to use the canvas for drawing + ctx = canvas.getContext('2d'); + } + var width = canvas.offsetWidth; + var height = canvas.offsetHeight; + ctx.clearRect(-(width/2), -(height/2), width, height); + } + + var fullCircle = (isOpera||isChrome?359.9:360); // I dunno what Opera doesn't like about this. + + this.updatePlaying = function() { + + if (this.bytesLoaded) { + this._360data.lastValues.bytesLoaded = this.bytesLoaded; + this._360data.lastValues.bytesTotal = this.bytesTotal; + } + + if (this.position) { + this._360data.lastValues.position = this.position; + } + + if (this.durationEstimate) { + this._360data.lastValues.durationEstimate = this.durationEstimate; + } + + self.drawSolidArc(this._360data.oCanvas,self.config.backgroundRingColor,this._360data.width,this._360data.radius,self.deg2rad(fullCircle),false); + + self.drawSolidArc(this._360data.oCanvas,(this._360data.metadata?self.config.loadRingColorMetadata:self.config.loadRingColor),this._360data.width,this._360data.radius,self.deg2rad(fullCircle*(this._360data.lastValues.bytesLoaded/this._360data.lastValues.bytesTotal)),0,true); + + // don't draw if 0 (full black circle in Opera) + if (this._360data.lastValues.position != 0) { + self.drawSolidArc(this._360data.oCanvas,(this._360data.metadata?self.config.playRingColorMetadata:self.config.playRingColor),this._360data.width,this._360data.radius,self.deg2rad((this._360data.didFinish==1?fullCircle:fullCircle*(this._360data.lastValues.position/this._360data.lastValues.durationEstimate))),0,true); + } + + // metadata goes here + if (this._360data.metadata) { + this._360data.metadata.events.whileplaying(); + } + + var timeNow = (self.config.showHMSTime?self.getTime(this.position,true):parseInt(this.position/1000)); + + if (timeNow != this._360data.lastTime) { + this._360data.lastTime = timeNow; + this._360data.oTiming.innerHTML = timeNow; + } + + // draw spectrum, if applicable + if (hasRealCanvas) { // IE <9 can render maybe 3 or 4 FPS when including the wave/EQ, so don't bother. + self.updateWaveform(this); + } + + if (self.config.useFavIcon && self.vuMeter) { + self.vuMeter.updateVU(this); + } + + } + + this.updateWaveform = function(oSound) { + + if ((!self.config.useWaveformData && !self.config.useEQData) || (!sm.features.waveformData && !sm.features.eqData)) { + // feature not enabled.. + return false; + } + + if (!oSound.waveformData.left.length && !oSound.eqData.length && !oSound.peakData.left) { + // no data (or errored out/paused/unavailable?) + return false; + } + + /* use for testing the data */ + /* + for (i=0; i<256; i++) { + oSound.eqData[i] = 1-(i/256); + } + */ + + var oCanvas = oSound._360data.oCanvas.getContext('2d'); + var offX = 0; + var offY = parseInt(self.config.circleDiameter/2); + var scale = offY/2; // Y axis (+/- this distance from 0) + var lineWidth = Math.floor(self.config.circleDiameter-(self.config.circleDiameter*0.175)/(self.config.circleDiameter/255)); // width for each line + lineWidth = 1; + var lineHeight = 1; + var thisY = 0; + var offset = offY; + + if (self.config.useWaveformData) { + // raw waveform + var downSample = self.config.waveformDataDownsample; // only sample X in 256 (greater number = less sample points) + downSample = Math.max(1,downSample); // make sure it's at least 1 + var dataLength = 256; + var sampleCount = (dataLength/downSample); + var startAngle = 0; + var endAngle = 0; + var waveData = null; + var innerRadius = (self.config.waveformDataOutside?1:(self.config.waveformDataConstrain?0.5:0.565)); + var scale = (self.config.waveformDataOutside?0.7:0.75); + var perItemAngle = self.deg2rad((360/sampleCount)*self.config.waveformDataLineRatio); // 0.85 = clean pixel lines at 150? // self.deg2rad(360*(Math.max(1,downSample-1))/sampleCount); + for (var i=0; i16500 Hz), most stuff won't actually use it. + var sampleCount = (eqSamples/downSample); + var innerRadius = (self.config.eqDataOutside?1:0.565); + var direction = (self.config.eqDataOutside?-1:1); + var scale = (self.config.eqDataOutside?0.5:0.75); + var startAngle = 0; + var endAngle = 0; + var perItemAngle = self.deg2rad((360/sampleCount)*self.config.eqDataLineRatio); // self.deg2rad(360/(sampleCount+1)); + var playedAngle = self.deg2rad((oSound._360data.didFinish==1?360:360*(oSound._360data.lastValues.position/oSound._360data.lastValues.durationEstimate))); + var j=0; + var iAvg = 0; + for (var i=0; iplayedAngle?self.config.eqDataColor:self.config.playRingColor),oSound._360data.width*innerRadius,oSound._360data.radius*scale*(oSound.eqData.left[i]*direction),endAngle,startAngle,true); + } + } + + if (self.config.usePeakData) { + if (!oSound._360data.animating) { + var nPeak = (oSound.peakData.left||oSound.peakData.right); + // GIANT HACK: use EQ spectrum data for bass frequencies + var eqSamples = 3; + for (var i=0; i', + ' ', // note use of imageMap, edit or remove if you use a different-size image. + '
', // + Ever-so-slight Safari horizontal alignment tweak + '
' + ]; + } + + this.init = function() { + sm._writeDebug('threeSixtyPlayer.init()'); + var oItems = self.getElementsByClassName('ui360','div'); + var oLinks = []; + + for (var i=0,j=oItems.length; i0) { + self.addEventHandler(document,'click',self.handleClick); + if (self.config.autoPlay) { + self.handleClick({target:self.links[0],preventDefault:function(){}}); + } + } + sm._writeDebug('threeSixtyPlayer.init(): Found '+foundItems+' relevant items.'); + + if (self.config.useFavIcon && typeof this.VUMeter != 'undefined') { + this.vuMeter = new this.VUMeter(this); + } + + } + +} + +// Optional: VU Meter component + +ThreeSixtyPlayer.prototype.VUMeter = function(oParent) { + + var self = oParent; + var me = this; + this.vuMeterData = []; + this.vuDataCanvas = null; + var _head = document.getElementsByTagName('head')[0]; + var isOpera = (navigator.userAgent.match(/opera/i)); + var isFirefox = (navigator.userAgent.match(/firefox/i)); + + this.setPageIcon = function(sDataURL) { + + if (!self.config.useFavIcon || !self.config.usePeakData || !sDataURL) { + return false; + } + + var link = document.getElementById('sm2-favicon'); + if (link) { + _head.removeChild(link); + link = null; + } + if (!link) { + link = document.createElement('link'); + link.id = 'sm2-favicon'; + link.rel = 'shortcut icon'; + link.type = 'image/png'; + link.href = sDataURL; + document.getElementsByTagName('head')[0].appendChild(link); + } + } + + this.resetPageIcon = function() { + if (!self.config.useFavIcon) { + return false; + } + var link = document.getElementById('favicon'); + if (link) { + link.href = '/favicon.ico'; + } + } + + this.updateVU = function(oSound) { + if (soundManager.flashVersion >= 9 && self.config.useFavIcon && self.config.usePeakData) { + me.setPageIcon(me.vuMeterData[parseInt(16*oSound.peakData.left)][parseInt(16*oSound.peakData.right)]); + } + } + + this.createVUData = function() { + var i=0; + var j=0; + var canvas = me.vuDataCanvas.getContext('2d'); + var vuGrad = canvas.createLinearGradient(0, 16, 0, 0); + vuGrad.addColorStop(0,'rgb(0,192,0)'); + vuGrad.addColorStop(0.30,'rgb(0,255,0)'); + vuGrad.addColorStop(0.625,'rgb(255,255,0)'); + vuGrad.addColorStop(0.85,'rgb(255,0,0)'); + var bgGrad = canvas.createLinearGradient(0, 16, 0, 0); + var outline = 'rgba(0,0,0,0.2)'; + bgGrad.addColorStop(0,outline); + bgGrad.addColorStop(1,'rgba(0,0,0,0.5)'); + for (i=0; i<16; i++) { + me.vuMeterData[i] = []; + } + for (var i=0; i<16; i++) { + for (j=0; j<16; j++) { + // reset/erase canvas + me.vuDataCanvas.setAttribute('width',16); + me.vuDataCanvas.setAttribute('height',16); + // draw new stuffs + canvas.fillStyle = bgGrad; + canvas.fillRect(0,0,7,15); + canvas.fillRect(8,0,7,15); + /* + // shadow + canvas.fillStyle = 'rgba(0,0,0,0.1)'; + canvas.fillRect(1,15-i,7,17-(17-i)); + canvas.fillRect(9,15-j,7,17-(17-j)); + */ + canvas.fillStyle = vuGrad; + canvas.fillRect(0,15-i,7,16-(16-i)); + canvas.fillRect(8,15-j,7,16-(16-j)); + // and now, clear out some bits. + canvas.clearRect(0,3,16,1); + canvas.clearRect(0,7,16,1); + canvas.clearRect(0,11,16,1); + me.vuMeterData[i][j] = me.vuDataCanvas.toDataURL('image/png'); + // for debugging VU images + /* + var o = document.createElement('img'); + o.style.marginRight = '5px'; + o.src = vuMeterData[i][j]; + document.documentElement.appendChild(o); + */ + } + } + }; + + this.testCanvas = function() { + // canvas + toDataURL(); + var c = document.createElement('canvas'); + var ctx = null; + if (!c || typeof c.getContext == 'undefined') { + return null; + } + ctx = c.getContext('2d'); + if (!ctx || typeof c.toDataURL != 'function') { + return null; + } + // just in case.. + try { + var ok = c.toDataURL('image/png'); + } catch(e) { + // no canvas or no toDataURL() + return null; + } + // assume we're all good. + return c; + } + + this.init = function() { + if (self.config.useFavIcon) { + me.vuDataCanvas = me.testCanvas(); + if (me.vuDataCanvas && (isFirefox || isOpera)) { + // these browsers support dynamically-updating the favicon + me.createVUData(); + } else { + // browser doesn't support doing this + self.config.useFavIcon = false; + } + } + } + + this.init(); + +} + +// completely optional: Metadata/annotations/segments code + +ThreeSixtyPlayer.prototype.Metadata = function(oSound, oParent) { + soundManager._wD('Metadata()'); + var me = this; + var oBox = oSound._360data.oUI360; + var o = oBox.getElementsByTagName('ul')[0]; + var oItems = o.getElementsByTagName('li'); + var isFirefox = (navigator.userAgent.match(/firefox/i)); + this.lastWPExec = 0; + this.refreshInterval = 250; + + var isAlt = false; + + this.events = { + whileplaying: function() { + var width = oSound._360data.width; + var radius = oSound._360data.radius; + var fullDuration = (oSound.durationEstimate||(me.totalTime*1000)); + var isAlt = null; + for (var i=0,j=me.data.length; ime.refreshInterval) { + me.refresh(); + me.lastWPExec = d; + } + } + } + + this.refresh = function() { + // Display info as appropriate + var index = null; + var now = oSound.position; + var metadata = oSound._360data.metadata.data; + for (var i=0, j=metadata.length; i= metadata[i].startTimeMS && now <= metadata[i].endTimeMS) { + index = i; + break; + } + } + if (index != metadata.currentItem && index < metadata.length) { + // update + oSound._360data.oLink.innerHTML = metadata.mainTitle+' '; + // self.setPageTitle(metadata[index].title+' | '+metadata.mainTitle); + metadata.currentItem = index; + } + } + + this.totalTime = 0; + + this.strToTime = function(sTime) { + var segments = sTime.split(':'); + var seconds = 0; + for (var i=segments.length; i--;) { + seconds += parseInt(segments[i])*Math.pow(60,segments.length-1-i,10); // hours, minutes + } + return seconds; + } + + this.data = []; + this.data.givenDuration = null; + this.data.currentItem = null; + this.data.mainTitle = oSound._360data.oLink.innerHTML; + for (var i=0; i= Math.abs(this.state - this.target)) { + this.state = this.target; + } else { + this.state += movement; + } + + try { + this.propagate(); + } finally { + this.options.onStep.call(this); + if (this.target == this.state) { + window.clearInterval(this.intervalId); + this.intervalId = null; + this.options.onComplete.call(this); + } + } + }, + // shortcuts + play: function() {this.seekFromTo(0, 1)}, + reverse: function() {this.seekFromTo(1, 0)}, + // return a string describing this Animator, for debugging + inspect: function() { + var str = "# 20) return; + } + }, + getStyle: function(state) { + state = this.from + ((this.to - this.from) * state); + if (this.property == 'filter') return "alpha(opacity=" + Math.round(state*100) + ")"; + if (this.property == 'opacity') return state; + return Math.round(state) + this.units; + }, + inspect: function() { + return "\t" + this.property + "(" + this.from + this.units + " to " + this.to + this.units + ")\n"; + } +} + +// animates a colour based style property between two hex values +function ColorStyleSubject(els, property, from, to) { + this.els = Animator.makeArray(els); + this.property = Animator.camelize(property); + this.to = this.expandColor(to); + this.from = this.expandColor(from); + this.origFrom = from; + this.origTo = to; +} + +ColorStyleSubject.prototype = { + // parse "#FFFF00" to [256, 256, 0] + expandColor: function(color) { + var hexColor, red, green, blue; + hexColor = ColorStyleSubject.parseColor(color); + if (hexColor) { + red = parseInt(hexColor.slice(1, 3), 16); + green = parseInt(hexColor.slice(3, 5), 16); + blue = parseInt(hexColor.slice(5, 7), 16); + return [red,green,blue] + } + if (window.DEBUG) { + alert("Invalid colour: '" + color + "'"); + } + }, + getValueForState: function(color, state) { + return Math.round(this.from[color] + ((this.to[color] - this.from[color]) * state)); + }, + setState: function(state) { + var color = '#' + + ColorStyleSubject.toColorPart(this.getValueForState(0, state)) + + ColorStyleSubject.toColorPart(this.getValueForState(1, state)) + + ColorStyleSubject.toColorPart(this.getValueForState(2, state)); + for (var i=0; i 255) number = 255; + var digits = number.toString(16); + if (number < 16) return '0' + digits; + return digits; +} +ColorStyleSubject.parseColor.rgbRe = /^rgb\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i; +ColorStyleSubject.parseColor.hexRe = /^\#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/; + +// Animates discrete styles, i.e. ones that do not scale but have discrete values +// that can't be interpolated +function DiscreteStyleSubject(els, property, from, to, threshold) { + this.els = Animator.makeArray(els); + this.property = Animator.camelize(property); + this.from = from; + this.to = to; + this.threshold = threshold || 0.5; +} + +DiscreteStyleSubject.prototype = { + setState: function(state) { + var j=0; + for (var i=0; i section ? 1 : 0); + } + if (this.options.rememberance) { + document.location.hash = this.rememberanceTexts[section]; + } + } +} diff --git a/js/libs/soundmanager/demo/360-player/script/excanvas.js b/js/libs/soundmanager/demo/360-player/script/excanvas.js new file mode 100644 index 0000000..d748873 --- /dev/null +++ b/js/libs/soundmanager/demo/360-player/script/excanvas.js @@ -0,0 +1,17 @@ +// Excanvas (Explorer Canvas) R43 +// http://excanvas.sourceforge.net/ +// Copyright 2006 Google Inc. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +if(!document.createElement("canvas").getContext){(function(){var u=Math;var v=u.round;var r=u.sin;var C=u.cos;var l=u.abs;var B=u.sqrt;var a=10;var n=a/2;function g(){return this.context_||(this.context_=new p(this))}var t=Array.prototype.slice;function D(j,m,E){var i=t.call(arguments,2);return function(){return j.apply(m,i.concat(t.call(arguments)))}}var h={init:function(i){if(/MSIE/.test(navigator.userAgent)&&!window.opera){var j=i||document;j.createElement("canvas");j.attachEvent("onreadystatechange",D(this.init_,this,j))}},init_:function(F){if(!F.namespaces.g_vml_){F.namespaces.add("g_vml_","urn:schemas-microsoft-com:vml","#default#VML")}if(!F.namespaces.g_o_){F.namespaces.add("g_o_","urn:schemas-microsoft-com:office:office","#default#VML")}if(!F.styleSheets.ex_canvas_){var E=F.createStyleSheet();E.owningElement.id="ex_canvas_";E.cssText="canvas{display:inline-block;overflow:hidden;text-align:left;width:300px;height:150px}g_vml_\\:*{behavior:url(#default#VML)}g_o_\\:*{behavior:url(#default#VML)}"}var m=F.getElementsByTagName("canvas");for(var j=0;j','","");this.element_.insertAdjacentHTML("BeforeEnd",Y.join(""))};k.stroke=function(ae){var J=[];var K=false;var ap=c(ae?this.fillStyle:this.strokeStyle);var aa=ap.color;var ak=ap.alpha*this.globalAlpha;var F=10;var M=10;J.push("V.x){V.x=ai.x}if(ao.y==null||ai.yV.y){V.y=ai.y}}}J.push(' ">');if(!ae){var U=this.lineScale_*this.lineWidth;if(U<1){ak*=U}J.push("')}else{if(typeof this.fillStyle=="object"){var N=this.fillStyle;var S=0;var ah={x:0,y:0};var ab=0;var Q=1;if(N.type_=="gradient"){var P=N.x0_/this.arcScaleX_;var m=N.y0_/this.arcScaleY_;var O=N.x1_/this.arcScaleX_;var aq=N.y1_/this.arcScaleY_;var am=this.getCoords_(P,m);var al=this.getCoords_(O,aq);var I=al.x-am.x;var G=al.y-am.y;S=Math.atan2(I,G)*180/Math.PI;if(S<0){S+=360}if(S<0.000001){S=0}}else{var am=this.getCoords_(N.x0_,N.y0_);var j=V.x-ao.x;var E=V.y-ao.y;ah={x:(am.x-ao.x)/j,y:(am.y-ao.y)/E};j/=this.arcScaleX_*a;E/=this.arcScaleY_*a;var ag=u.max(j,E);ab=2*N.r0_/ag;Q=2*N.r1_/ag-ab}var Z=N.colors_;Z.sort(function(H,i){return H.offset-i.offset});var T=Z.length;var Y=Z[0].color;var X=Z[T-1].color;var ad=Z[0].alpha*this.globalAlpha;var ac=Z[T-1].alpha*this.globalAlpha;var af=[];for(var aj=0;aj')}else{J.push('')}}J.push("");this.element_.insertAdjacentHTML("beforeEnd",J.join(""))};k.fill=function(){this.stroke(true)};k.closePath=function(){this.currentPath_.push({type:"close"})};k.getCoords_=function(E,j){var i=this.m_;return{x:a*(E*i[0][0]+j*i[1][0]+i[2][0])-n,y:a*(E*i[0][1]+j*i[1][1]+i[2][1])-n}};k.save=function(){var i={};w(this,i);this.aStack_.push(i);this.mStack_.push(this.m_);this.m_=d(q(),this.m_)};k.restore=function(){w(this.aStack_.pop(),this);this.m_=this.mStack_.pop()};k.translate=function(m,j){var i=[[1,0,0],[0,1,0],[m,j,1]];this.m_=d(i,this.m_)};k.rotate=function(j){var E=C(j);var m=r(j);var i=[[E,m,0],[-m,E,0],[0,0,1]];this.m_=d(i,this.m_)};k.scale=function(G,F){this.arcScaleX_*=G;this.arcScaleY_*=F;var j=[[G,0,0],[0,F,0],[0,0,1]];var i=this.m_=d(j,this.m_);var E=i[0][0]*i[1][1]-i[0][1]*i[1][0];this.lineScale_=B(l(E))};k.clip=function(){};k.arcTo=function(){};k.createPattern=function(){return new f};function z(i){this.type_=i;this.x0_=0;this.y0_=0;this.r0_=0;this.x1_=0;this.y1_=0;this.r1_=0;this.colors_=[]}z.prototype.addColorStop=function(j,i){i=c(i);this.colors_.push({offset:j,color:i.color,alpha:i.alpha})};function f(){}G_vmlCanvasManager=h;CanvasRenderingContext2D=p;CanvasGradient=z;CanvasPattern=f})()}; \ No newline at end of file diff --git a/js/libs/soundmanager/demo/_image/360ui-screenshot1.png b/js/libs/soundmanager/demo/_image/360ui-screenshot1.png new file mode 100644 index 0000000..8684432 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/360ui-screenshot1.png differ diff --git a/js/libs/soundmanager/demo/_image/360ui-screenshot2.png b/js/libs/soundmanager/demo/_image/360ui-screenshot2.png new file mode 100644 index 0000000..b0700fe Binary files /dev/null and b/js/libs/soundmanager/demo/_image/360ui-screenshot2.png differ diff --git a/js/libs/soundmanager/demo/_image/360ui-screenshot3.png b/js/libs/soundmanager/demo/_image/360ui-screenshot3.png new file mode 100644 index 0000000..8ba6617 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/360ui-screenshot3.png differ diff --git a/js/libs/soundmanager/demo/_image/360ui-screenshot4.png b/js/libs/soundmanager/demo/_image/360ui-screenshot4.png new file mode 100644 index 0000000..ab67cc7 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/360ui-screenshot4.png differ diff --git a/js/libs/soundmanager/demo/_image/8tracks-logo.png b/js/libs/soundmanager/demo/_image/8tracks-logo.png new file mode 100644 index 0000000..e1dbc64 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/8tracks-logo.png differ diff --git a/js/libs/soundmanager/demo/_image/discogs.gif b/js/libs/soundmanager/demo/_image/discogs.gif new file mode 100644 index 0000000..d039d51 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/discogs.gif differ diff --git a/js/libs/soundmanager/demo/_image/flash9-dark.png b/js/libs/soundmanager/demo/_image/flash9-dark.png new file mode 100644 index 0000000..d76a3a1 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/flash9-dark.png differ diff --git a/js/libs/soundmanager/demo/_image/flash9.png b/js/libs/soundmanager/demo/_image/flash9.png new file mode 100644 index 0000000..77da060 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/flash9.png differ diff --git a/js/libs/soundmanager/demo/_image/getsatisfaction-icon.gif b/js/libs/soundmanager/demo/_image/getsatisfaction-icon.gif new file mode 100644 index 0000000..f3762c7 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/getsatisfaction-icon.gif differ diff --git a/js/libs/soundmanager/demo/_image/hue_thumb.png b/js/libs/soundmanager/demo/_image/hue_thumb.png new file mode 100644 index 0000000..413ee98 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/hue_thumb.png differ diff --git a/js/libs/soundmanager/demo/_image/lastfm.png b/js/libs/soundmanager/demo/_image/lastfm.png new file mode 100644 index 0000000..623005a Binary files /dev/null and b/js/libs/soundmanager/demo/_image/lastfm.png differ diff --git a/js/libs/soundmanager/demo/_image/mixcrate.png b/js/libs/soundmanager/demo/_image/mixcrate.png new file mode 100644 index 0000000..7e21115 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/mixcrate.png differ diff --git a/js/libs/soundmanager/demo/_image/muxtape-logo.png b/js/libs/soundmanager/demo/_image/muxtape-logo.png new file mode 100644 index 0000000..a29bfd7 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/muxtape-logo.png differ diff --git a/js/libs/soundmanager/demo/_image/new-bw.png b/js/libs/soundmanager/demo/_image/new-bw.png new file mode 100644 index 0000000..e9dc665 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/new-bw.png differ diff --git a/js/libs/soundmanager/demo/_image/new-dark.png b/js/libs/soundmanager/demo/_image/new-dark.png new file mode 100644 index 0000000..549158d Binary files /dev/null and b/js/libs/soundmanager/demo/_image/new-dark.png differ diff --git a/js/libs/soundmanager/demo/_image/new.png b/js/libs/soundmanager/demo/_image/new.png new file mode 100644 index 0000000..62e05e4 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/new.png differ diff --git a/js/libs/soundmanager/demo/_image/opera.png b/js/libs/soundmanager/demo/_image/opera.png new file mode 100644 index 0000000..9baf845 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/opera.png differ diff --git a/js/libs/soundmanager/demo/_image/picker_thumb.png b/js/libs/soundmanager/demo/_image/picker_thumb.png new file mode 100644 index 0000000..f757cc6 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/picker_thumb.png differ diff --git a/js/libs/soundmanager/demo/_image/slider-1.png b/js/libs/soundmanager/demo/_image/slider-1.png new file mode 100644 index 0000000..b7a5f32 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/slider-1.png differ diff --git a/js/libs/soundmanager/demo/_image/slider-bar.gif b/js/libs/soundmanager/demo/_image/slider-bar.gif new file mode 100644 index 0000000..8e25d0e Binary files /dev/null and b/js/libs/soundmanager/demo/_image/slider-bar.gif differ diff --git a/js/libs/soundmanager/demo/_image/slider.png b/js/libs/soundmanager/demo/_image/slider.png new file mode 100644 index 0000000..abcbf8b Binary files /dev/null and b/js/libs/soundmanager/demo/_image/slider.png differ diff --git a/js/libs/soundmanager/demo/_image/soundcloud-thecloudplayer-logo.png b/js/libs/soundmanager/demo/_image/soundcloud-thecloudplayer-logo.png new file mode 100644 index 0000000..f88af99 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/soundcloud-thecloudplayer-logo.png differ diff --git a/js/libs/soundmanager/demo/_image/speaker.png b/js/libs/soundmanager/demo/_image/speaker.png new file mode 100644 index 0000000..9197793 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/speaker.png differ diff --git a/js/libs/soundmanager/demo/_image/wedge.png b/js/libs/soundmanager/demo/_image/wedge.png new file mode 100644 index 0000000..b55dd08 Binary files /dev/null and b/js/libs/soundmanager/demo/_image/wedge.png differ diff --git a/js/libs/soundmanager/demo/_mp3/1hz-10khz-sweep.mp3 b/js/libs/soundmanager/demo/_mp3/1hz-10khz-sweep.mp3 new file mode 100644 index 0000000..226ac1e Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/1hz-10khz-sweep.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/440hz.mp3 b/js/libs/soundmanager/demo/_mp3/440hz.mp3 new file mode 100644 index 0000000..e2dd5e0 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/440hz.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/880hz.mp3 b/js/libs/soundmanager/demo/_mp3/880hz.mp3 new file mode 100644 index 0000000..756e8d9 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/880hz.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/background0.mp3 b/js/libs/soundmanager/demo/_mp3/background0.mp3 new file mode 100644 index 0000000..3816dd7 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/background0.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/background1.mp3 b/js/libs/soundmanager/demo/_mp3/background1.mp3 new file mode 100644 index 0000000..9e9c638 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/background1.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/background2.mp3 b/js/libs/soundmanager/demo/_mp3/background2.mp3 new file mode 100644 index 0000000..ec251cf Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/background2.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/bass.mp3 b/js/libs/soundmanager/demo/_mp3/bass.mp3 new file mode 100644 index 0000000..adc281f Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/bass.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/button-0.mp3 b/js/libs/soundmanager/demo/_mp3/button-0.mp3 new file mode 100644 index 0000000..243c3e5 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/button-0.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/button-1.mp3 b/js/libs/soundmanager/demo/_mp3/button-1.mp3 new file mode 100644 index 0000000..a2833fd Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/button-1.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/click-high.mp3 b/js/libs/soundmanager/demo/_mp3/click-high.mp3 new file mode 100644 index 0000000..afb09d7 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/click-high.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/click-low.mp3 b/js/libs/soundmanager/demo/_mp3/click-low.mp3 new file mode 100644 index 0000000..9cbe8fe Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/click-low.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/coins.mp3 b/js/libs/soundmanager/demo/_mp3/coins.mp3 new file mode 100644 index 0000000..f0c2401 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/coins.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/fancy-beer-bottle-pop.mp3 b/js/libs/soundmanager/demo/_mp3/fancy-beer-bottle-pop.mp3 new file mode 100644 index 0000000..4498874 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/fancy-beer-bottle-pop.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/going_outside.mp3 b/js/libs/soundmanager/demo/_mp3/going_outside.mp3 new file mode 100644 index 0000000..7555831 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/going_outside.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/mak.mp3 b/js/libs/soundmanager/demo/_mp3/mak.mp3 new file mode 100644 index 0000000..9bc9af3 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/mak.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/mouseover.mp3 b/js/libs/soundmanager/demo/_mp3/mouseover.mp3 new file mode 100644 index 0000000..9e9a4f4 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/mouseover.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/mouseover2.mp3 b/js/libs/soundmanager/demo/_mp3/mouseover2.mp3 new file mode 100644 index 0000000..9273f99 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/mouseover2.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/mouseover3.mp3 b/js/libs/soundmanager/demo/_mp3/mouseover3.mp3 new file mode 100644 index 0000000..93d04be Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/mouseover3.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/office_lobby.mp3 b/js/libs/soundmanager/demo/_mp3/office_lobby.mp3 new file mode 100644 index 0000000..8432fa7 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/office_lobby.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/rain.mp3 b/js/libs/soundmanager/demo/_mp3/rain.mp3 new file mode 100644 index 0000000..86050cb Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/rain.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/select.mp3 b/js/libs/soundmanager/demo/_mp3/select.mp3 new file mode 100644 index 0000000..9f9c711 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/select.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/sine, square, sawtooth, rando.mp3 b/js/libs/soundmanager/demo/_mp3/sine, square, sawtooth, rando.mp3 new file mode 100644 index 0000000..a649164 Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/sine, square, sawtooth, rando.mp3 differ diff --git a/js/libs/soundmanager/demo/_mp3/walking.mp3 b/js/libs/soundmanager/demo/_mp3/walking.mp3 new file mode 100644 index 0000000..45f660e Binary files /dev/null and b/js/libs/soundmanager/demo/_mp3/walking.mp3 differ diff --git a/js/libs/soundmanager/demo/animation-1/css/animation.css b/js/libs/soundmanager/demo/animation-1/css/animation.css new file mode 100644 index 0000000..5da9e5d --- /dev/null +++ b/js/libs/soundmanager/demo/animation-1/css/animation.css @@ -0,0 +1,74 @@ +body { + font-size:75%; +} + +h1, h2, h3 { + font:normal 3em "Helvetica Neue",helvetica,georgia,"times new roman","Arial Rounded MT Bold",verdana,tahoma,arial,"sans serif"; + font-weight:normal; + margin-bottom:0px; +} + +h1, h2 { + letter-spacing:-1px; /* zomg web x.0! ;) */ +} + +h1, h2, h3 { + padding-bottom:1px; + margin-bottom:0.25em; +} + +h1 { + margin-top:0px; + margin-bottom:0px; + background-color:#666; + color:#ccc; + margin-left:-5px; + padding-left:5px; + padding-right:5px; + padding-bottom:5px; +} + +h1, +h1 a { + color:#fff; + text-decoration:none; +} + +h1 a:hover { + text-decoration:underline; +} + +h2 { + font-size:2em; + margin-top:1em; + background-color:#aaa; + color:#fff; + padding:5px; + margin-left:-5px; + min-width:23em; +} + +h3 { + font-size:1.65em; + margin-top:0.5em; + margin-bottom:0.25em; + color:#333; + min-width:28em; +} + +h3 a { + font-size:small; +} + +h4 { + color:#444; +} +p { + font:normal 1em/2em verdana,tahoma,arial,"sans serif"; +} + +.balls img { + position:absolute; + width:12px; + height:12px; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/animation-1/image/ball.gif b/js/libs/soundmanager/demo/animation-1/image/ball.gif new file mode 100644 index 0000000..0f13534 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-1/image/ball.gif differ diff --git a/js/libs/soundmanager/demo/animation-1/index.html b/js/libs/soundmanager/demo/animation-1/index.html new file mode 100644 index 0000000..d3cb72d --- /dev/null +++ b/js/libs/soundmanager/demo/animation-1/index.html @@ -0,0 +1,46 @@ + + + + + + + + + + +
+ +

Interval-based animation (with sound)

+ +

+ Click + drag for fun. +

+ +

Speeding Up ExternalInterface: Keep .swf in view

+ +

SoundManager 2 now incorporates a "high performance" mode, which has been shown to noticeably improve timing and frequency of flash callbacks. This is important for timing, reducing delay between a JS call and the sound being played, etc.

+ +

To reduce audio delay and timing issues from slow JS/Flash communication, SM2 will try to ensure that the flash movie is visible on screen at all times. If hidden or otherwise off-screen, Flash will be given lower priority and thus JS/flash "lag" (ie., delay) will be introduced when trying to play audio "in sync."

+ +

Generally, positioning the flash movie using position:fixed and bottom/left or bottom/right 0px is the less-intrusive option.

+ +

+ Throw from mouse +

+

+ + +

+ + +

Sound source: "Acclivity", Free Sound Project

+ +
+ +
+ +
+ + + diff --git a/js/libs/soundmanager/demo/animation-1/script/animation.js b/js/libs/soundmanager/demo/animation-1/script/animation.js new file mode 100644 index 0000000..f167761 --- /dev/null +++ b/js/libs/soundmanager/demo/animation-1/script/animation.js @@ -0,0 +1,189 @@ +var balls = []; +var canvasX = 0; +var canvasY = 0; +var timer = null; +var m_lastX = 0; +var m_lastY = 0; +var M_SPACE = 24; +var B_VMIN = 5; +var B_VMAX = 5; +var B_WIDTH = 13; +var B_HEIGHT = 13; +var useMouse = null; +var ballSound = null; +var ballPopSound = null; + +function rnd(n) { + return Math.random()*n; +} + +function rndI(n) { + return parseInt(rnd(n)); +} + +function createBall(oParent) { + oParent.appendChild(balls[0].cloneNode(true)); + initBall(balls[balls.length-1],balls.length); +} + +function createBallAtMouse(e) { + e = e?e:event; + createBall(document.getElementById('ball-container')); + with (balls[balls.length-1]) { + _x = e.clientX; + _y = e.clientY; + if (useMouse.checked != false) { + _vX = (m_lastX-e.clientX)*-0.7; + _vY = (m_lastY-e.clientY)*-0.7; + } else { + _vX = 0; + _vY = 0; + } + } + moveBall(balls[balls.length-1]); +} + +function initBall(oBall,i) { + oBall._id = 'ball'+i; + oBall._active = true; + oBall._x = rnd(canvasX); + oBall._y = rnd(canvasY); + oBall._vX = B_VMIN+rnd(B_VMAX)*(Math.random()>0.5?1:-1); + oBall._vY = B_VMIN+rnd(B_VMAX); + oBall.style.display = 'block'; +} + +function moveBall(oBall) { + oBall._x += oBall._vX; + oBall._y += (oBall._vY++); // gravity! + var bounce = false; + if ((oBall._vX>0 && oBall._x+oBall._vX+B_WIDTH>canvasX) || (oBall._vX<0 && oBall._x+oBall._vX<0)) { + oBall._vX *= -1; + bounce = true; + } + if ((oBall._vY>0 && oBall._y+oBall._vY+B_HEIGHT>canvasY) || (oBall._vY<0 && oBall._y+oBall._vY<0)) { + // bounce on Y axis - with resistance on both axes + if (oBall._vY>0) oBall._y = canvasY-B_HEIGHT; // bounce exactly from bottom + oBall._vY *= -(oBall._vY>1?0.6:1); + bounce = true; + if (Math.abs(oBall._vX)>0.5) { + oBall._vX *= 0.85; + } else { + oBall._vX = 0; + } + if (Math.abs(oBall._vY)<=3 && Math.abs(oBall._vX==0)) { + oBall._active = false; + bounce = false; + ballPopSound.play(); + oBall.style.display = 'none'; + } + } + oBall.style.left = oBall._x+'px'; + oBall.style.top = oBall._y+'px'; + if (bounce) ballSound.play({pan:getPan(oBall._x,canvasX)}); +} + +function getPan(x,canvasX) { + var pos = x/canvasX; + var pan = null; + if (pos<=0.4) { + pan = Math.floor(-100+(pos/0.4*100)); + } else if (pos>0.4 && pos<=0.5) { + pan = 0; + } else { + pan = Math.floor(pos*100); + } + return pan; +} + +function animateStuff() { + for (var i=balls.length; i--;) { + if (balls[i]._active) moveBall(balls[i]); + } +} + +function startAnimation() { + if (!timer) timer = setInterval(animateStuff,20); + document.getElementById('b-start').disabled = true; + document.getElementById('b-stop').disabled = false; +} + +function stopAnimation() { + if (!timer) return false; + clearInterval(timer); + timer = null; + document.getElementById('b-start').disabled = false; + document.getElementById('b-stop').disabled = true; +} + +function mouseDown(e) { + e = e?e:event; + m_lastX = e.clientX; + m_lastY = e.clientY; + document.onmousemove = mouseMove; + document.onmouseup = mouseUp; + return false; +} + +function mouseMove(e) { + e = e?e:event; + if (Math.abs(e.clientX-m_lastX)>M_SPACE || Math.abs(e.clientY-m_lastY)>M_SPACE) { + createBallAtMouse(e); + m_lastX = e.clientX; + m_lastY = e.clientY; + } + return false; +} + +function mouseUp() { + document.onmousemove = null; + document.onmouseup = null; +} + +function init() { + ballSound = soundManager.createSound({ + id: 'ballSound', + url: '../animation/audio/fingerplop.mp3', + volume: 50, + multiShot: true, + autoLoad: true + }); + ballPopSound = soundManager.createSound({ + id: 'ballPopSound', + url: '../animation/audio/fingerplop2.mp3', + volume: 50, + multiShot: true, + autoLoad: true + }); + balls = document.getElementById('ball-container').getElementsByTagName('img'); + for (var i=balls.length; i--;) { + initBall(balls[i],i); + } + useMouse = document.getElementById('useMouse'); + useMouse.checked = true; + getWindowCoords(); + startAnimation(); + document.onmousedown = mouseDown; +} + +// I know this is kinda broken in Opera. +getWindowCoords = (navigator.userAgent.toLowerCase().indexOf('opera')>0||navigator.appVersion.toLowerCase().indexOf('safari')!=-1)?function() { + canvasX = window.innerWidth; + canvasY = window.innerHeight; +}:function() { + canvasX = document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth; + canvasY = document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight; +} + +window.onresize = getWindowCoords; + +soundManager.flashVersion = 9; +soundManager.url = '../../swf/'; +soundManager.useHighPerformance = true; +soundManager.debugMode = false; // disable debug mode +soundManager.defaultOptions.multiShot = true; + +soundManager.onload = function() { + // soundManager is ready to use (create sounds and so on) + init(); +} diff --git a/js/libs/soundmanager/demo/animation-2a/bg-land.png b/js/libs/soundmanager/demo/animation-2a/bg-land.png new file mode 100644 index 0000000..e87b2d7 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/bg-land.png differ diff --git a/js/libs/soundmanager/demo/animation-2a/bg-sky.png b/js/libs/soundmanager/demo/animation-2a/bg-sky.png new file mode 100644 index 0000000..f05abde Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/bg-sky.png differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-10.cur b/js/libs/soundmanager/demo/animation-2a/cursor-10.cur new file mode 100644 index 0000000..1f78e9e Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-10.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-11.cur b/js/libs/soundmanager/demo/animation-2a/cursor-11.cur new file mode 100644 index 0000000..c559d34 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-11.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-3.cur b/js/libs/soundmanager/demo/animation-2a/cursor-3.cur new file mode 100644 index 0000000..5864f78 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-3.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-4.cur b/js/libs/soundmanager/demo/animation-2a/cursor-4.cur new file mode 100644 index 0000000..668fba6 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-4.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-5.cur b/js/libs/soundmanager/demo/animation-2a/cursor-5.cur new file mode 100644 index 0000000..54de2c9 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-5.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-6.cur b/js/libs/soundmanager/demo/animation-2a/cursor-6.cur new file mode 100644 index 0000000..d6c536f Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-6.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-7.cur b/js/libs/soundmanager/demo/animation-2a/cursor-7.cur new file mode 100644 index 0000000..779af62 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-7.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-8.cur b/js/libs/soundmanager/demo/animation-2a/cursor-8.cur new file mode 100644 index 0000000..07c406e Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-8.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-9.cur b/js/libs/soundmanager/demo/animation-2a/cursor-9.cur new file mode 100644 index 0000000..98bf364 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-9.cur differ diff --git a/js/libs/soundmanager/demo/animation-2a/cursor-shadow.png b/js/libs/soundmanager/demo/animation-2a/cursor-shadow.png new file mode 100644 index 0000000..f200f35 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/cursor-shadow.png differ diff --git a/js/libs/soundmanager/demo/animation-2a/dot.png b/js/libs/soundmanager/demo/animation-2a/dot.png new file mode 100644 index 0000000..8d5592b Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2a/dot.png differ diff --git a/js/libs/soundmanager/demo/animation-2a/index.html b/js/libs/soundmanager/demo/animation-2a/index.html new file mode 100644 index 0000000..65cbfce --- /dev/null +++ b/js/libs/soundmanager/demo/animation-2a/index.html @@ -0,0 +1,360 @@ + + +SoundManager Demo + + + + + + + + +
+ +
+ +
+
+
+
+
+ +
+
+ + +
+ +
+

SoundManager 2: JS/DOM + Sound Demo

+

Heavy DOM manipulation + Javascript Sound (see code for experimental ideas)

+
+ +

Click and drag to draw.. Noisily.

+
+ +
+ + + diff --git a/js/libs/soundmanager/demo/animation-2b/audio/bonk.mp3 b/js/libs/soundmanager/demo/animation-2b/audio/bonk.mp3 new file mode 100644 index 0000000..2bce046 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2b/audio/bonk.mp3 differ diff --git a/js/libs/soundmanager/demo/animation-2b/audio/fingerplop.mp3 b/js/libs/soundmanager/demo/animation-2b/audio/fingerplop.mp3 new file mode 100644 index 0000000..663155e Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2b/audio/fingerplop.mp3 differ diff --git a/js/libs/soundmanager/demo/animation-2b/audio/fingerplop2.mp3 b/js/libs/soundmanager/demo/animation-2b/audio/fingerplop2.mp3 new file mode 100644 index 0000000..10f8bb2 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2b/audio/fingerplop2.mp3 differ diff --git a/js/libs/soundmanager/demo/animation-2b/css/animation.css b/js/libs/soundmanager/demo/animation-2b/css/animation.css new file mode 100644 index 0000000..4eea63d --- /dev/null +++ b/js/libs/soundmanager/demo/animation-2b/css/animation.css @@ -0,0 +1,36 @@ +body { + font-size:75%; + background:#667788; + color:#fff; + text-shadow:0 0 0 #fff; /* Safari nonsense */ +} + +h1, h2, h3 { + font:normal 3em "Helvetica Neue",georgia,"times new roman","Arial Rounded MT Bold",helvetica,verdana,tahoma,arial,"sans serif"; + font-weight:normal; + margin-bottom:0px; +} + + +h1 { + margin-top:0px; +} + +h1, h2 { + letter-spacing:-1px; /* zomg web x.0! ;) */ +} + +h2 { + font-size:2em; + margin-top:0.25em; +} + +p { + font:normal 1em verdana,tahoma,arial,"sans serif"; +} + +.point { + position:absolute; + width:32px; + height:32px; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/animation-2b/image/ball.gif b/js/libs/soundmanager/demo/animation-2b/image/ball.gif new file mode 100644 index 0000000..0f13534 Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2b/image/ball.gif differ diff --git a/js/libs/soundmanager/demo/animation-2b/image/point.png b/js/libs/soundmanager/demo/animation-2b/image/point.png new file mode 100644 index 0000000..043a88f Binary files /dev/null and b/js/libs/soundmanager/demo/animation-2b/image/point.png differ diff --git a/js/libs/soundmanager/demo/animation-2b/index.html b/js/libs/soundmanager/demo/animation-2b/index.html new file mode 100644 index 0000000..578eb04 --- /dev/null +++ b/js/libs/soundmanager/demo/animation-2b/index.html @@ -0,0 +1,21 @@ + + + + + + + + + +
+ +

SoundManager 2 demo: A Noisy Page

+

Example of sound tied to javascript/DOM event handlers

+ +

Click and drag for fun.

+ +
+ + + diff --git a/js/libs/soundmanager/demo/animation-2b/script/animation.js b/js/libs/soundmanager/demo/animation-2b/script/animation.js new file mode 100644 index 0000000..61d2382 --- /dev/null +++ b/js/libs/soundmanager/demo/animation-2b/script/animation.js @@ -0,0 +1,94 @@ +soundManager.flashVersion = 9; +soundManager.url = '../../swf/'; +soundManager.useHighPerformance = true; +soundManager.wmode = 'transparent'; +soundManager.debugMode = false; + +var points = []; +var o = null; +var lastX = 0; +var lastY = 0; +var threshhold = 4; +var threshMax = 32; +var noise = null; +var screenX = 0; + +function doPaint(e) { + var x = (e||event).clientX; + var y = (e||event).clientY; + var diff = Math.max(Math.abs(x-lastX),Math.abs(y-lastY)); + if (diff>threshhold) { + lastX = x; + lastY = y; + points.push(new Point(x,y,Math.min(diff/(32),3))); + } + return false; +} + +function stopPaint() { + document.onmousemove = null; + document.onmouseup = null; + // soundManager.play('up'); +} + +function startPaint(e) { + // soundManager.play('down'); + document.onmousemove = doPaint; + document.onmouseup = stopPaint; + lastX = (e||event).clientX; + lastY = (e||event).clientY; + screenX = (window.innerWidth?window.innerWidth:document.documentElement.clientWidth||document.body.clientWidth); + e?e.stopPropagation():event.returnValue = false; + return false; +} + +function initPoints() { + o = document.createElement('img'); + o.src = 'image/point.png'; + o.className = 'point'; + document.onmousedown = startPaint; + document.onmouseup = stopPaint; +} + +function Point(x,y,scale) { + var self = this; + this.data = { + x: x, + y: y, + scale: scale, + scalePX: parseInt(32*scale) + } + this.o = o.cloneNode(false); + this.o.style.left = (x-(this.data.scalePX/2))+'px'; + this.o.style.top = (y-(this.data.scalePX/2))+'px'; + this.o.style.width = this.o.style.height = this.data.scalePX+'px'; + var screenX2 = parseInt(screenX/2); + noise.play({volume:parseInt(Math.min(1,scale/3)*100),pan:(x + + +SoundManager 2: Animation + Sound Demos + + + + + +
+ +

Javascript Animation + Sound Demos using SoundManager 2

+ +
    +
  1. Interval-based animation (with sound)
  2. +
  3. Smashable Christmas Lights
  4. +
  5. JS-DOM "painting" + Sound, V1
  6. +
  7. JS-DOM "painting" + Sound, V2
  8. +
+ +

External demo: A Noisy DOM - part of a Yahoo! User Interface blog post, Enhancing YUI-based Apps with Audio.

+ + + +
diff --git a/js/libs/soundmanager/demo/api/index.html b/js/libs/soundmanager/demo/api/index.html new file mode 100644 index 0000000..3c7ebab --- /dev/null +++ b/js/libs/soundmanager/demo/api/index.html @@ -0,0 +1,667 @@ + + + +SoundManager 2: Basic API Demo, Examples + + + + + + + + + + + + + + + + +
+ +

SoundManager 2 / API Demo and Code Examples

+ +

You can run the API demos with HTML5 enabled, Flash 8 (API default), Flash 9 (normal) or Flash 9 + highPerformance + fastPolling modes (higher JS callback frequency).

+ +

Wondering where to start? This page has inline executable code examples using the SoundManager 2 API.

+ +

If you're wondering "How to include SM2 in my page?", the basic template will get you started.

+ +
+ +
+ +

The basics (old-skool style): onload() + onerror()

+ +

Once you have SM2 included in your page, you merely need to hook into its onload()/onerror() events:

+ +
soundManager.onload = function() {
+  // soundManager is ready to use.
+  // createSound() / play() etc. can now be called
+}
+soundManager.onerror = function() {
+  // Oh no! No sound support.
+  // Maybe configure your app to ignore sound calls.
+  // (SM2 calls will silently return false after this point.)
+}
+
+ +

The modern method: Adding "onready" listeners

+ +

You can register listeners by passing a function to onready(), and it will be called when SoundManager has finished starting up:

+ +
soundManager.onready(function() {
+    // createSound() / play() etc. can now be called
+});
+
+ +

You may also listen for a startup timeout, a form of failure (eg., Flash was required, but was blocked from loading etc.):

+ +
soundManager.ontimeout(function() {
+    // uh-oh, SM2 failed to start - error, unsupported etc.
+});
+
+ +

SoundManager first processes the onready or ontimeout queue in the order items were added, and then fires soundManager.onload() or onerror(). If you call onready() after SM2 has loaded, your callback will be fired immediately.

+ +

A note about initialization

+ +

Keep in mind SoundManager's core methods (createSound, etc.) will not be available until soundManager.onload() fires. The initialization time for SM2 can vary across browsers/platforms, and should effectively be assumed to be "asynchronous." Because of this, it is recommended you write your code to handle soundManager.onload() being called either before or after window.onload().

+

If you wish to have SM2 always wait for window.onload() before calling soundManager.onload()/onerror(), you can apply the following:

+
soundManager.waitForWindowLoad = true;
+ +

Debug Output, disabling and minified versions

+

SoundManager 2 has debug mode enabled by default and will write to agents supporting console.log-style debugging, and/or a custom <div> element in the absence of a console.

+

To disable debug output, set soundManager.debugMode = false;

+

Alternately, you may use the no-debug, minified version of the SM2 javascript library (which has internal debug code removed, and will silently return false.)

+ +

Demo 1a: Create + play (simple method)

+
soundManager.play('mySound0','../mpc/audio/AMB_SN_5.mp3');
+ +

Creates and plays a sound with ID "mySound0", at the specified URL. The sound can then be referenced by that ID later, eg. soundManager.play('mySound0');

+

Note that this method is only provided for convenience, and allows only ID and URL as parameters. If you want to specify other options (volume, loop, event handlers), you must use the object literal syntax as given below.

+ +

Demo 1b: Create + play (better method)

+ +
soundManager.createSound({
+ id:'mySound1',
+ url:'../mpc/audio/CHINA_1.mp3'
+});
+soundManager.play('mySound1');
+ +

Creates, then plays a sound. This object literal method allows for other parameters to be used (see demo 2)

+ +

Variant: Use object returned from createSound() (best method)

+ +
var aSoundObject = soundManager.createSound({
+ id:'mySound2',
+ url:'../mpc/audio/CHINA_1.mp3'
+});
+aSoundObject.play();
+ +

Creates, then plays a sound. This object literal method allows for other parameters to be used (see demo 2)

+ +

Demo 2: Create with onfinish event handler + play with volume argument

+
var demo2Sound = soundManager.createSound({
+ id:'mySound4',
+ url:'../mpc/audio/CHINA_1.mp3',
+ onfinish:function() {
+   soundManager._writeDebug(this.sID+' finished playing');
+ }
+});
+demo2Sound.play({volume:50});
+
+ +

(creates, then plays a new sound - a function is called when the sound finishes playing)

+ +

Demo 3: Play a pre-existing sound

+
soundManager.play('aDrumSound');
+ +

This plays an existing sound which was created by soundManager.onload() (for reference, view source of this page.)

+ +

Demo 4a: Play a sequence of sounds via "onfinish", with multiShot*

+
soundManager.play('aDrumSound',{multiShotEvents:true,onfinish:function(){soundManager.play('aCymbalSound');}})
+

Differently formatted:

+
soundManager.play('aDrumSound',{
+  multiShotEvents: true, // allow onfinish() to fire for each "shot" (default: only fire onfinish() for last shot.)
+  onfinish:function() {
+    soundManager.play('aCymbalSound');
+  }
+});
+ +

This will play an existing sound (created in-page), and uses the "onfinish" handler to make a call to play a second, pre-existing sound.

+

Also note that the button can be clicked multiple times, and the sound will be "layered" as multiShot is enabled for both of these sounds when using Flash 9. An onfinish event will also fire as each sound finishes.

+

Bug/behaviour note: Whenever "play" is called on a SMSound object, any parameters passed in will apply to all currently-playing instances of the sound if multiShot is allowed. For example, the onfinish handler from demo 4a will apply to demo 3 if 4a is started while 3 is still playing.

+

* Multishot is Flash 9+ only.

+ +

Demo 4b: Create and play a sequence of new sounds via "onfinish"

+
soundManager.createSound({
+ id:'aBassDrum',
+ url:'../mpc/audio/AMB_BD_1.mp3',
+ multiShot:false,
+ onfinish:function() {
+   soundManager.play('aRimSound','AMB_RIM1.mp3');
+ }
+});
+soundManager.play('aRimSound');
+ +

This will crate and play a new sound, using the "onfinish" handler to create and play a second, new sound.

+

It is recommended to create sound objects first, to simplify troubleshooting.

+ +

Demo 4c: Looping a sound (conventional, onfinish()-based)

+
var s = soundManager.createSound({
+  id:'hhCymbal',
+  url:'../mpc/audio/AMB_HHOP.mp3'
+});
+
+s.play({
+  onfinish: function() {
+    this.play();
+    // or, soundManager.play('hhCymbal');
+  }
+});
+
+ + | +

Note that there are issues with seamlessly-looping sounds, it is "close, but not perfect" with Flash 8/9 at this point.

+ +

Demo 4d: Looping a sound ("loops" parameter method)

+
var s = soundManager.createSound({
+  id:'hhCymbal',
+  url:'../mpc/audio/AMB_HHOP.mp3'
+});
+
+s.play({
+  loops: 3
+});
+
+ + | +

Looping is possible as shown above using Flash 9. With flash 8, the sound must be preloaded before looping can begin - eg. autoLoad: true, onload: function() { this.play{loops:3} }. For tighter looping, see See Seamless Looping MP3 in Flash for further details.

+ + +

Demo 4e: Sound timing notifications using onposition()

+
var s = soundManager.getSoundById('aCymbalSound'); // existing sound object
+
+// register some listeners (only do this once, they will work for subsequent plays)
+
+if (typeof addedListeners === 'undefined') {
+  addedListeners = true;
+
+  s.onposition(500, function(eventPosition) { // fire at 0.5 seconds
+    soundManager._writeDebug('Sound '+this.sID+' has reached position '+eventPosition);
+  });
+
+  s.onposition(1000, function(eventPosition) {// fire at 1 second
+    soundManager._writeDebug('Sound '+this.sID+' has reached position '+eventPosition);
+  });
+}
+
+s.play({
+  whileplaying:function() {
+    // demo only: show sound position while playing, for context
+    soundManager._writeDebug('position = ' + this.position);
+  }
+});
+
+ + +

onposition() allows you to add an event listener for a given time (in miliseconds, watching the position property); the event fires when that time has been reached while a sound is playing.

+

Note that for multiShot cases, the listeners will only fire for the original (first) shot because its position is the only one that is tracked within Flash.

+ +

Demo 5a: Set sound parameters, then play

+
var sound = soundManager.getSoundById('chinaCymbal'); // predefined/preloaded sound
+sound.setPosition(500); // 500 msec into sound
+sound.setPan(-75);      // 75% left pan
+sound.play();
+
+ | +

This will set the position of an existing, pre-loaded sound, then play it.

+ +

Variant: play()

+
var sound = soundManager.getSoundById('chinaCymbal');
+sound.play({position:500,pan:-75});
+
+ | +

Note that if planning to layer sounds with multiShot (Flash 9 only), this variant method will give best results as each new "channel" is started with parameters.

+ +

Demo 5b: Global sound muting

+

If not passed a sound ID, soundManager.mute() will mute all existing and newly-created sounds. soundManager.unmute() can also be passed a sound ID, and performs the inverse either on a single sound or all sounds.

+

In this demo, all sounds are globally muted and unmuted a few times. Different parameters are used to help audibly separate the sounds.

+
soundManager.mute(); // mute all sounds
+
+soundManager.createSound({
+ id: '880hz',
+ url: '../_mp3/880hz.mp3',
+ autoLoad:true,
+ onload: function() {
+   // soundManager.mute(); // mute all sounds
+   // play (muted) cymbal sound..
+   this.play({
+     volume:75, // volume for when un-muted
+     pan:-75,   // mostly on left channel 
+     // .. and clean-up afterwards
+     onfinish:function() {
+       this.destruct();
+     }
+   });
+
+   this.setVolume(25); // new volume for when un-muted..
+
+   soundManager.play('s440hz',{
+     pan:75,
+     onfinish:function() {
+       document.getElementById('btn-d5b').disabled = false;
+     }
+   });
+
+   // once playing, toggle all sounds some more
+   setTimeout(soundManager.unmute,500);
+   setTimeout(soundManager.mute,1000);
+   setTimeout(soundManager.unmute,1500);
+   setTimeout(soundManager.mute,2000);
+   setTimeout(soundManager.unmute,2500);
+ }
+});
+ + + +

Demo 5c: Per-object sound muting

+
soundManager.createSound({
+ id: '880hz',
+ url: '../_mp3/880hz.mp3',
+ autoLoad:true,
+ onload: function() {
+   soundManager.mute('880hz'); // mute this - alternately, this.mute() would work here
+   soundManager.play('s440hz',{ // play another sound to demo muting
+    onfinish: function() {
+      document.getElementById('btn-d5c').disabled = false;
+    }
+   });
+
+   // play 880hz (muted)..
+   this.play({
+     volume:75,
+     // .. and clean-up afterwards
+     onfinish:function() {
+       this.destruct();
+     }
+   });
+
+   this.setVolume(50); // still muted, however..
+
+   // mute/unmute china cymbal some more
+   // mute sound calls: soundManager.mute('880hz'), or soundManager.getSoundById('880hz').mute();
+   setTimeout(this.unmute,250);
+   setTimeout(this.mute,500);
+   setTimeout(this.unmute,750);
+   setTimeout(this.mute,1000);
+   setTimeout(this.unmute,1250);
+ }
+});
+ + + +

Demo 6: Create, play, unload and destroy a sound

+
var foo = soundManager.createSound({
+ id: 'fooSound',
+ url: '../mpc/audio/AMB_BD_1.mp3'
+});
+
+// soundManager.play('fooSound');
+
+// (Some time later on...)
+// soundManager.unload('fooSound'); - release the loaded MP3
+// soundManager.destroySound('fooSound'); - destroy the sound, freeing up memory etc. Also calls unload().
+
+// Alternate (demo) approach, call methods directly on sound object itself:
+foo.play({
+ onfinish:function() {
+   // once sound has loaded and played, unload and destroy it.
+   this.destruct(); // will also try to unload before destroying.
+ }
+});
+ + + +

Demo 7: Create, manually pre-load and finally play a sound

+
var preload = soundManager.createSound({
+ id: 'preloadSound',
+ url: '../mpc/audio/AMB_HHOP.mp3'
+});
+
+preload.load(); // load the sound ahead of time
+setTimeout(preload.play,1500); // and start playing it 1.5 seconds from now
+
+ + +

Demo 8: Create and play an invalid sound (404)

+
var bad = soundManager.createSound({
+  id:'badSound',
+  url:'badurl.mp3',
+  onload: function(bSuccess) {
+    soundManager._writeDebug('sound '+(bSuccess?'loaded!':'did NOT load.'));
+  }
+});
+bad.play();
+
+ + +

Demo 9: Create and destroy a sound at once (unusual crash testcase)

+
var s = soundManager.createSound({
+  id:'testcase',
+  url:'../mpc/audio/AMB_HHOP.mp3'
+});
+s.play();
+s.destruct();
+
+ + +

Demo 10: Sound timing (position accuracy testcase)

+

The Flash 9 version seems to resume the sound 1 msec earlier than it should, perhaps related to the timing/delay issue most noticeable on Windows.

+
var count = 0;
+var pos = -1;
+var s = soundManager.createSound({
+  id: 's',
+  url: '../mpc/audio/CHINA_1.mp3',
+  whileplaying: function() {
+    if (count == 0) {
+      if (this.position > 1000) {
+        this.pause();
+        pos = this.position;
+        count++;
+        this.resume();
+      }
+    } else if (count == 1) {
+      soundManager._writeDebug('old position: ' + pos);
+      soundManager._writeDebug('new position: ' + this.position);
+      // See that this.position is less than pos!
+      count++;
+    }
+  },
+  onfinish: function() {
+    this.destruct();
+  }
+});
+s.play();
+ + +

Demo 11: Inline whileplaying() event assignment

+

Note that when using the Flash 9 version of SM2 with Flash 9 and 10 plugins, flash/OS-related delay conditions may result in the position property being less than the duration property, even by the end of the sound.

+
var foo = soundManager.createSound({
+  id: 'bar',
+  url: '../mpc/audio/CRASH_1.mp3'
+});
+foo.options.whileplaying = function() {
+  soundManager._writeDebug('whileplaying(): '+this.position+' / '+this.duration);
+}
+foo.play();
+
+// note: assign .options before calling .play(), as that "bakes" the options into a play instance object.
+// the below "late" event handler assignment will have no effect on the already-playing instance.
+foo.options.onfinish = function() { soundManager._writeDebug(this.sID+' stopped.'); }
+
+ + +

Demo 12: 48 KHz MP3 sampling rate playback issue workaround

+

To work around a known "chipmunk" sampling rate issue with 48 KHz MP3s in Flash, one can apparently load a sound using Flash 9 with stream = false, and then call play() once the sound has fully-loaded. Exactly why this works is not known.

+
var fortyeight = soundManager.createSound({
+  id: 's-48khz',
+  url: 'http://freshly-ground.com/data/audio/48khz-test.mp3'
+});
+
+if (!fortyeight.loaded) {
+  // first time loading/playing
+  fortyeight.load({
+    stream: false,
+    onload: function() {
+      // sound has fully-loaded
+      this.play();
+    }
+  });
+} else {
+  // sound has already loaded
+  fortyeight.play();
+}
+
+ + +

Demo 13: onbeforefinish() testcase

+

This event fires when the sound's position property is equal to or less than onbeforefinishtime msec from the end of the sound, as defined by duration. If unspecified, a default value is used (eg. 5000 msec.)

+
var d13 = soundManager.createSound({
+  id: 'demo13',
+  url: '../mpc/audio/CRASH_1.mp3',
+  onbeforefinish: function() {
+    soundManager._writeDebug(this.sID+'.onbeforefinish(): '+this.position+' of '+this.duration);
+  },
+  onbeforefinishtime: 1000
+});
+d13.play();
+
+ + +

Demo 14: autoLoad:true + play() testcase

+

Bug testcase (Flash 8 version-specific): creating a sound with autoLoad:true and immediately calling play() does not work.

+
var autoLoadTest = soundManager.createSound({
+   id: 'autoLoadTest',
+   url: getRandomMP3URL(),
+   onload: function() {
+	soundManager._writeDebug(this.sID+' loaded.');
+   },
+   onplay: function() {
+     soundManager._writeDebug('Starting sound: '+this.sID);
+   },
+   autoPlay: false,
+   autoLoad: true,
+   stream: true
+  });
+  // autoLoadTest.play(); // sound will not start
+  setTimeout(autoLoadTest.play,1000); // may work with a delay?
+
+

Under Flash 8, this case does not work as expected. Even with the delay, the sound does not begin playing as soon as expected - sometimes it fires after the sound loads, in fact. For this reason, avoid using autoLoad:true if you intend to play the sound shortly after creating it when using Flash 8.

+ + +

Demo 15: autoPlay + onfinish() testcase

+

Bug testcase (Flash 8 version-specific): onfinish() does not fire with autoPlay:true

+
var sound = soundManager.createSound({
+ id: 'demo15',
+ url: '../mpc/audio/AMB_SN13.mp3',
+ onfinish: function() {
+  soundManager._writeDebug(this.sID+' finished (now destroying)');
+  // destroy this sound
+  this.destruct();
+ },
+ autoPlay: true,
+ multiShot: false
+});
+
+ + +

Demo 16: onstop() -> unload() testcase

+

Bug testcase: unload() from onstop() does not work

+
var sound16 = soundManager.createSound({
+ id: 'demo16',
+ url: getRandomMP3URL(),
+ onstop: function() {
+  soundManager.unload(this.sID);
+ },
+ onload: function() {
+   soundManager._writeDebug('loaded');
+ }
+});
+sound16.play();
+setTimeout(sound16.stop,1500);
+
+ + +

Demo 17: Buffering event handler/property example (Flash 9 only)

+

Reporting the isBuffering property of a SMSound object

+
if (soundManager.flashVersion != 8) {
+  var sound17 = soundManager.createSound({
+    id: 'demo17',
+    url: getRandomMP3URL(),
+    onbufferchange: function() {
+      soundManager._writeDebug('Buffering '+(this.isBuffering?'started':'stopped')+'.');
+    },
+    onload: function() {
+      soundManager._writeDebug(this.sID+' loaded.');
+    }
+  });
+  sound17.play();
+}
+
+ + + + + +
+ + + diff --git a/js/libs/soundmanager/demo/christmas-lights/christmaslights-home.js b/js/libs/soundmanager/demo/christmas-lights/christmaslights-home.js new file mode 100644 index 0000000..2ebc4fa --- /dev/null +++ b/js/libs/soundmanager/demo/christmas-lights/christmaslights-home.js @@ -0,0 +1,510 @@ +// Christmas Light Smashfest +// Adapted from XLSF 2007 as originally used on http://schillmania.com/?theme=2007&christmas=1 + +var Y = { + // shortcuts + A: YAHOO.util.Anim, + D: YAHOO.util.Dom, + E: YAHOO.util.Event, + UE: YAHOO.util.Easing, + CA: YAHOO.util.ColorAnim, + BG: YAHOO.util.BgPosAnim +} + +function XLSF(oTarget,urlBase,lightClass) { + var writeDebug = soundManager._wD; + writeDebug('XLSF()'); + var IS_MOON_COMPUTER = false; + var isIE = navigator.userAgent.match(/msie/i); + var self = this; + var xlsf = self; + var animDuration = 1; + this.oFrag = document.createDocumentFragment(); + this.oTarget = (oTarget?oTarget:document.documentElement); + this.oExplosionBox = document.createElement('div'); + this.oExplosionBox.className = 'xlsf-fragment-box'; + this.oExplosionFrag = document.createElement('div'); + this.oExplosionFrag.className = 'xlsf-fragment'; + this.lights = []; + this.lightClasses = { + pico: 32, + tiny: 50, + small: 64, + medium: 72, + large: 96 + } + this.urlBase = (typeof urlBase == 'undefined' || !urlBase?'demo/christmas-lights/':urlBase); + + if (window.innerWidth || window.innerHeight) { + var screenX = window.innerWidth; // -(!isIE?24:2); + var screenY = window.innerHeight; + } else { + var screenX = (document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth); // -(!isIE?8:0); + var screenY = (document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight); + } + + this.lightClass = (screenX>1280?'small':'pico'); // kind of light to show (32px to 96px square) + + if (typeof lightClass != 'undefined') { + // hack: override + this.lightClass = lightClass; + } + + if (window.location.href.match(/size=/i)) { + this.lightClass = window.location.href.substr(window.location.href.indexOf('size=')+5); + } + + this.lightXY = this.lightClasses[this.lightClass]; // shortcut to w/h + + this.lightGroups = { + left: [], + top: [], + right: [], + bottom: [] + } + this.lightSmashCounter = 0; + this.lightIndex = 0; + this.lightInterval = 250; + this.timer = null; + this.bgBaseX = 0; + this.bgBaseY = 0; + this.soundIDs = 0; + this.soundPan = { + panValue: 75, + left: 0, + mid: 481, + right: 962 + } + + this.cover = document.createElement('div'); + this.cover.className = 'xlsf-cover'; + document.documentElement.appendChild(this.cover); + + this.initSounds = function() { + for (var i=0; i<6; i++) { + soundManager.createSound({ + id: 'smash'+i, + url: xlsf.urlBase+'sound/glass'+i+'.mp3', + autoLoad: true, + multiShot: true, + volume:50 + }); + } + self.initSounds = function() {} // safety net + } + + this.appendLights = function() { + writeDebug('xlsf.appendLights()'); + self.oTarget.appendChild(self.oFrag); + self.oFrag = document.createDocumentFragment(); + } + + function ExplosionFragment(nType,sClass,x,y,vX,vY) { + var self = this; + this.o = xlsf.oExplosionFrag.cloneNode(true); + this.nType = nType; + this.sClass = sClass; + this.x = x; + this.y = y; + this.w = 50; + this.h = 50; + this.bgBaseX = 0; + this.bgBaseY = this.h*this.nType; + this.vX = vX*(1.5+Math.random()); + this.vY = vY*(1.5+Math.random()); + this.oA = null; + this.oA2 = null; + this.burstPhase = 3; // starting background offset point + this.burstPhases = 4; // 1+offset (ignore large size) + this.o.style.backgroundPosition = ((this.w*-this.burstPhase)+'px '+(this.h*-nType)+'px'); + + // boundary checks + if (self.sClass == 'left') { + this.vX = Math.abs(this.vX); + } else if (self.sClass == 'right') { + this.vX = Math.abs(this.vX)*-1; + } + + this.burstTween = function() { + // determine frame to show + var phase = 1+Math.floor((this.currentFrame/this.totalFrames)*self.burstPhases); + if (phase != self.burstPhase) { + self.burstPhase = phase; + self.o.style.backgroundPosition = ((self.w*-self.burstPhase)+'px '+(self.h*-nType)+'px'); + } + } + + this.burst = function() { + self.oA = new Y.A(self.o,{marginLeft:{to:(self.vX*8)},marginTop:{to:(self.vY*8)}},animDuration,Y.UE.easeOutStrong); + self.oA.onTween.subscribe(self.burstTween); + // self.oA.onComplete.subscribe(self.hide); + self.oA.animate(); + } + + this.hide = function() { + if (!isIE) self.o.style.opacity = 0; + } + + this.reset = function() { + self.o.style.left = '0px'; + self.o.style.top = '0px'; + self.o.style.marginLeft = '0px'; + self.o.style.marginTop = '0px'; + if (!isIE) self.o.style.opacity = 1; + } + + this.animate = function() { + self.reset(); + self.burst(); + } + + } + + function Explosion(nType,sClass,x,y) { + var oParent = this; + var self = this; + this.o = null; + this.nType = nType; + this.sClass = sClass; + this.x = x; + this.y = y; + this.boxVX = 0; + this.boxVY = 0; + this.o = xlsf.oExplosionBox.cloneNode(true); + this.o.style.left = x+'px'; + this.o.style.top = y+'px'; + // this.oFrag = document.createDocumentFragment(); + this.fragments = []; + + var mX = x; + var mY = y; + + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,-5,-5)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,0,-5)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,5,-5)); + + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,-5,0)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,0,0)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,5,0)); + + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,5,-5)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,5,0)); + this.fragments.push(new ExplosionFragment(nType,sClass,mX,mY,5,5)); + + this.init = function() { + for (var i=self.fragments.length; i--;) { + self.o.appendChild(self.fragments[i].o); + } + // xlsf.oTarget.appendChild(self.o); + // self.oFrag = document.createDocumentFragment(); + if (!IS_MOON_COMPUTER) { + // faster rendering, particles get cropped + xlsf.oFrag.appendChild(self.o); + } else { + // slower rendering, can overlay body + // _id('header').appendChild(self.o); + // (document.documentElement?document.documentElement:document.body).appendChild(o); + xlsf.oFrag.appendChild(self.o); + } + } + + this.reset = function() { + // clean-up + // self.o.parentNode.removeChild(self.o); + self.o.style.display = 'none'; + self.o.style.marginLeft = '0px'; + self.o.style.marginTop = '0px'; + self.o.style.left = self.x+'px'; + self.o.style.top = self.y+'px'; + if (!isIE) self.o.style.opacity = 1; + for (var i=self.fragments.length; i--;) { + self.fragments[i].reset(); + } + } + + this.trigger = function(boxVX,boxVY) { + self.o.style.display = 'block'; + self.boxVX = boxVX; + self.boxVY = boxVY; + // boundary checks + if (self.sClass == 'right') { + self.boxVX = Math.abs(self.boxVX)*-1; + } else if (self.sClass == 'left') { + self.boxVX = Math.abs(self.boxVX); + } + for (var i=self.fragments.length; i--;) { + self.fragments[i].animate(); + } + if (!isIE && (IS_MOON_COMPUTER)) { + var oAExplode = new Y.A(self.o,{marginLeft:{to:100*self.boxVX},marginTop:{to:150*self.boxVY},opacity:{to:0.01}},animDuration,Y.UE.easeInStrong); + } else { + // even IE 7 sucks w/alpha-transparent PNG + CSS opacity. Boo urns. + var oAExplode = new Y.A(self.o,{marginLeft:{to:100*self.boxVX},marginTop:{to:150*self.boxVY}},animDuration,Y.UE.easeInStrong); + } + oAExplode.onComplete.subscribe(self.reset); + oAExplode.animate(); + // setTimeout(self.reset,animDuration*1000*1.5); + } + + this.init(); + + // this.trigger(); // boooom! + + } + + function Light(sSizeClass,sClass,nType,x,y) { + var self = this; + this.o = document.createElement('div'); + this.sClass = sClass; + this.sSizeClass = sSizeClass; + this.nType = (nType||0); + this.useY = (sClass == 'left' || sClass == 'right'); + this.state = null; + this.broken = 0; + this.w = xlsf.lightClasses[sSizeClass]; + this.h = xlsf.lightClasses[sSizeClass]; + this.x = x; + this.y = y; + this.bg = xlsf.urlBase+'image/bulbs-'+this.w+'x'+this.h+'-'+this.sClass+'.png'; + this.o.style.width = this.w+'px'; + this.o.style.height = this.h+'px'; + this.o.style.background = 'url('+this.bg+') no-repeat 0px 0px'; + this.bgBaseX = (self.useY?-self.w*this.nType:0); + this.bgBaseY = (!self.useY?-self.h*this.nType:0); + this.glassType = parseInt(Math.random()*6); + this.oExplosion = null; + this.soundID = 'smash'+this.glassType; + var panValue = xlsf.soundPan.panValue; // eg. +/- 80% + this.pan = parseInt(this.x<=xlsf.soundPan.mid?-panValue+((this.x/xlsf.soundPan.mid)*panValue):(this.x-xlsf.soundPan.mid)/(xlsf.soundPan.right-xlsf.soundPan.mid)*panValue); + + this.initSound = function() { + } + + this.setBGPos = function(x,y) { + self.o.style.backgroundPosition = ((self.bgBaseX+x)+'px '+(self.bgBaseY+y)+'px'); + } + + this.setLight = function(bOn) { + if (self.broken || self.state == bOn) return false; + if (!self.w || !self.h) self.getDimensions(); + self.state = bOn; + if (self.useY) { + self.setBGPos(0,-this.h*(bOn?0:1)); + } else { + self.setBGPos(-this.w*(bOn?0:1),0); + } + } + + this.getDimensions = function() { + self.w = self.o.offsetWidth; + self.h = self.o.offsetHeight; + self.bgBaseX = (self.useY?-self.w*self.nType:0); + self.bgBaseY = (!self.useY?-self.h*self.nType:0); + } + + this.on = function() { + self.setLight(1); + } + + this.off = function() { + self.setLight(0); + } + + this.flickr = function() { + self.setLight(Math.random()>=0.5?1:0); + } + + this.toggle = function() { + self.setLight(!self.state?1:0); + } + + this.explode = function(e) { + // self.oExplosion = new Explosion(self.nType,self.sClass,self.x,self.y); + self.oExplosion.trigger(0,1); // boooom! + } + + this.smash = function(e) { + if (self.broken) return false; + self.broken = true; + if (soundManager && soundManager.supported()) { + soundManager.play(self.soundID,{pan:self.pan}); + // soundManager.sounds[self.soundID].play({pan:self.pan}); + // if (self.bonusSound != null) window.setTimeout(self.smashBonus,1000); + } + self.explode(e); + var rndFrame = 2; // +parseInt(Math.random()*3); + if (self.useY) { + self.setBGPos(0,self.h*-rndFrame); + } else { + self.setBGPos(self.w*-rndFrame,0); + } + xlsf.lightSmashCounter++; + } + + this.smashBonus = function() { + // soundManager.play(self.bonusSounds[self.bonusSound],urlBase+'sound/'+self.bonusSounds[self.bonusSound]+'.mp3'); + } + + this.reset = function() { + if (!self.broken) return false; + self.broken = false; + self.state = null; + xlsf.lightSmashCounter--; + self.flickr(); + } + + this.init = function() { + self.o.className = 'xlsf-light '+this.sizeClass+' '+this.sClass; + self.o.style.left = self.x+'px'; + self.o.style.top = self.y+'px'; + self.o.style.width = self.w+'px'; + self.o.style.height = self.h+'px'; + self.o.onmouseover = self.smash; + self.o.onclick = self.smash; + self.flickr(); + xlsf.oFrag.appendChild(self.o); + self.oExplosion = new Explosion(self.nType,self.sClass,self.x,self.y); + } + + this.init(); + + } // Light() + + this.createLight = function(sClass,nType,x,y) { + var oLight = new Light(self.lightClass,sClass,nType,x,y); + self.lightGroups[sClass].push(oLight); + self.lights.push(oLight); + return oLight; + } + + this.rotateLights = function() { + self.lights[self.lightIndex==self.lights.length?self.lights.length-1:self.lightIndex].off(); + self.lightIndex++; + if (self.lightIndex == self.lights.length) { + self.lightIndex = 0; + } + self.lights[self.lightIndex].on(); + } + + this.randomLights = function() { + self.lights[parseInt(Math.random()*self.lights.length)].toggle(); + } + + + this.destroyLights = function() { + self.startSequence(self.destroyLight,20); + } + + this.destroyLight = function() { + var groupSize = 2; // # to smash at a time + if (self.lightSmashCounter + var offset = parseInt(document.getElementsByTagName('h1')[0].offsetWidth)+16; + + var jMax = Math.floor((screenX-offset-16)/self.lightXY); + var iMax = Math.floor((screenY-offset-16)/self.lightXY); + + for (j=0; j=0.5?1:0); + } + + this.toggle = function() { + self.setLight(!self.state?1:0); + } + + this.explode = function(e) { + self.oExplosion.trigger(0,1); // boooom! + } + + this.smash = function(e) { + if (self.broken) return false; + self.broken = true; + if (soundManager && soundManager.supported()) { + soundManager.play(self.soundID,{pan:self.pan}); + // soundManager.sounds[self.soundID].play({pan:self.pan}); + // if (self.bonusSound != null) window.setTimeout(self.smashBonus,1000); + } + self.explode(e); + var rndFrame = 2; // +parseInt(Math.random()*3); + if (self.useY) { + self.setBGPos(0,self.h*-rndFrame); + } else { + self.setBGPos(self.w*-rndFrame,0); + } + if (!useFollow && !useAngle && transforms.prop) { + self.o.style[transforms.prop] = 'rotate('+Math.random()*plusMinus(20)+'deg)'; + } + xlsf.lightSmashCounter++; + for (var i=activeLights.length; i--;) { + // find this in the active array, and take it out + if (activeLights[i] === self) { + activeLights.splice(i,1); + break; + } + } + // xlsf.doNukeCheck(); + // window.setTimeout(self.reset,3000); // respawn + } + + this.smashBonus = function() { + // soundManager.play(self.bonusSounds[self.bonusSound],urlBase+'sound/'+self.bonusSounds[self.bonusSound]+'.mp3'); + } + + this.reset = function() { + if (!self.broken) return false; + self.broken = false; + self.state = null; + xlsf.lightSmashCounter--; + // self.oExplosion.reset(); // may not be necessary + self.flickr(); + } + + this.init = function() { + self.o.className = classBase+' '+this.sizeClass+' '+this.sClass; + self.o.style.left = self.x+'px'; + self.o.style.top = self.y+'px'; + self.o.style.width = self.w+'px'; + self.o.style.height = self.h+'px'; + self.flickr(); + xlsf.oFrag.appendChild(self.o); + self.oExplosion = new Explosion(self.nType,self.sClass,self.x,self.y); + } + + this.init(); + + } // Light() + + this.createLight = function(sClass,nType,x,y,row,col) { + var oLight = new Light(self.lightClass,sClass,nType,x,y,row,col); + activeLights.push(oLight); + self.lightGroups[sClass].push(oLight); + self.lights.push(oLight); + return oLight; + } + + this.rotateLights = function() { + self.lights[self.lightIndex==self.lights.length?self.lights.length-1:self.lightIndex].off(); + self.lightIndex++; + if (self.lightIndex == self.lights.length) { + self.lightIndex = 0; + } + self.lights[self.lightIndex].on(); + } + + this.randomLights = function() { + self.lights[parseInt(Math.random()*self.lights.length)].toggle(); + } + + this.destroyLights = function() { + // reset counter + self.lightSmashCounter = 0; + self.startSequence(Math.random()>0.75?self.destroyLight:self.destroyRandom,33); + } + + this.destroyRandom = function() { + for (var i=2; i--;) { + if (activeLights.length) { + activeLights[parseInt(Math.random()*activeLights.length)].smash(); + } + } + } + + this.destroyLight = function() { + var groupSize = 2; // # to smash at a time + if (self.lightSmashCounter2) bsCounter = 0; // hack - loop through sounds + } +*/ + + this.appendLights(); + + function followMouseMove(e) { + if (!self.lights.length) { + return false; + } + var x = lastMouseX; + var y = lastMouseY; + var x2 = null; + var y2 = null; + var angle = 0; + var light = null; + for (var i=self.lights.length; i--;) { + light = self.lights[i]; + if (light && !light.broken) { + x2 = light.x; + y2 = light.y; + angle = Math.atan2((y-y2),(x-x2))*(180/Math.PI); + if (light.col%2 === 0) { + angle += (270*180/Math.PI); + } + if (transforms.prop) { + light.o.style[transforms.prop] = 'rotate('+angle+'deg)'; + } + } + } + mmhTimer = null; + } + + function mouseOrTouchMove(e) { + // coordinate -> row/col check, smashy smash + var x, y, lightIndex; + if (e.targetTouches) { + if (e.targetTouches.length === 1) { + x = e.targetTouches[0].clientX; + y = e.targetTouches[0].clientY; + } + } else { + x = e.clientX; + y = e.clientY; + } + lightCol = Math.floor((x/(self.lightClasses[self.lightClass]*jMax)*jMax)), + lightRow = Math.floor((y/(self.lightClasses[self.lightClass]*iMax)*iMax)) + lightIndex = (jMax*lightRow)+lightCol; + if (self.lights[lightIndex]) { + self.lights[lightIndex].smash(); + } + if (useFollow) { + lastMouseX = x; + lastMouseY = y; + if (!mmhTimer) { + mmhTimer = window.setTimeout(followMouseMove, 33); // try to be nice and throttle this call, which may be expensive + } + } + } + + if (isTouchDevice && self.oTarget !== document.documentElement) { + self.oTarget.addEventListener('touchstart', function(e) { + self.oTarget.addEventListener('touchmove', mouseOrTouchMove, false); + self.oTarget.addEventListener('touchend', function(e) { + self.oTarget.removeEventListener('touchMove', mouseOrTouchMove); + }); + mouseOrTouchMove(e); // initial touch might be a smashy one, too + e.preventDefault(); + return false; + }, false); + } else { + if (document.addEventListener) { + document.addEventListener('mousemove', mouseOrTouchMove, false); + } else if (document.attachEvent) { + document.attachEvent('onmousemove', mouseOrTouchMove); + } + } + + this.startSequence(self.randomLights); + +} // --- XLSF2007() + +var xlsf = null; + +function smashInit() { + xlsf = new XLSF(document.getElementById('lights')); + xlsf.initSounds(); + document.getElementById('loading').style.display = 'none'; +} + +soundManager.url = '../../swf/'; +soundManager.flashVersion = 9; +soundManager.useHighPerformance = true; +soundManager.wmode = 'transparent'; +soundManager.debugMode = false; + +// start in either case +soundManager.onready(smashInit); +soundManager.ontimeout(smashInit); \ No newline at end of file diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bg-strip-dark.png b/js/libs/soundmanager/demo/christmas-lights/image/bg-strip-dark.png new file mode 100644 index 0000000..80e07d9 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bg-strip-dark.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/blank.png b/js/libs/soundmanager/demo/christmas-lights/image/blank.png new file mode 100644 index 0000000..85af9fd Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/blank.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-bottom.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-bottom.png new file mode 100644 index 0000000..7246c01 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-bottom.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-left.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-left.png new file mode 100644 index 0000000..1cf077f Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-left.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-right.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-right.png new file mode 100644 index 0000000..8e68ec1 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-right.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-top.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-top.png new file mode 100644 index 0000000..0156c25 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-32x32-top.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-bottom.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-bottom.png new file mode 100644 index 0000000..79d3b07 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-bottom.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-fragments.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-fragments.png new file mode 100644 index 0000000..f963a89 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-fragments.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-left.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-left.png new file mode 100644 index 0000000..6aa0965 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-left.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-right.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-right.png new file mode 100644 index 0000000..c095739 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-right.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-top.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-top.png new file mode 100644 index 0000000..780fe75 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50-top.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50.png new file mode 100644 index 0000000..eb31135 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-50x50.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-bottom.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-bottom.png new file mode 100644 index 0000000..49341a1 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-bottom.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-left.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-left.png new file mode 100644 index 0000000..cb581e4 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-left.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-right.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-right.png new file mode 100644 index 0000000..fdd54ee Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-right.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-top.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-top.png new file mode 100644 index 0000000..09b098b Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-64x64-top.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-bottom.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-bottom.png new file mode 100644 index 0000000..4e5cae3 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-bottom.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-left.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-left.png new file mode 100644 index 0000000..c8bfa43 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-left.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-right.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-right.png new file mode 100644 index 0000000..20a614b Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-right.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-top.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-top.png new file mode 100644 index 0000000..76fd676 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-72x72-top.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-bottom.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-bottom.png new file mode 100644 index 0000000..3506236 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-bottom.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-left.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-left.png new file mode 100644 index 0000000..6f727e5 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-left.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-right.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-right.png new file mode 100644 index 0000000..f4456d6 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-right.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-top.png b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-top.png new file mode 100644 index 0000000..5c2ba64 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/image/bulbs-96x96-top.png differ diff --git a/js/libs/soundmanager/demo/christmas-lights/index.html b/js/libs/soundmanager/demo/christmas-lights/index.html new file mode 100644 index 0000000..d8748ef --- /dev/null +++ b/js/libs/soundmanager/demo/christmas-lights/index.html @@ -0,0 +1,41 @@ + + +Smashable Christmas Lights + + + + + + + + + +
+ +
+

Christmas Light Smashfest 2008: Prototype

+

Rendering...

+
+ +
+ +
+ +
+ +
+ + + +
+ a goofy SoundManager 2 experiment. +
+ +
+ + + + + diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass0.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass0.mp3 new file mode 100644 index 0000000..c161c69 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass0.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass1.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass1.mp3 new file mode 100644 index 0000000..8d7d6b5 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass1.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass2.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass2.mp3 new file mode 100644 index 0000000..ef5f556 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass2.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass3.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass3.mp3 new file mode 100644 index 0000000..be7886e Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass3.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass4.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass4.mp3 new file mode 100644 index 0000000..0f328f6 Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass4.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/sound/glass5.mp3 b/js/libs/soundmanager/demo/christmas-lights/sound/glass5.mp3 new file mode 100644 index 0000000..b54513e Binary files /dev/null and b/js/libs/soundmanager/demo/christmas-lights/sound/glass5.mp3 differ diff --git a/js/libs/soundmanager/demo/christmas-lights/yahoo-dom-event-animation-260.js b/js/libs/soundmanager/demo/christmas-lights/yahoo-dom-event-animation-260.js new file mode 100644 index 0000000..c38fd9f --- /dev/null +++ b/js/libs/soundmanager/demo/christmas-lights/yahoo-dom-event-animation-260.js @@ -0,0 +1,35 @@ +/* +Copyright (c) 2008, Yahoo! Inc. All rights reserved. +Code licensed under the BSD License: +http://developer.yahoo.net/yui/license.txt +version: 2.6.0 +*/ +if(typeof YAHOO=="undefined"||!YAHOO){var YAHOO={};}YAHOO.namespace=function(){var A=arguments,E=null,C,B,D;for(C=0;C0)?A.dump(D[F],I-1):L);}else{K.push(D[F]);}K.push(J);}if(K.length>1){K.pop();}K.push("]");}else{K.push("{");for(F in D){if(A.hasOwnProperty(D,F)){K.push(F+G);if(A.isObject(D[F])){K.push((I>0)?A.dump(D[F],I-1):L);}else{K.push(D[F]);}K.push(J);}}if(K.length>1){K.pop();}K.push("}");}return K.join("");},substitute:function(S,E,L){var I,H,G,O,P,R,N=[],F,J="dump",M=" ",D="{",Q="}";for(;;){I=S.lastIndexOf(D);if(I<0){break;}H=S.indexOf(Q,I);if(I+1>=H){break;}F=S.substring(I+1,H);O=F;R=null;G=O.indexOf(M);if(G>-1){R=O.substring(G+1);O=O.substring(0,G);}P=E[O];if(L){P=L(O,P,R);}if(A.isObject(P)){if(A.isArray(P)){P=A.dump(P,parseInt(R,10));}else{R=R||"";var K=R.indexOf(J);if(K>-1){R=R.substring(4);}if(P.toString===Object.prototype.toString||K>-1){P=A.dump(P,parseInt(R,10));}else{P=P.toString();}}}else{if(!A.isString(P)&&!A.isNumber(P)){P="~-"+N.length+"-~";N[N.length]=F;}}S=S.substring(0,I)+P+S.substring(H+1);}for(I=N.length-1;I>=0;I=I-1){S=S.replace(new RegExp("~-"+I+"-~"),"{"+N[I]+"}","g");}return S;},trim:function(D){try{return D.replace(/^\s+|\s+$/g,"");}catch(E){return D;}},merge:function(){var G={},E=arguments;for(var F=0,D=E.length;F=this.left&&A.right<=this.right&&A.top>=this.top&&A.bottom<=this.bottom);};YAHOO.util.Region.prototype.getArea=function(){return((this.bottom-this.top)*(this.right-this.left));};YAHOO.util.Region.prototype.intersect=function(E){var C=Math.max(this.top,E.top);var D=Math.min(this.right,E.right);var A=Math.min(this.bottom,E.bottom);var B=Math.max(this.left,E.left);if(A>=C&&D>=B){return new YAHOO.util.Region(C,D,A,B);}else{return null;}};YAHOO.util.Region.prototype.union=function(E){var C=Math.min(this.top,E.top);var D=Math.max(this.right,E.right);var A=Math.max(this.bottom,E.bottom);var B=Math.min(this.left,E.left);return new YAHOO.util.Region(C,D,A,B);};YAHOO.util.Region.prototype.toString=function(){return("Region {"+"top: "+this.top+", right: "+this.right+", bottom: "+this.bottom+", left: "+this.left+"}");};YAHOO.util.Region.getRegion=function(D){var F=YAHOO.util.Dom.getXY(D);var C=F[1];var E=F[0]+D.offsetWidth;var A=F[1]+D.offsetHeight;var B=F[0];return new YAHOO.util.Region(C,E,A,B);};YAHOO.util.Point=function(A,B){if(YAHOO.lang.isArray(A)){B=A[1];A=A[0];}this.x=this.right=this.left=this[0]=A;this.y=this.top=this.bottom=this[1]=B;};YAHOO.util.Point.prototype=new YAHOO.util.Region();YAHOO.register("dom",YAHOO.util.Dom,{version:"2.6.0",build:"1321"});YAHOO.util.CustomEvent=function(D,B,C,A){this.type=D;this.scope=B||window;this.silent=C;this.signature=A||YAHOO.util.CustomEvent.LIST;this.subscribers=[];if(!this.silent){}var E="_YUICEOnSubscribe";if(D!==E){this.subscribeEvent=new YAHOO.util.CustomEvent(E,this,true);}this.lastError=null;};YAHOO.util.CustomEvent.LIST=0;YAHOO.util.CustomEvent.FLAT=1;YAHOO.util.CustomEvent.prototype={subscribe:function(B,C,A){if(!B){throw new Error("Invalid callback for subscriber to '"+this.type+"'");}if(this.subscribeEvent){this.subscribeEvent.fire(B,C,A);}this.subscribers.push(new YAHOO.util.Subscriber(B,C,A));},unsubscribe:function(D,F){if(!D){return this.unsubscribeAll();}var E=false;for(var B=0,A=this.subscribers.length;B0){B=I[0];}try{G=M.fn.call(L,B,M.obj);}catch(F){this.lastError=F;if(A){throw F;}}}else{try{G=M.fn.call(L,this.type,I,M.obj);}catch(H){this.lastError=H;if(A){throw H;}}}if(false===G){if(!this.silent){}break;}}}return(G!==false);},unsubscribeAll:function(){for(var A=this.subscribers.length-1;A>-1;A--){this._delete(A);}this.subscribers=[];return A;},_delete:function(A){var B=this.subscribers[A];if(B){delete B.fn;delete B.obj;}this.subscribers.splice(A,1);},toString:function(){return"CustomEvent: "+"'"+this.type+"', "+"scope: "+this.scope;}};YAHOO.util.Subscriber=function(B,C,A){this.fn=B;this.obj=YAHOO.lang.isUndefined(C)?null:C;this.override=A;};YAHOO.util.Subscriber.prototype.getScope=function(A){if(this.override){if(this.override===true){return this.obj;}else{return this.override;}}return A;};YAHOO.util.Subscriber.prototype.contains=function(A,B){if(B){return(this.fn==A&&this.obj==B);}else{return(this.fn==A);}};YAHOO.util.Subscriber.prototype.toString=function(){return"Subscriber { obj: "+this.obj+", override: "+(this.override||"no")+" }";};if(!YAHOO.util.Event){YAHOO.util.Event=function(){var H=false;var I=[];var J=[];var G=[];var E=[];var C=0;var F=[];var B=[];var A=0;var D={63232:38,63233:40,63234:37,63235:39,63276:33,63277:34,25:9};var K=YAHOO.env.ua.ie?"focusin":"focus";var L=YAHOO.env.ua.ie?"focusout":"blur";return{POLL_RETRYS:2000,POLL_INTERVAL:20,EL:0,TYPE:1,FN:2,WFN:3,UNLOAD_OBJ:3,ADJ_SCOPE:4,OBJ:5,OVERRIDE:6,CAPTURE:7,lastError:null,isSafari:YAHOO.env.ua.webkit,webkit:YAHOO.env.ua.webkit,isIE:YAHOO.env.ua.ie,_interval:null,_dri:null,DOMReady:false,throwErrors:false,startInterval:function(){if(!this._interval){var M=this;var N=function(){M._tryPreloadAttach();};this._interval=setInterval(N,this.POLL_INTERVAL);}},onAvailable:function(R,O,S,Q,P){var M=(YAHOO.lang.isString(R))?[R]:R;for(var N=0;N-1;Q--){W=(this._removeListener(N[Q],M,V,Y)&&W);}return W;}}if(!V||!V.call){return this.purgeElement(N,false,M);}if("unload"==M){for(Q=J.length-1;Q>-1;Q--){X=J[Q];if(X&&X[0]==N&&X[1]==M&&X[2]==V){J.splice(Q,1);return true;}}return false;}var R=null;var S=arguments[4];if("undefined"===typeof S){S=this._getCacheIndex(N,M,V);}if(S>=0){R=I[S];}if(!N||!R){return false;}if(this.useLegacyEvent(N,M)){var P=this.getLegacyIndex(N,M);var O=E[P];if(O){for(Q=0,T=O.length;Q0&&F.length>0);}var R=[];var T=function(V,W){var U=V;if(W.override){if(W.override===true){U=W.obj;}else{U=W.override;}}W.fn.call(U,W.obj);};var N,M,Q,P,O=[];for(N=0,M=F.length;N-1;N--){Q=F[N];if(!Q||!Q.id){F.splice(N,1);}}this.startInterval();}else{clearInterval(this._interval);this._interval=null;}this.locked=false;},purgeElement:function(Q,R,T){var O=(YAHOO.lang.isString(Q))?this.getEl(Q):Q;var S=this.getListeners(O,T),P,M;if(S){for(P=S.length-1;P>-1;P--){var N=S[P];this._removeListener(O,N.type,N.fn,N.capture);}}if(R&&O&&O.childNodes){for(P=0,M=O.childNodes.length;P-1;O--){N=I[O];if(N){M._removeListener(N[M.EL],N[M.TYPE],N[M.FN],N[M.CAPTURE],O);}}N=null;}G=null;M._simpleRemove(window,"unload",M._unload);},_getScrollLeft:function(){return this._getScroll()[1];},_getScrollTop:function(){return this._getScroll()[0];},_getScroll:function(){var M=document.documentElement,N=document.body;if(M&&(M.scrollTop||M.scrollLeft)){return[M.scrollTop,M.scrollLeft];}else{if(N){return[N.scrollTop,N.scrollLeft];}else{return[0,0];}}},regCE:function(){},_simpleAdd:function(){if(window.addEventListener){return function(O,P,N,M){O.addEventListener(P,N,(M));};}else{if(window.attachEvent){return function(O,P,N,M){O.attachEvent("on"+P,N);};}else{return function(){};}}}(),_simpleRemove:function(){if(window.removeEventListener){return function(O,P,N,M){O.removeEventListener(P,N,(M));};}else{if(window.detachEvent){return function(N,O,M){N.detachEvent("on"+O,M);};}else{return function(){};}}}()};}();(function(){var EU=YAHOO.util.Event;EU.on=EU.addListener;EU.onFocus=EU.addFocusListener;EU.onBlur=EU.addBlurListener; +/* DOMReady: based on work by: Dean Edwards/John Resig/Matthias Miller */ +if(EU.isIE){YAHOO.util.Event.onDOMReady(YAHOO.util.Event._tryPreloadAttach,YAHOO.util.Event,true);var n=document.createElement("p");EU._dri=setInterval(function(){try{n.doScroll("left");clearInterval(EU._dri);EU._dri=null;EU._ready();n=null;}catch(ex){}},EU.POLL_INTERVAL);}else{if(EU.webkit&&EU.webkit<525){EU._dri=setInterval(function(){var rs=document.readyState;if("loaded"==rs||"complete"==rs){clearInterval(EU._dri);EU._dri=null;EU._ready();}},EU.POLL_INTERVAL);}else{EU._simpleAdd(document,"DOMContentLoaded",EU._ready);}}EU._simpleAdd(window,"load",EU._load);EU._simpleAdd(window,"unload",EU._unload);EU._tryPreloadAttach();})();}YAHOO.util.EventProvider=function(){};YAHOO.util.EventProvider.prototype={__yui_events:null,__yui_subscribers:null,subscribe:function(A,C,F,E){this.__yui_events=this.__yui_events||{}; +var D=this.__yui_events[A];if(D){D.subscribe(C,F,E);}else{this.__yui_subscribers=this.__yui_subscribers||{};var B=this.__yui_subscribers;if(!B[A]){B[A]=[];}B[A].push({fn:C,obj:F,override:E});}},unsubscribe:function(C,E,G){this.__yui_events=this.__yui_events||{};var A=this.__yui_events;if(C){var F=A[C];if(F){return F.unsubscribe(E,G);}}else{var B=true;for(var D in A){if(YAHOO.lang.hasOwnProperty(A,D)){B=B&&A[D].unsubscribe(E,G);}}return B;}return false;},unsubscribeAll:function(A){return this.unsubscribe(A);},createEvent:function(G,D){this.__yui_events=this.__yui_events||{};var A=D||{};var I=this.__yui_events;if(I[G]){}else{var H=A.scope||this;var E=(A.silent);var B=new YAHOO.util.CustomEvent(G,H,E,YAHOO.util.CustomEvent.FLAT);I[G]=B;if(A.onSubscribeCallback){B.subscribeEvent.subscribe(A.onSubscribeCallback);}this.__yui_subscribers=this.__yui_subscribers||{};var F=this.__yui_subscribers[G];if(F){for(var C=0;C0)?E:0;}B.Dom.setStyle(this.getEl(),C,E+D);},getAttribute:function(C){var E=this.getEl();var G=B.Dom.getStyle(E,C);if(G!=="auto"&&!this.patterns.offsetUnit.test(G)){return parseFloat(G);}var D=this.patterns.offsetAttribute.exec(C)||[];var H=!!(D[3]);var F=!!(D[2]);if(F||(B.Dom.getStyle(E,"position")=="absolute"&&H)){G=E["offset"+D[0].charAt(0).toUpperCase()+D[0].substr(1)];}else{G=0;}return G;},getDefaultUnit:function(C){if(this.patterns.defaultUnit.test(C)){return"px";}return"";},setRuntimeAttribute:function(D){var I;var E;var F=this.attributes;this.runtimeAttributes[D]={};var H=function(J){return(typeof J!=="undefined");};if(!H(F[D]["to"])&&!H(F[D]["by"])){return false;}I=(H(F[D]["from"]))?F[D]["from"]:this.getAttribute(D);if(H(F[D]["to"])){E=F[D]["to"];}else{if(H(F[D]["by"])){if(I.constructor==Array){E=[];for(var G=0,C=I.length;G0&&isFinite(K)){if(G.currentFrame+K>=J){K=J-(I+1);}G.currentFrame+=K;}};};YAHOO.util.Bezier=new function(){this.getPosition=function(E,D){var F=E.length;var C=[];for(var B=0;B0&&!(L[0] instanceof Array)){L=[L];}else{var K=[];for(M=0,O=L.length;M0){this.runtimeAttributes[P]=this.runtimeAttributes[P].concat(L);}this.runtimeAttributes[P][this.runtimeAttributes[P].length]=I;}else{F.setRuntimeAttribute.call(this,P);}};var B=function(G,I){var H=E.Dom.getXY(this.getEl());G=[G[0]-H[0]+I[0],G[1]-H[1]+I[1]];return G;};var D=function(G){return(typeof G!=="undefined");};E.Motion=A;})();(function(){var D=function(F,E,G,H){if(F){D.superclass.constructor.call(this,F,E,G,H);}};D.NAME="Scroll";var B=YAHOO.util;YAHOO.extend(D,B.ColorAnim);var C=D.superclass;var A=D.prototype;A.doMethod=function(E,H,F){var G=null;if(E=="scroll"){G=[this.method(this.currentFrame,H[0],F[0]-H[0],this.totalFrames),this.method(this.currentFrame,H[1],F[1]-H[1],this.totalFrames)];}else{G=C.doMethod.call(this,E,H,F);}return G;};A.getAttribute=function(E){var G=null;var F=this.getEl();if(E=="scroll"){G=[F.scrollLeft,F.scrollTop];}else{G=C.getAttribute.call(this,E);}return G;};A.setAttribute=function(E,H,G){var F=this.getEl();if(E=="scroll"){F.scrollLeft=H[0];F.scrollTop=H[1];}else{C.setAttribute.call(this,E,H,G);}};B.Scroll=D;})();YAHOO.register("animation",YAHOO.util.Anim,{version:"2.6.0",build:"1321"}); \ No newline at end of file diff --git a/js/libs/soundmanager/demo/debug.css b/js/libs/soundmanager/demo/debug.css new file mode 100644 index 0000000..d520ea6 --- /dev/null +++ b/js/libs/soundmanager/demo/debug.css @@ -0,0 +1,25 @@ +#soundmanager-debug { + position:fixed; + _position:absolute; /* IE <7 */ + bottom:1em; + right:1em; + width:38em; + height:30em; + overflow:auto; + padding:0px; + margin:1em; + font-family:monaco,"VT-100",terminal,"lucida console",courier,system; + opacity:0.9; + color:#333; + border:1px solid #ccddee; + -moz-border-radius:3px; + -khtml-border-radius:3px; + -webkit-border-radius:3px; + background:#f3f9ff; +} + +#soundmanager-debug div { + font-size:x-small; + padding:0.2em; + margin:0px; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/flashblock/basic.html b/js/libs/soundmanager/demo/flashblock/basic.html new file mode 100644 index 0000000..3238d81 --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/basic.html @@ -0,0 +1,36 @@ + + + +SoundManager 2: Flash blocker handling - basic example + + + + + + + + + + + + +
+ +

SoundManager 2: Flashblock / "click to flash" handling: Basic Demo

+ +
+ +
+ +

See flashblock.css as a template for making your own SM2 + flash block implementations.

+ +
diff --git a/js/libs/soundmanager/demo/flashblock/flashblock.css b/js/libs/soundmanager/demo/flashblock/flashblock.css new file mode 100644 index 0000000..2dbdd22 --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/flashblock.css @@ -0,0 +1,99 @@ +/* + SoundManager 2 + useFlashBlock + Flash positioning and flashblock / clicktoflash handling +*/ + +#sm2-container { + /* + where the SM2 flash movie goes. by default, relative container. + set relative or absolute here, and don't touch it later or bad things will happen (see below comments.) + */ + position:relative; + width:1px; + height:1px; + _overflow:hidden; /* screw IE 6, just make it display nice */ +} + +#sm2-container object, +#sm2-container embed { + /* + the actual movie bit. + SWF needs to be able to be moved off-screen without display: or position: changes. important. + changing display: or position: or overflow: here or on parent can cause SFW reload or other weird issues after unblock, + eg. SM2 starts but strange errors, no whileplaying() etc. + */ + position:absolute; +} + +#sm2-container object, +#sm2-container embed, +#sm2-container.swf_timedout, +#sm2-container.swf_timedout object, +#sm2-container.swf_timedout embed { + /* + when SM2 didn't start normally, time-out case. flash blocked, missing SWF, no flash? + 48px square flash placeholder is typically used by blockers. + */ + left:auto; + top:auto; + width:48px; + height:48px; +} + +#sm2-container.swf_unblocked { + /* SWF unblocked, or was never blocked to begin with; try to collapse container as much as possible. */ + width:1px; + height:1px; +} + +#sm2-container.swf_unblocked object, +#sm2-container.swf_unblocked embed { + /* hide flash off-screen (relative to container) when it has loaded OK */ + left:-9999em; + top:-9999em; +} + +#sm2-container.swf_error { + /* when there is a fatal error (flash loaded, but SM2 failed) */ + display:none; +} + +#sm2-container.high_performance { + /* "high performance" case: keep on-screen at all times */ + position:absolute; + position:fixed; + _top:-9999px; /* IE 6 hax, no position:fixed */ + _left:-9999px; + bottom:0px; + left:0px; + /* + special case: show at first with w/h, hide when unblocked. + might be bad/annoying. + */ + width:48px; + height:48px; + z-index:99; /* try to stay on top */ +} + +#sm2-container.high_performance.swf_unblocked { + z-index:auto; +} + +#sm2-container.high_performance.swf_unblocked, +#sm2-container.high_performance.swf_unblocked object, +#sm2-container.high_performance.swf_unblocked embed { + /* 8x8px is required minimum to load in fx/win32 in some cases(?), 6x6+ good for fast performance, even better when on-screen via position:fixed */ + width:8px; + height:8px; +} + +#sm2-container.high_performance.swf_unblocked object, +#sm2-container.high_performance.swf_unblocked embed { + /* high-performance case must stay on-screen */ + left:auto; + top:auto; +} + +#sm2-container.high_performance.swf_timedout { + z-index:99; /* try to stay on top */ +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/flashblock/index.html b/js/libs/soundmanager/demo/flashblock/index.html new file mode 100644 index 0000000..8ce4250 --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/index.html @@ -0,0 +1,122 @@ + + + +SoundManager 2: Flash Block handling examples + + + + + + + + + + + + + + + + +
+ +

SoundManager 2: Flashblock / "click to flash" handling demos

+ +

Show SWF inline, wait indefinitely for load (click-to-run or whitelist)

+ +

You can run this demo with Flash 8 (default), Flash 9 (normal mode) or Flash 9 + highPerformance mode (higher JS callback frequency).

+ +

Where (and when) to show the SWF

+ +

To handle potential flash block cases, put <div id="sm2-container"></div> in your markup where you'd like the SWF to appear in those cases. If not specified, SM2 will create and append the #sm2-container node to the document when it starts.

+ +

When soundManager.useFlashBlock is true, SM2 will not apply styles (eg. style.position.left) directly to the flash; rather, it will assign CSS classes and you can handle it as you choose. Take a look at the related CSS file you will also need if you turn this feature on.

+ +

Handling failed start-up cases

+ +

In the blocked/failed start-up case, #sm2-container will have a class name of swf_timedout applied to it.

+ +

SM2 will start its init process, and will fire onready(), onload() and onerror() handlers accordingly. Keep in mind that while onerror() may fire at first, it may be preceded by a successful onload() if the user first loads the page and then later unblocks the flash movie.

+ +

Note that flash blockers may not run when viewing offline (via file://) content, so try viewing this demo online. For FlashBlock (under Firefox), you can also go to about:config using your address bar and change the value of flashblock.blockLocal to test while offline.

+ +

Flash Block Example

+ +

Here, Flash is appended by SM2 to the #sm2-container DIV and after a failed start attempt (if you have a blocker active), will have a swf_timedout class appended.

+ +

The SWF uses position:absolute and negative left/top values so as not to affect the normal page layout, but shifts to left:auto;top:auto (effectively left/top:0) in the blocked case, and becomes visible to the user. On a successful unblock, the movie goes back to left/top:-9999em and is hidden from view.

+ +

SoundManager 2 load status: Loading...

+ + + +
+ +
+ +

Flash Block-related CSS

+ +

When soundManager.useFlashBlock is enabled, CSS is applied to #sm2-container depending on the progress of SM2's start-up.

+

This page + demos use the rules below, fully-defined and commented in flashblock.css. Use it as a base for your own SM2 + flash block implementations.

+ +
#sm2-container {
+ /* Initial state: position:absolute/off-screen, or left/top:0 */
+}
+#sm2-container.swf_timedout {
+  /* Didn't load before time-out, show to user.
+  Maybe highlight on-screen, red border, etc..? */
+}
+#sm2-container.swf_unblocked {
+  /* Applied if movie loads successfully
+  (flash started, so move off-screen etc.) */
+}
+#sm2-container.swf_error {
+  /* "Fatal" error case: SWF loaded,
+  but SM2 was unable to start for some reason.
+  (Flash security or other error case.) */
+}
+#sm2-container.high_performance {
+  /* Additional modifier for "high performance" mode
+  should apply position:fixed and left/bottom 0 to stay on-screen
+  at all times (better flash performance) */
+}
+#sm2-container.flash_debug {
+  /* Additional modifier for flash debug output mode
+  should use width/height 100% so you can read debug messages */
+}
+ +

Basic Demo

+ +

For a more minimal example, see the basic flashblock demo.

+ +
diff --git a/js/libs/soundmanager/demo/flashblock/method1/flashblock.css b/js/libs/soundmanager/demo/flashblock/method1/flashblock.css new file mode 100644 index 0000000..1a1bf05 --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/method1/flashblock.css @@ -0,0 +1,61 @@ +#sm2-container { + /* where the SM2 flash movie goes. */ + position:relative; +} + +#sm2-container, +#sm2-container embed, +#sm2-container.swf_timedout { + /* 48px square flash placeholder is typically used by blockers */ + width:48px; + height:48px; +} + +#sm2-container.swf_timedout { + /* likely a flash block situation. Maybe make it more bold, red, show descriptive nested elements? */ + border:1px solid red; +} + +#sm2-container object, +#sm2-container embed { + /* hide flash off-screen by default */ + position:absolute; + left:-9999em; + top:-9999em; +} + +#sm2-container.swf_timedout object, +#sm2-container.swf_timedout embed { + /* when blocked, make visible inside container */ + left:auto; + top:auto; +} + +#sm2-container object, +#sm2-container embed { + /* 6x6 is small enough to be "invisible" and not blocked by click2flash if allowed, also enough to be really fast/performant on-screen */ + width:48px; + height:48px; +} + +#sm2-container.swf_unblocked, +#sm2-container.swf_unblocked object, +#sm2-container.swf_unblocked embed { + width:6px; + height:6px; +} + +#sm2-container.high_performance { + position:absolute; + position:fixed; + _top:0px; /* IE 6 hax */ + bottom:0px; + left:0px; +} + +#sm2-container.high_performance object, +#sm2-container.high_performance embed { + position:absolute; + left:0px; + top:0px; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/flashblock/method1/flashblock.js b/js/libs/soundmanager/demo/flashblock/method1/flashblock.js new file mode 100644 index 0000000..f6baa5c --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/method1/flashblock.js @@ -0,0 +1,90 @@ +/* + + FlashBlock handler for SoundManager 2 + ------------------------------------------------------------------- + Attempt to handle and gracefully recover from flashblock conditions + Requires SoundManger v2.95a.20090717+ + + http://schillmania.com/projects/soundmanager2/ + +*/ +soundManager._flashBlock = new function() { + + var _s = this; + this.name = 'soundManager._flashblock'; + this.didTimeout = false; // did initial attempt fail? + this.timer = null; // for setTimeout call + + this.startTimer = function(nMsec) { + // soundManager._wD(_s.name+'_.starttimer()'); + _s.timer = window.setTimeout(_s.checkFlashStatus,nMsec); + }; + + this.stopTimer = function() { + // soundManager._wD(_s.name+'.stoptimer()'); + if (_s.timer) { + window.clearTimeout(_s.timer); + _s.timer = null; + } + }; + + this.checkFlashStatus = function() { + // soundManager._wD(_s.name+'.checkflashstatus()'); + var _sm = soundManager; + var oMC = _sm.oMC; // DIV (default: #sm2-container) for .SWF + var oStatus = document.getElementById('sm2-status'); // demo-only + + if (!_sm.ok()) { + // make the movie more visible, so user can fix + oMC.className = 'swf-timedout'; + _s.didTimeout = true; + var msg = 'No flash response, applying .swf-timedout CSS..'; + _sm._wD(_s.name+': '+msg); + if (oStatus) { + oStatus.innerHTML = ''+msg+''; + } + } else { + // SM2 loaded OK + // move the movie container to its proper place + oMC.className = 'swf-loaded'; + if (!_s.didTimeout) { + // SM2 didn't previously fail, no blocker active + var msg = 'SM2 loaded OK (before timeout), fast unblock or no blocker.'; + _sm._writeDebug(_s.name+'.checkFlashStatus: '+msg,1); + if (oStatus) { + oStatus.innerHTML = ''+msg+''; + } + } else { + var msg = 'SM2 recovered after block (or timeout), loaded OK.'; + _sm._wD(_s.name+': '+msg); + if (oStatus) { + oStatus.innerHTML = ''+msg+''; + } + } + // stop timer, if applicable + _s.stopTimer(); + return false; + } + }; + + soundManager.flashLoadTimeout = 0; // wait forever for flash to load - we'll set our own timeout via oninitmovie() + + soundManager.oninitmovie = function() { + // when SWF is written (or ready to start), wait and make SWF visible (time-out case) + soundManager._flashBlock.startTimer(750); + }; + + soundManager.onready(function() { + // SM2 has now initialized, either no blocking OR blocked movie was allowed/whitelisted + var fb = soundManager._flashBlock; + // Yay! recovered OK. + fb.checkFlashStatus(); + }); + + soundManager.ontimeout(function() { + // Blocking was passed (or no blocking), but then something *else* went wrong. + // stop timer, if applicable + fb.stopTimer(); + }); + +}(); diff --git a/js/libs/soundmanager/demo/flashblock/method1/index.html b/js/libs/soundmanager/demo/flashblock/method1/index.html new file mode 100644 index 0000000..3ac7c9e --- /dev/null +++ b/js/libs/soundmanager/demo/flashblock/method1/index.html @@ -0,0 +1,76 @@ + + + +SoundManager 2: Flash blocker handling examples + + + + + + + + + + + + + + + + +
+ +

SoundManager 2: Flashblock / "click to flash" handling demos

+ +

Show SWF inline, wait indefinitely for load

+ +

You can run this demo with Flash 8 (default), Flash 9 (normal mode) or Flash 9 + highPerformance mode (higher JS callback frequency).

+ +

Typically SM2 appends a DIV and hides the SWF off-screen. To handle potential flash block cases, a flash container DIV with an ID of "sm2-container" is placed in the HTML. SM2 will find and append the flash movie to this element. In this case, the SWF can be targeted with CSS and is not positioned off-screen as it normally would be.

+

SM2 will start its init process, and will fire onready(), onload() and onerror() handlers accordingly. Keep in mind that while onerror() may fire at first, it may be preceded by a successful onload() if the user first loads the page and then later unblocks the flash movie.

+

Note that flash blockers may not run when viewing offline (via file://) content, so try viewing this demo online. For FlashBlock (under Firefox), you can also adjust flashblock.blockLocal under about:config in the address bar to test while offline.

+ +

CSS applied to #sm2-container, depending on state:

+
#sm2-container.movieContainer {/* Initial state: position:absolute/off-screen, or inline/relative */}
+#sm2-container.swf_timedout {/* Didn't load before time-out, show to user: On-screen, red border, etc..? */}
+#sm2-container.swf_unblocked {/* Applied if a timeout followed by an unblock (flash started.) Move off-screen. */}
+#sm2-container.high_performance {/* Additional modifier for "high performance" mode, should apply position:fixed and left/bottom 0 to stay on-screen at all times (better flash performance) */}
+#sm2-container.flash_debug {/* Additional modifier for flash debug output mode, should use width/height 100% so you can read debug messages */}
+#sm2-container.swf_error {/* Additional modifier, "something really broke" (fatal: security, missing SWF etc.) */}
+ +

SoundManager 2 load status: Loading...

+ +

Take a look at flashblock.css for implementation details.

+ +
+ +
+ +
diff --git a/js/libs/soundmanager/demo/index.css b/js/libs/soundmanager/demo/index.css new file mode 100644 index 0000000..abd7dd8 --- /dev/null +++ b/js/libs/soundmanager/demo/index.css @@ -0,0 +1,1742 @@ +body { + background:#fff; + margin:0px; + padding:0px; + font:75% "helvetica neue",helvetica,arial,verdana,tahoma,"sans serif"; +} + +h1, +h2.special { + letter-spacing:-0.025em; +} + +h1, h2, h3, h4 { + font-size:1em; + margin:0px; + padding:0px; + vertical-align:middle; +} + +h4.new, +h4.recent, +h4.flash9 { + min-height:24px; +} + +h1 { + font-size:2em; +} + +h2 { + font-family:helvetica,arial,verdana,tahoma,"sans serif"; + font-size:1.5em; +} + +h3 { + font-size:1.17em; + border-bottom:1px solid #ccc; + padding-bottom:0.25em; + margin-top:1.5em; +} + +h4 { + margin:1.5em 0px 0.5em 0px; + font-size:1.15em; +} + +h5 { + font-size:1em; + color:#666; +} + +.c2 h5 { + border-bottom:1px solid #ccc; + padding-bottom:0.25em; +} + +body.home h4 { + border-bottom: 1px solid #e9e9e9; + padding-bottom: 0.33em; + margin-bottom: 0.75em; +} + +em em { + /* special highlight */ + color:#003366; + background:#e9f3ff; + font-weight:bold; + margin-top:-0.3em; + padding:0.2em 0.25em; +} + +pre { + border-left:2px solid #f3f3f3; + padding-left:0.5em; +} + +dl pre { + border-color:#e9f3ff; + margin-left:-0.5em; +} + +dl.alt pre { + border-color:#f3f3f3; +} + +pre, +code, +pre code, +.code, +dt, +#soundmanager-debug { + font-family:monaco,"Andale Mono","VT-100","Lucida Console","Courier New",monospace,courier,system,sans-serif; +} + +pre, +code, +.code, +dt, +#soundmanager-debug { + font-size:11px; + font-weight:normal; + line-height:1.5em; + color:#006699; + background:#f6fcff; +} + +pre { + font-size:11px; /* x-small */ + line-height:1.75em; +} + +pre.specialcommentblock span span { + *line-height:1.75em; +} + +pre span span { + /* font-size:x-small; */ +} + +pre.small { + font-size:90%; +} + +p pre, +p.in pre { + font-size:0.97em; +} + +#soundmanager-debug { + background:#fff; + padding-left:0.75em; + border:2px solid #ddeeff; + font-size:11px; + line-height:1.7em; +} + +body.home #soundmanager-debug { + position:fixed; + _position:absolute; /* IE <7 */ + bottom:1em; + right:1em; + height:12em; + width:auto; + overflow:auto; + padding:0px; + margin:1em 6px 6px 1em; + opacity:0.95; + color:#333; + border:1px solid #ccddee; + -moz-border-radius:3px; + -khtml-border-radius:3px; + -webkit-border-radius:3px; + background:#f3f9ff; + z-index:10; + font-size:small; + line-height:1.2em; +} + +body.home #soundmanager-debug div { + padding-left:0.5em; +} + +#soundmanager-debug div { + margin:0px; + padding:0.25em 0px; + font-size:11px; + color:#333; +} + +#soundmanager-debug div.sm2-alt { + background-color:#fff; + color:#556677; +} + +#live-debug { + display:table; + *display:block; +} + +#live-debug #soundmanager-debug .sm2-alt { + background-color:#f3f9ff; + color:#336699; +} + +dd pre, +dd code { + background:transparent; +/* + font-size:1.15em; + *font-size:1em; +*/ +} + +pre code { + font-size:1em; +} + +pre { + white-space:-moz-pre-wrap; + white-space:pre-wrap; + word-wrap:break-word; /* IE */ +} + +pre span, +code span, +dt span { + color:#339933; +} + +pre span span, +code span span, +dt span span { + color:#667788; +} + +pre.block, +pre.block code, +div.block div.code { + position:relative; + display:table; + *display:block; + border:1px solid #ccc; + -moz-border-radius:3px; + -khtml-border-radius:3px; + -webkit-border-radius:3px; +} + +div.block, +pre.block { + background:#e9f3ff; + border-color:#eee; + padding:3px; +} + +pre.block code, +div.block div.code { + background:#fff; + border:1px solid #ccddee; + padding:0.5em; + font-size:11px; + line-height:1.75em; +} + +dl { + background:#f9fcff; + padding-bottom:1px; +} + +dd { + margin:1em 0px; + padding:0px 0.5em; + line-height:1.5em; +} + +dt { + margin:0px; + padding:0px; + margin:0.5em 0px 1em 0px; + border-bottom:1px solid #ddeeff; + padding:0.3em 0.3em 0.4em 0.3em; + padding-top:0.5em; + text-indent:0.25em; + background:#eef6ff; + font-size:1.15em; +} + +dt.alt { + background:#f3f3f3; + border-bottom-color:#e6e6e6; +} + +dl.alt { + background:#fcfcfc; + padding:0px 0px 1px 0px; +} + +h2 { + padding-top:0.5em; +} + +#top { + position:relative; + padding:1em 1em 0px 1em; + background:#222; + color:#fff; + z-index:1; +} + +#top, +#top div { + *zoom:1; +} + +#top h1 { + /* special christmas light case */ + display:inline; +} + +#top h2 { + /* tagline */ + font-size:1.25em; + font-weight:300; + padding-top:2px; + letter-spacing:-1px; +} + +#main { + position:relative; + padding:0px 0px 2em 0px; + padding-top:1px; + margin:0px auto; + max-width:110em; + *padding:0px 1em 2em 1em; + zoom:1; +} + +.columnar { + position:relative; + margin:0px; + padding:0px; + margin:2em 0.5em 0.5em 0.5em; +} + +.columnar .c1 { + position:absolute; + left:0px; + top:0px; + width:20em; + height:30px; + _position:relative; /* IE 6 hackery */ + _height:auto; +} + +#doc .columnar .c1 { + left:auto; + right:1em; + _right:auto; +} + +.columnar .c1 h2 { + position:relative; + font-size:1.2em; + padding:0.46em 0.5em; + vertical-align:middle; + background:#333; + color:#fff; +} + +.columnar .c1 p { + margin:0.5em 0px 1em 0px; + padding-left:0.5em; + padding-right:0.5em; + font-size:0.95em; + line-height:1.35em; + color:#666; +} + +.columnar .c1 p code { + font-size:xx-small; + color:#336699; +} + +.columnar .c2 { + position:relative; + margin-top:2.33em; + margin-top:1px; + border-top:0.25em solid #333; + margin-left:22em; + margin-bottom:1.5em; +} + +.triple .columnar .c2 { + margin-right:21.25em; + min-width:20em; +} + +#doc .triple .columnar .c2 { + margin-left:21.5em; + margin-right:23em; + _margin-right:0px; /* not you, IE 6. */ +} + +#doc .triple .columnar .c1 { + margin-right:0px; + margin-left:21.25em; +} + +.columnar .c2 p:first-child { + margin-top:0.2em; +} + +.columnar .c2 h3:first-child { + margin-top:0.2em; + padding-bottom:0.3em; +} + +.columnar .c2 > .f-block:first-child > h4 { + margin-top:0.5em; +} + +.columnar .c2 strong strong { + display:block; + padding:0.5em; + border-bottom:1px solid #999; + background:#f0f6ff; + color:#336699; +} + +.columnar .c2 p { + line-height:1.5em; +} + +.three .columnar { + position:relative; +} + +.three .columnar .c1 { + position:relative; + width:20em; +} + +.three .columnar .c2 { + position:relative; + margin-right:16em; +} + +.c3 { + position:absolute; + right:1em; + margin-right:16px; + top:2em; + width:16em; + margin-top:-0.5em; +} + +#doc .c3 { + right:auto; + margin-right:0px; + margin-left:16px; + left:1.25em; +} + +#nav { + position:relative; + margin-top:0.75em; + margin-left:-0.5em; +} + +ul { + line-height:1.5em; +} + +#nav ul { + margin:0px; + padding:0px; + line-height:1em; + list-style-type:none; +} + +#nav>ul { +/* + border-top:1px solid #333; +*/ +} + +#nav ul li { + position:relative; + margin:0px; + padding:0px; + float:left; + display:inline; + padding-right:1px; +} + +#nav ul li ul { + position:absolute; + z-index:1; + display:none; + min-width:17em; + max-width:20em; + background:#3399cc; + opacity:0.95; + _width:17em; + *opacity:1; + *top:1.5em; + *left:0px; +} + +#nav ul li:last-child ul { + right:1px; +} + + +#nav ul li:hover ul, +#nav ul li ul:hover { + display:block; +} + +#nav ul li ul li { + float:none; + display:block; + width:100%; +} + +#nav ul li ul li a { + display:block; + width:auto; + border:none; + padding:0.4em; + padding-left:1em; + color:#fff; +} + +#nav ul li a { + display:inline-block; + padding:0.3em 0.5em; + padding-left:0.75em; + padding-right:0.75em; + text-decoration:none; + font-weight:bold; + color:#ccc; +} + +#nav ul li strong a { + background:#336699; + background:#; + background:#fff; + color:#333; +} + +#nav ul li strong a:hover, +#nav ul li a:hover, +#nav ul>li:hover strong a, +#nav ul>li:hover>a { + background:#3399cc; + color:#fff; +} + +#nav ul li ul li a:hover { + background:#336699; +} + +#version { + position:relative; + float:right; + display:inline; + margin-left:1em; + font-size:x-small; + margin-bottom:0px; + margin-top:0.25em; + color:#999; +} + +div.clear { + clear:both; + font-size:1px; + line-height:1px; +} + +.note { + margin-top:0.5em; + font-size:0.95em; + color:#999; +} + +.note a { + color:#666; + padding:1px; + margin:-1px; +} + +.note a:hover { + color:#fff; + background:#666; +} + +.medium-note { + padding-top:1.5em; + font-size:1em; +} + +ul.standard { + line-height:1.5em; + padding-left:1.2em; + *padding-left:0px; + color:#333; + margin-top:0.5em; + margin-bottom:0.5em; + list-style-type:square; +} + +ul.standard li { + margin-bottom:0.5em; +} + +ul.standard ul { + margin-top:0.5em; + margin-bottom:1em; + padding-left:1.2em; +} + +.c3 { + background:#fcfcfc; +} + +.c3 ul { + list-style-type:none; +} + +.c3 ul, +.c3 ul li { + margin:0px; + padding:0px; +} + +.c3 h2 { + font-size:1.1em; + text-indent:0.4em; +} + +.c3 ul li a { + text-decoration:none; + color:#000; +} + +.c3 ul li a:hover { + color:#000; + _color:#000; +} + +.c3 ul li a:focus { + color:#000; + outline:none; +} + +.c3 ul li.active a { + color:#fff; +} + +.c3 ul li.active a:hover { + _color:#fff; +} + +.c3 .box { + margin-top:6px; +} + +.wedge, +.c3 h2 { + position:relative; + background:#333; + color:#fff; + margin:0px; + padding:0px; + height:2.101em; + line-height:1.65em; +} + +.c3 h2 { + height:1.75em; + line-height:1.75em; +} + +.wedge { + background-color:#3399cc; +} + +.wedge-dark { + background:#333; +} + +.wedge .l, +.wedge .r { + border-top:1.75em solid #333; +} + +.c3 h2 .l, +.c3 h2 .r { + border-top:1.66em solid #333; +} + +.wedge .l, +.c3 h2 .l { + background:transparent url(../demo/_image/wedge.png) no-repeat -64px 0px; + position:absolute; + left:0px; + top:0px; + width:16px; + height:100%; + margin-left:-16px; + border-top:1.7em solid #333; +} + +.wedge .r, +.wedge-dark .r, +.c3 h2 .r { + background:transparent url(../demo/_image/wedge.png) no-repeat -48px 0px; + position:absolute; + right:0px; + top:0px; + width:16px; + height:100%; + margin-right:-16px; +} + +.wedge .l, +.wedge .r { + border-color:#3399cc; +} + +.wedge .l { + background-position:-64px -64px; +} + +.wedge .r { + margin-top:-16px; + border-top:none; + height:16px; + border-bottom:1.7em solid #3399cc; + background-position:0px -192px; +} + +.wedge-dark .l, +.wedge-dark .r { + border-color:#333; +} + +.wedge-dark .l { + background-position:-64px 0px; +} + +.wedge-dark .r { + background-position:0px -128px; +} + +.c3 h2 .r.up { + margin-top:-16px; + border-top:none; + height:16px; + border-bottom:1.66em solid #333; + background-position:0px -128px; +} + +.c3 h2 .l.flat, +.wedge .l.flat, +.c3 h2 .r.flat, +.wedge .r.flat { + background-image:none; +} + +.c3 ul { + margin:0px; + padding:0px; + margin-top:0.125em; + margin-bottom:0.25em; + list-style-type:none; +} + +.c3 ul li { + border:1px solid #f3f3f3; + border-top:none; + border-bottom:none; +} + +.c3 ul ul li { + border:none; +} + +.c3 ul li { + margin:0px; + padding:0px; +} + +.c3 ul li ul li { + font-family:monaco,"Andale Mono","VT-100","Lucida Console","Courier New",monospace,courier,system,sans-serif; + font-size:11px; + line-height:1.5em; + text-indent:0.5em; + padding:0.25em 0.25em 0.25em 0.25em; + cursor:hand; +/* + font-smooth:never; +*/ +} + +.c3 ul li ul li.alt { + background-color:#f8f8f8; +} + +.c3 ul li ul li:hover { + background-color:#ccddff; + cursor:pointer; + cursor:hand; +} + +.c3 ul li ul li.active { + background-color:#3399cc; + color:#fff; +} + +.c3 h3 { + margin:0px; + padding:0px; + background:#3399cc; + border:none; + color:#fff; + font-size:1.3em; + text-indent:0.5em; + font-size:1em; + height:1.67em; + padding:0.25em 0.5em; + padding:0px; + +} + +.c3 h4 { + font-size:1em; + margin:1em 0.25em 0.25em 0.25em; + padding:0px 0.25em; + padding:0.2em 0.2em 0.2em 0.5em; + vertical-align:middle; + margin:0px; + color:#333; + background:#eef6ff; + border-top:1px solid #fff; + border-bottom:1px solid #ddeeff; +} + +#get-satisfaction h2 a { + color:#fff; +} + +#get-satisfaction a { + color:#333; +} + +#get-satisfaction a:hover { + color:#fff; +} + +.c3 h2 a { + color:#fff; +} + +.c3 h2 a:hover { + color:#fff; + text-decoration:underline; +} + +.flash9 { + background-image:url(../demo/_image/flash9.png); + background-repeat:no-repeat; + background-position:bottom right; + _background-image:none; +} + +li.flash9 { + background-position:bottom right; +} + +.flash9.active { + background-image:url(../demo/_image/flash9-dark.png); + _background-image:none; +} + +.new { + background-image:url(../demo/_image/new.png); + background-repeat:no-repeat; + background-position:bottom right; + _background-image:none; +} + +.recent { + background-image:url(../demo/_image/new-bw.png); + background-repeat:no-repeat; + background-position:bottom right; + _background-image:none; +} + +.new.active, +.recent.active { + background-image:url(../demo/_image/new-dark.png); + _background-image:none; +} + +li.new { + background-position:top right; +} + +span.nevermind, +.removed { + text-decoration:line-through; + opacity:0.75; +} + +.padded { + padding:0.5em; +} + +.c3 p { + font-size:0.9em; + padding-left:0.5em; + padding-right:0.5em; +} + +.c1 pre code { + margin-top:0px; + font-size:xx-small; + color:#336699; + margin-left:0px; +} + +.c1 pre { + margin-top:0px; + padding-top:0px; + margin-left:0.5em; +} + +#reset-filter { + position:relative; + font-family:"Helvetica Neue","Helvetica",helvetica,arial,verdana,sans-serif; + font-weight:300; + font-size:2.5em; + letter-spacing:-1px; +} + +.c2 .option { + font-size:small; + float:right; + display:inline; + margin-left:1em; + margin-right:0.5em; + margin-top:3px; + line-height:1em; + white-space:nowrap; +} + +.c2 .option a { + padding:0.1em 0.35em 0.1em 0.35em; + color:#3399cc; +} + +/* +.c2 .option a:hover { + background-color:#3399cc; + color:#fff; +} +*/ + +#filter-box { + position:relative; + display:none; +} + +#get-satisfaction { + position:relative; +} + +#gsfn_content { + padding:0.5em 0px 0px 0px; +} + +#gsfn_content ul { + margin-bottom:0.5em; +} + +#gsfn_content ul li { + border:none; +} + +div#gsfn_list_widget img { + border: none; +} + +div#gsfn_list_widget a { + text-decoration:none; +} + +div#gsfn_list_widget a.widget_title { + display: block; + margin-bottom: 10px; + font-weight: bold; +} + +div#gsfn_list_widget .powered_by { + font-family:verdana,arial; + margin:0px 1em 0px 1em; + padding:0.25em 0px 0px 0px; + border-top: 1px solid #ccc; + font-size:xx-small; + opacity:0.5; +} + +div#gsfn_list_widget .powered_by:hover { + opacity:1; +} + +div#gsfn_list_widget .powered_by a:hover { + color:#666; +} + +div#gsfn_list_widget div#gsfn_content { + font-size:x-small; + font-size:0.9em; + padding-left:0.5em; + padding-right:0.5em; +} + +div#gsfn_list_widget div#gsfn_content li { + text-align:left; + position: relative; + clear:right; + *zoom:1; +} + +div#gsfn_list_widget div#gsfn_content li:hover, +div#gsfn_list_widget div#gsfn_content li:hover a { + background:#3399cc; + color:#fff; +} + +div#gsfn_list_widget div#gsfn_content a.gsfn_link { + display:block; + line-height:1.2em; + padding:5px 0px 5px 5px; +} + +div#gsfn_list_widget div#gsfn_content a.gsfn_link:hover { + _color:#fff; + _background-color:#3399cc; +} + +div#gsfn_list_widget div#gsfn_content span.time { + font-size: xx-small; + color:#999; + padding-left:3px; + padding-right:3px; + text-align:right; + float:right; + display:inline; + margin-top:1px; +} + +div#gsfn_list_widget div#gsfn_content li:hover span.time { + color:#fff; +} + +div#gsfn_list_widget div#gsfn_content p.gsfn_summary { + margin-top: 2px; + position:relative; + z-index:2; +} + +.tight { + margin-top:0px; +} + +.compact { + margin-bottom:0.25em; +} + +.c2 a, +a.cta { + margin-top:-0.3em; + padding:0.2em 0.25em; + text-decoration:none; + color:#3399cc; + -khtml-border-radius:0.25em; + -moz-border-radius:0.25em; + border-radius:0.25em; + zoom:1; +} + +/* redefine for simple mp3 button demo */ +.c2 a.sm2_button { + -moz-border-radius:6px; + -webkit-border-radius:6px; + -o-border-radius:6px; + border-radius:6px; +} + +.c2 a.sm2_button.type-2 { + -moz-border-radius:9px; + -webkit-border-radius:9px; + -o-border-radius:9px; + border-radius:9px; +} + + +.c2 a { + margin-left:-0.2em; + margin-right:-0.2em; + color:#3399cc; + font-weight:bold; + text-decoration:none; +} + +.c2 a.cta { + text-decoration:none; +} + +a.cta span { + font-size:1.5em; + line-height:1em; +} + +a.cta:hover, +.c2 a:hover { + background-color:#3399cc; + border-color:#3399cc; + color:#fff; + text-decoration:none; +} + +.c2 a.sm2_button:hover { + /* arg. not specific enough, redefine here. */ + background-color:#cc3333; +} + +a.cta-more { + color:#ddeeff; + font-size:0.8em; + position:absolute; + right:0px; + margin:0px; + padding:1px; + bottom:0.9em; + line-height:1em; +} + +a.cta-more:hover { + background:#fff; + color:#3399cc; +} + +li.html5support span { + padding:0px 5px; + display:inline-block; + text-align:center; + font-weight:bold; + background:#ccc; + color:#fff; + -moz-border-radius:5px; + -webkit-border-radius:5px; + border-radius:5px; + margin-left:0.5em; + margin-bottom:0.25em; +} + +li.html5support em { + font-weight:bold; +} + +li.html5support span.true { + background:#669966; +} + +li.html5support span.partial { + background:#993333; +} + +li.html5support em.partial { + color:#993333; +} + +li.html5support em.true { + color:#669966; +} + +#nav ul li ul { + /* eh, why not. */ + -moz-box-shadow:2px 2px 2px rgba(51,153,204,0.2); + -khtml-box-shadow:2px 2px 2px rgba(51,153,204,0.2); + -webkit-box-shadow:2px 2px 2px rgba(51,153,204,0.2); + box-shadow:2px 2px 2px rgba(51,153,204,0.2); +} + +.newer { + vertical-align:middle; +} + +.newer a, +a.feature, +.c2 .feature-hot { + display:block; + background:#3399ff; + padding:0.3em 0.5em; + margin:-0.3em 0px 0px -0.5em; + color:#fff; + font-weight:bold; + border:3px solid #ccc; + border:3px solid rgba(255,255,255,0.66); + -moz-border-radius:8px; + -webkit-border-radius:8px; + border-radius:8px; + line-height:1em; + text-decoration:none; + font-size:small; + vertical-align:middle; +} + +a.feature { + display:inline; + margin-left:0px; +} + +.newer a, +.c2 .feature-hot { + background:#ff0000; + border-color:#ff6666; + color:#fff; + line-height:1em; +} + +.newer a:hover, +.c2 .feature-hot:hover { + background:#990000; + border-color:#cc0000; +} + +a.feature:focus, +a.feature:hover { + background:#ff0000; + border-color:#ff6666; + color:#fff; +} + +a.warning, +span.warning { + font-weight:bold; +} + +a.warning, +span.warning, +a.warning code, +span.warning code { + color:#993300; +} + +a.warning:hover { + color:#fff; + background:#993300; +} + +.newer p { + margin:0px; + padding:0px; +} + +h4 .scratched-out { + text-decoration:line-through; + color:#999; + /* + font-size:xx-small; + */ + font-size:0.9em; + margin-top:-0.75em; + -webkit-transform:rotate(-15deg); + -moz-transform:rotate(-15deg); +} + +.inthewild { + margin-top:1em; +} + +.inthewild a, +.inthewild a img { + border:none; +} + +.inthewild a { + margin-right:1em; +} + +.inthewild a:last-child { + margin-right:0px; +} + +.inthewild a, +.inthewild a img { + vertical-align:middle; +} + +.inthewild a { + display:inline-block; + display:-moz-inline-box; + overflow:hidden; + margin:1em 1em 0.5em 1em; + padding:0px; +} + +.inthewild a:first-child { + margin-left:0.5em; +} + +.inthewild a span { + position:absolute; + text-indent:-9999em; +} + +#favtape:hover { + background:#ff0066; + border-color:#ff0066; + color:#fff; +} + +#soundcloud { + width:83px; + height:58px; + background:transparent url(../demo/_image/soundcloud-thecloudplayer-logo.png) no-repeat 0px -59px; + margin-right:3px; +} + +#soundcloud:hover { + background-position:0px 0px; +} + +#lastfm { + width:80px; + height:28px; + background:transparent url(../demo/_image/lastfm.png) no-repeat 0px -28px; +} + +#lastfm:hover { + background-position:0px 0px; +} + +#mixcrate { + width:80px; + height:16px; + background:transparent url(../demo/_image/mixcrate.png) no-repeat 0px 0px; +} + +#mixcrate:hover { + background-position:0px -16px; +} + +#opera { + width:79px; + height:32px; + background:transparent url(../demo/_image/opera.png) no-repeat 0px 0px; +} + +#opera:hover { + background-position:0px -32px; +} + +/* homepage-specific demo shiz */ + +.sidenote { + font-size:x-small; + opacity:0.75; +} + +ul.playlist { + font-size:xx-small; +} + +ul.playlist li a { + font-size:1em; +} + +ul.playlist li a, +ul.playlist li a:hover { + background:transparent; + -khtml-border-radius:0px; + -moz-border-radius:0px; + border-radius:0px; + line-height:1em; +} + +ul.playlist li .timing { + top:0.6em; + font-size:xx-small; +} + +ul.playlist.use-peak li .peak { + /* overrides */ + height:0.61em; + margin-top:-5px; + width:0.92em; +} + +html.isSafari ul.playlist.use-peak li .peak { + margin-top:-4px; /* dumb tweak */ +} + +ul.playlist.use-peak li .timing { + right:4em; +} + +ul.playlist.use-peak li .peak-box { + height:0.66em; +} + +ul.playlist li .peak .l { + margin-right:0px; +} + +ul.playlist li .peak .l, +ul.playlist li .peak .r { + width:6px; +} + +ul.playlist li .peak .r { + left:9px; +} + +ul.playlist li a.not-supported { + /* give user a hint that the format doesn't work */ + text-decoration:line-through; + color:#666; + opacity:0.5; +} + +ul.graphic li { + line-height:1.5em; +} + +ul.graphic li a, +ul.graphic li a.sm2_link { + min-width:17.75em; + width:auto; +} + +ul.graphic li a, +ul.graphic li a.sm2_link { + background-color:#ddd; + border-color:#ddd; + color:#333; + vertical-align:middle; +} + +ul.graphic li a { + background:#ddd url(../demo/play-mp3-links/image/icon_play.png) no-repeat 3px 50%; + _background-image:url(../demo/play-mp3-links/image/icon_play.gif); +} + + +ul.graphic li a:hover, +ul.graphic li a.sm2_paused:hover, +ul.graphic li a.sm2_link:hover, +ul.graphic li a.sm2_playing, +ul.graphic li a.sm2_playing:hover { + background-color:#336699; + border-color:#336699; + color:#fff; +} + +ul.graphic li a.sm2_link { + /* Doesn't work on this page. */ + -webkit-transition-property: none; + -webkit-transition: none; +} + +.c2 ul.playlist li a { + margin:0px; + padding:0px; + letter-spacing: -0.02em; +} + +/* Flash positioning and flashblock / clicktoflash handling */ + +/* special-case for the SM2 homepage only */ + +body.home #sm2-container { + position:absolute; + width:48px; + height:48px; + margin:1px 0px 0px 1px; +} + +body.home #sm2-container.high_performance { + bottom:auto; + left:auto; + top:auto; +} + +body.home #sm2-container.swf_timedout { + border:1px solid #ff3333; + border-bottom:none; + margin:0px; + z-index:2; +} + +body.home #sm2-container.swf_unblocked { + width:1px; + height:1px; +} + +#sm2-support { + display:none; + font-size:1em; + border:1px solid #ff3333; + background:#fff6f0; + margin-top:48px; +} + +#demo-box { + position:relative; + float:right; + display:inline; + background: #fff; /* hide borders behind this box */ + padding-left:32px; + padding-right:16px; + margin-top:-1em; + width:21.25em; + /* hide from IE 6 */ + _position:absolute; + _left:-9999em; + _top:-9999em; +} + +#demo-box #without-html5 { + display:none; +} + +#demo-box #with-debug, +#demo-box #without-html5, +#demo-box #without-html5 a { + display:inline; + margin-top:-0.75em; + font-weight:normal; + font-size:x-small; + text-decoration:none; + font-weight:normal; + color:#666; +} + +#demo-box #with-debug { + margin-right:1.5em; +} + +#demo-box #without-html5 a:hover, +#demo-box #with-debug:hover { + color:#fff; +} + +#demo-box a.feature-hot { + display:inline; +} + +hr { + visibility:hidden; + margin:0px; + padding:0px; +} + +.demo-block { + position:relative; + background:#f9f9f9; + border:1px solid #e6e6e6; + padding:4px; + padding-top:0.5em; + margin-top:-0.55em; + border-top:none; +} + +#demo-header { + color:#333; + background:#f9f9f9; + border:1px solid #e6e6e6; + border-bottom:0px; + margin-bottom:0px; + padding:0.5em; +} + +#demos h3 { + padding-bottom:0px; + text-indent:0.5em; + font-weight:normal; +} + +#demos h3 a { + font-weight:normal; +} + +#revision-list > li { + margin-top:3em; + margin-bottom:2em; +} + +#revision-list > li:first-child { + margin-top:2em; +} + +/* seasonal decorations */ + +#lights { + position:absolute; + border-top:1px solid #006600; + left:0px; + top:0px; + width:100%; + height:100%; + overflow:hidden; + display:none; +} + +.xlsf-light { + position:absolute; + margin-top:-1px; +} + +body.fast .xlsf-light { + opacity:0.9; +} + +.xlsf-light { + opacity:0.9; +} + +.xlsf-fragment { + position:absolute; + background:transparent url(christmas-lights/image/bulbs-50x50-fragments.png) no-repeat 0px 0px; + width:50px; + height:50px; +} + +.xlsf-fragment-box { + position:absolute; + left:0px; + top:0px; + width:50px; + height:50px; + *width:100%; + *height:100%; + display:none; +} + +.xlsf-cover { + position:fixed; + left:0px; + top:0px; + width:100%; + height:100%; + background:#fff; + opacity:1; + z-index:999; + display:none; +} + +.figure { + display:inline; + display:inline-block; + border:1px solid #ddeeff; + padding:0.5em; + margin:0.5em 0px 0.5em 0px; +} + +.figure .code { +} + +.figure .code span { + padding:0.25em; + border:1px solid #f0f9ff; + background:#fff; +} + +.figure .code span.mid { + color:#666; +} + +#sm2-container.flash_debug { + /* flash movie, when soundManager.debugFlash = true */ + position:relative; + width:auto; + height:300px; + width:100%; + background:#f6f6f6; + border:1px solid #ccc; +} + +#sm2-container.flash_debug object, +#sm2-container.flash_debug embed { + width:100%; + height:100%; + left:auto; + top:auto; +} + +ul.file-structure ul { + padding-left:1.5em; +} + +ul.file-structure li { + list-style-type:square; + margin-top:0.25em; + margin-left:0px; +} + +ul.file-structure li span { + color:#999; +} + +#sm2-filesizes { + border:1px solid #ddd; +} + +#sm2-filesizes tr:nth-child(2n+1) { + background:#f9f9f9; +} + +#sm2-filesizes th { + background:#eee; + font-weight:bold; + text-align:left; +} + +#sm2-filesizes th { + padding:4px 6px; +} + +#sm2-filesizes td { + padding:0px 6px; + border:1px solid #eee; +} + +#sm2-filesizes p { + margin-top:0.5em; + margin-bottom:0px; +} + +#sm2-filesizes pre { + border-left:none; + margin-top:0.5em; + margin-bottom:0.5em; +} + +#sm2-filesizes .nw { + white-space:nowrap; +} + +#sm2-filesizes .booyaa { + /* in the words of Paris Hilton, "that's hot." (in the nerdy sense, I suppose.) */ + background:#fff9f9; + color:#990000; +} + +#history li.in > p.compact { + font-weight:bold; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/index.html b/js/libs/soundmanager/demo/index.html new file mode 100644 index 0000000..1645fb3 --- /dev/null +++ b/js/libs/soundmanager/demo/index.html @@ -0,0 +1,28 @@ + + + +MP3 player demo + + + + + + + + + + + + +
+ +

SoundManager 2 Demos

+ +

+ SoundManager 2 project page +

+ +
+ + diff --git a/js/libs/soundmanager/demo/index.js b/js/libs/soundmanager/demo/index.js new file mode 100644 index 0000000..97140ee --- /dev/null +++ b/js/libs/soundmanager/demo/index.js @@ -0,0 +1,368 @@ +/* SoundManager 2 - project home utility JS */ + +function _id(sID) { + return document.getElementById(sID); +} + +getSoundByURL = function(sURL) { + return (typeof self.soundsByURL[sURL] != 'undefined'?self.soundsByURL[sURL]:null); +} + +function init() { + var o = document.getElementById('main'); + var el = o.getElementsByTagName('dt'); + for (var i=el.length; i--;) { + if ((i+1)%2==0) { + utils.addClass(el[i],'alt'); + } + } + var el = o.getElementsByTagName('dl'); + for (var i=el.length; i--;) { + if ((i+1)%2==0) { + utils.addClass(el[i],'alt'); + } + } +} + +function Utils() { + var self = this; + + this.hasClass = function(o,cStr) { + return (typeof(o.className)!='undefined'?new RegExp('(^|\\s)'+cStr+'(\\s|$)').test(o.className):false); + } + + this.addClass = function(o,cStr) { + if (!o || !cStr) return false; // safety net + if (self.hasClass(o,cStr)) return false; + o.className = (o.className?o.className+' ':'')+cStr; + } + + this.removeClass = function(o,cStr) { + if (!o || !cStr) return false; // safety net + if (!self.hasClass(o,cStr)) return false; + o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),''); + } + + this.toggleClass = function(o,cStr) { + var m = (self.hasClass(o,cStr)?self.removeClass:self.addClass); + m(o,cStr); + } + + this.getElementsByClassName = function(className,tagNames,oParent) { + var doc = (oParent||document); + var matches = []; + var i,j; + var nodes = []; + if (typeof(tagNames)!='undefined' && typeof(tagNames)!='string') { + for (i=tagNames.length; i--;) { + if (!nodes || !nodes[tagNames[i]]) { + nodes[tagNames[i]] = doc.getElementsByTagName(tagNames[i]); + } + } + } else if (tagNames) { + nodes = doc.getElementsByTagName(tagNames); + } else { + nodes = doc.all||doc.getElementsByTagName('*'); + } + if (typeof(tagNames)!='string') { + for (i=tagNames.length; i--;) { + for (j=nodes[tagNames[i]].length; j--;) { + if (self.hasClass(nodes[tagNames[i]][j],className)) { + matches[matches.length] = nodes[tagNames[i]][j]; + } + } + } + } else { + for (i=0; i'+o.innerHTML+''; + _id('search-results').style.display = 'block'; + _id('filter-box').style.display = 'block'; + if (isClear) { + _id('filter-box').style.paddingBottom = '0px'; + _id('filter-box').style.display = 'none'; + } else { + _id('filter-box').style.paddingBottom = '0px'; + if (!navigator.userAgent.match(/msie/i)) { + _id('filter-box').style.paddingBottom = Math.max(0,(document.documentElement.scrollTop || window.scrollY)-utils.getOffY(_id('filter-box'))-parseInt(_id('filter-box').offsetHeight)-20)+'px'; + } + _id('filter-box').style.display = 'block'; + // if ((!document.documentElement.scrollTop && !window.scrollY)) _id('filter-box').style.display = 'none'; + } + if (lastSelected) { + if (lastSelected == o) { + utils.toggleClass(lastSelected,'active'); + } else { + utils.removeClass(lastSelected,'active'); + utils.addClass(o,'active'); + } + } else { + utils.addClass(o,'active'); + } + lastSelected = o; + // cancel bubble, too? + return false; + } +} + +function getLiveData() { + getDynamicData(); + // reinvigorate.net is a handy (and free!) stats tracking service thingy. you should check it out. + var is_live = (document.domain && document.domain.match(/schillmania.com/i) && typeof re_ != 'undefined'); + loadScript('http://include.reinvigorate.net/re_.js'); + setTimeout(function(){ + if (typeof re_ != 'undefined') re_(is_live?'f6795-v062d0xv4u':'u8v2l-jvr8058c6n'); + },3000); +} + +function getDynamicData() { + // Attempt to fetch data from schillmania.com: "Get Satisfaction" topics, version updates etc. + loadScript('http://www.schillmania.com/services/soundmanager2/info/?version='+soundManager.versionNumber+'&rnd='+parseInt(Math.random()*1048576)); +} + +function loadScript(sURL,onLoad) { + var loadScriptHandler = function() { + var rs = this.readyState; + if (rs == 'loaded' || rs == 'complete') { + this.onreadystatechange = null; + this.onload = null; + window.setTimeout(onLoad,20); + } + } + function scriptOnload() { + this.onreadystatechange = null; + this.onload = null; + window.setTimeout(onLoad,20); + } + var oS = document.createElement('script'); + oS.type = 'text/javascript'; + if (onLoad) { + oS.onreadystatechange = loadScriptHandler; + oS.onload = scriptOnload; + } + oS.src = sURL; + document.getElementsByTagName('head')[0].appendChild(oS); +} + +function doAltShortcuts() { + var o = _id('shortcuts-list'); + if (!o) { + return false; + } + var oParents = []; + var oLIs = o.getElementsByTagName('li'); + var isIgnore = null; + var offset = 0; + for (var i=0; i + + +SoundManager 2 Demo: Basic MP3 Play Button (Simple Demo) + + + + + + + + +

SoundManager 2 / Basic MP3 Play Button: Template

+ +

View the source code of this page for detail. Don't forget to set soundManager.debugMode = false; to disable debug output.

+ +

Walking Walking

+ +

Armstrong Beat Armstrong Beat

+ +

SoundManager 2 project home

+ + + + + diff --git a/js/libs/soundmanager/demo/mp3-player-button/css/mp3-player-button.css b/js/libs/soundmanager/demo/mp3-player-button/css/mp3-player-button.css new file mode 100644 index 0000000..e5e1ce6 --- /dev/null +++ b/js/libs/soundmanager/demo/mp3-player-button/css/mp3-player-button.css @@ -0,0 +1,114 @@ +/* + + SoundManager 2: Basic MP3 player CSS + ------------------------------------ + + Clicks on links to MP3s are intercepted via JS, calls are + made to SoundManager to load/play sounds. CSS classes are + appended to the link, which are used to highlight the + current play state and so on. + + Class names are applied in addition to "sm2_button" base. + + Default: + + sm2_button + + Additional states: + + sm2_playing + sm2_paused + + eg. + + + some.mp3 + + + some.mp3 + + + Note you don't require ul.graphic / ul.flat etc. for your use + if only using one style on a page. You can just use .sm2_button{} + and so on, but isolate the CSS you want. + + Side note: Would do multiple class definitions eg. + + a.sm2_default.sm2_playing{} + + .. except IE 6 has a parsing bug which may break behaviour, + applying sm2_playing {} even when the class is set to sm2_default. + + + If you want to make your own UI from scratch, here is the base: + + Default + hover state, "click to play": + + a.sm2_button {} + a.sm2_button:hover {} + + Playing + hover state, "click to pause": + + a.sm2_playing {} + a.sm2_playing:hover {} + + Paused + hover state, "click to resume": + + a.sm2_paused {} + a.sm2_paused:hover {} + +*/ + +a.sm2_button { + position:relative; + display:inline-block; /* If you worry about old browser bugs, Firefox 2 might not like this and may need -moz-inline-box instead. :D */ + width:18px; + height:18px; + text-indent:-9999px; /* don't show link text */ + overflow:hidden; /* don't draw inner link text */ + vertical-align:middle; + /* and, a bit of round-ness for the cool browsers. */ + -moz-border-radius:6px; + -webkit-border-radius:6px; + -o-border-radius:6px; + border-radius:6px; + margin-top:-1px; /* vertical align tweak */ + /* safari 3.1+ fun (/W3 working draft extension, TBD.) */ + -webkit-transition-property: hover; + -webkit-transition: all 0.2s ease-in-out; + -moz-transition: all 0.2s ease-in-out 0s; /* firefox 4 (couldn't sort out -moz-transform vs. MozTransform, so, "all" for now) */ + -o-transition-property: background-color; /* opera 10.5 */ + -o-transition-duration: 0.15s; +} + +a.sm2_button:focus { + outline:none; /* maybe evil, but don't show the slight border outline on focus. */ +} + +a.sm2_button, +a.sm2_button.sm2_paused:hover { + background-color:#3399cc; + background-image:url(../image/arrow-right-white.png); + /* where possible, use data: and skip the HTTP request. Fancy-pants. Would use short-hand background: for above, but IE 8 doesn't override background-image. */ + background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAKCAYAAABmBXS+AAAAbklEQVQY02NgQAL//v1jZMAF/v//vwuIs9HEUBUBTbj4HwIeA3EGVsVAxtn/qOAVUGM8uknIiv4hsV8A5ZKxKfoLVvnvHwifAzLtMKwDSQLBVSBti27dJajkcSD2RJODO3wtkOOMz/tMSJJYAxMA5dmsL0IfubQAAAAASUVORK5CYII=); + *background-image:url(../image/arrow-right-white.gif); /* IE 6+7 don't do DATA: URIs */ + background-repeat:no-repeat; + background-position:5px 50%; +} + +a.sm2_button:hover, +a.sm2_button.sm2_playing, +a.sm2_button.sm2_playing:hover { + background-color:#cc3333; +} + +a.sm2_button.sm2_playing, +a.sm2_button.sm2_playing:hover { + -moz-transform:rotate(90deg); + -webkit-transform:rotate(90deg); +} + +a.sm2_button.sm2_paused, +a.sm2_button.sm2_paused:hover { + background-color:#666; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.gif b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.gif new file mode 100644 index 0000000..3b4900e Binary files /dev/null and b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.gif differ diff --git a/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.png b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.png new file mode 100644 index 0000000..fc55124 Binary files /dev/null and b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-black.png differ diff --git a/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.gif b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.gif new file mode 100644 index 0000000..9e760e1 Binary files /dev/null and b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.gif differ diff --git a/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.png b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.png new file mode 100644 index 0000000..4189094 Binary files /dev/null and b/js/libs/soundmanager/demo/mp3-player-button/image/arrow-right-white.png differ diff --git a/js/libs/soundmanager/demo/mp3-player-button/index.html b/js/libs/soundmanager/demo/mp3-player-button/index.html new file mode 100644 index 0000000..4e01041 --- /dev/null +++ b/js/libs/soundmanager/demo/mp3-player-button/index.html @@ -0,0 +1,188 @@ + + + +SoundManager 2 Demo: Basic MP3 Play Button + + + + + + + + + + + +
+ +

SoundManager 2 / Inline MP3 Player Button

+ +

Basic MP3 Play Button Examples

(also see basic demo.) + +
+ +
+ +
+ +

Inline text, with "play" button

+ +

Example code (link with a sm2_button CSS class):

+
<p> Spare change <a href="/path/to/coins.mp3" title="Play &quot;coins&quot;" class="sm2_button">coins.mp3</a> </p>
+

Renders as:

+
+

Spare change coins.mp3

+

Note that the text inside the link is hidden and replaced with an image, but should be descriptive - or at least should say something generic, like "play".

+
+

Basic MP3 play button, no text

+ +

Code:

+ +
<a href="../_mp3/office_lobby.mp3" title="Play &quot;Office Lobby&quot;" class="sm2_button">Office Lobby</a>
+ +

Renders as:

+

+ Office Lobby +

+

How It Works

+ +

SoundManager 2 intercepts clicks to MP3 links and plays them inline. The script assigns additional CSS classes to the links to indicate their state (playing/paused, etc.)

+ +

Static Examples

+ +

CSS classes are dynamically applied as follows:

+ + + +

Basic CSS

+ +

If you want to make your own UI from scratch, here is the base:

+ +
+ Default + hover state, "click to play":
+
+ a.sm2_button {}
+ a.sm2_button:hover {}
+
+ Playing + hover state, "click to pause":
+
+ a.sm2_button.sm2_playing {}
+ a.sm2_button.sm2_playing:hover {}
+
+ Paused + hover state, "click to resume":
+
+ a.sm2_button.sm2_paused {}
+ a.sm2_button.sm2_paused:hover {}
+
+ +

Other Options

+ +

By default, one sound will be played at a time; you can easily change a "config" object value to turn on playlist-like behaviour (i.e., play the next MP3 when the current one finishes.)

+ +
+
+// (within mp3-player-button.js)
+this.config = {
+ playNext: false // stop after one sound, or play through list until end
+}
+
+ +

I'd like to use this.

+

See this basic demo for reference.

+ +

+ SoundManager 2 project page (not an MP3 link) +

+ +
+ + + diff --git a/js/libs/soundmanager/demo/mp3-player-button/script/mp3-player-button.js b/js/libs/soundmanager/demo/mp3-player-button/script/mp3-player-button.js new file mode 100644 index 0000000..9212714 --- /dev/null +++ b/js/libs/soundmanager/demo/mp3-player-button/script/mp3-player-button.js @@ -0,0 +1,245 @@ +/* + + SoundManager 2 Demo: Play MP3 links via button + ---------------------------------------------- + + http://schillmania.com/projects/soundmanager2/ + + A simple demo making MP3s playable "inline" + and easily styled/customizable via CSS. + + A variation of the "play mp3 links" demo. + + Requires SoundManager 2 Javascript API. + +*/ + +function BasicMP3Player() { + var self = this; + var pl = this; + var sm = soundManager; // soundManager instance + this.excludeClass = 'button-exclude'; // CSS class for ignoring MP3 links + this.links = []; + this.sounds = []; + this.soundsByURL = []; + this.indexByURL = []; + this.lastSound = null; + this.soundCount = 0; + var isIE = (navigator.userAgent.match(/msie/i)); + + this.config = { + playNext: false, // stop after one sound, or play through list until end + autoPlay: false // start playing the first sound right away + } + + this.css = { + // CSS class names appended to link during various states + sDefault: 'sm2_button', // default state + sLoading: 'sm2_loading', + sPlaying: 'sm2_playing', + sPaused: 'sm2_paused' + } + + this.includeClass = this.css.sDefault; + + + this.addEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.addEventListener(evtName,evtHandler,false):o.attachEvent('on'+evtName,evtHandler); + } + + this.removeEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.removeEventListener(evtName,evtHandler,false):o.detachEvent('on'+evtName,evtHandler); + } + + this.classContains = function(o,cStr) { + return (typeof(o.className)!='undefined'?o.className.match(new RegExp('(\\s|^)'+cStr+'(\\s|$)')):false); + } + + this.addClass = function(o,cStr) { + if (!o || !cStr || self.classContains(o,cStr)) return false; + o.className = (o.className?o.className+' ':'')+cStr; + } + + this.removeClass = function(o,cStr) { + if (!o || !cStr || !self.classContains(o,cStr)) return false; + o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),''); + } + + this.getSoundByURL = function(sURL) { + return (typeof self.soundsByURL[sURL] != 'undefined'?self.soundsByURL[sURL]:null); + } + + this.isChildOfNode = function(o,sNodeName) { + if (!o || !o.parentNode) { + return false; + } + sNodeName = sNodeName.toLowerCase(); + do { + o = o.parentNode; + } while (o && o.parentNode && o.nodeName.toLowerCase() != sNodeName); + return (o.nodeName.toLowerCase() == sNodeName?o:null); + } + + this.events = { + + // handlers for sound events as they're started/stopped/played + + play: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLink,this._data.className); + }, + + stop: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = ''; + }, + + pause: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPaused; + pl.addClass(this._data.oLink,this._data.className); + }, + + resume: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLink,this._data.className); + }, + + finish: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = ''; + if (pl.config.playNext) { + var nextLink = (pl.indexByURL[this._data.oLink.href]+1); + if (nextLink1) { + // ignore right-click + return true; + } + var o = self.getTheDamnLink(e); + if (o.nodeName.toLowerCase() != 'a') { + o = self.isChildOfNode(o,'a'); + if (!o) return true; + } + var sURL = o.getAttribute('href'); + if (!o.href || !soundManager.canPlayLink(o) || self.classContains(o,self.excludeClass)) { + return true; // pass-thru for non-MP3/non-links + } + if (!self.classContains(o,self.includeClass)) { + return true; + } + sm._writeDebug('handleClick()'); + var soundURL = (o.href); + var thisSound = self.getSoundByURL(soundURL); + if (thisSound) { + // already exists + if (thisSound == self.lastSound) { + // and was playing (or paused) + thisSound.togglePause(); + } else { + // different sound + thisSound.togglePause(); // start playing current + sm._writeDebug('sound different than last sound: '+self.lastSound.sID); + if (self.lastSound) self.stopSound(self.lastSound); + } + } else { + // create sound + thisSound = sm.createSound({ + id:'basicMP3Sound'+(self.soundCount++), + url:soundURL, + onplay:self.events.play, + onstop:self.events.stop, + onpause:self.events.pause, + onresume:self.events.resume, + onfinish:self.events.finish + }); + // tack on some custom data + thisSound._data = { + oLink: o, // DOM node for reference within SM2 object event handlers + className: self.css.sPlaying + }; + self.soundsByURL[soundURL] = thisSound; + self.sounds.push(thisSound); + if (self.lastSound) { + // stop last sound + self.stopSound(self.lastSound); + } + thisSound.play(); + } + + self.lastSound = thisSound; // reference for next call + + if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') { + e.preventDefault(); + } else { + event.returnValue = false; + } + return false; + } + + this.stopSound = function(oSound) { + soundManager.stop(oSound.sID); + soundManager.unload(oSound.sID); + } + + this.init = function() { + sm._writeDebug('basicMP3Player.init()'); + var oLinks = document.getElementsByTagName('a'); + // grab all links, look for .mp3 + var foundItems = 0; + for (var i=0, j=oLinks.length; i0) { + self.addEventHandler(document,'click',self.handleClick); + if (self.config.autoPlay) { + self.handleClick({target:self.links[0],preventDefault:function(){}}); + } + } + sm._writeDebug('basicMP3Player.init(): Found '+foundItems+' relevant items.'); + } + + this.init(); + +} + +var basicMP3Player = null; + +soundManager.useFlashBlock = true; +soundManager.url = '../../swf/'; // path to directory containing SM2 SWF + +soundManager.onready(function() { + // soundManager.createSound() etc. may now be called + basicMP3Player = new BasicMP3Player(); +}); \ No newline at end of file diff --git a/js/libs/soundmanager/demo/mpc/acoustic-drumkit.xml b/js/libs/soundmanager/demo/mpc/acoustic-drumkit.xml new file mode 100644 index 0000000..3d6606a --- /dev/null +++ b/js/libs/soundmanager/demo/mpc/acoustic-drumkit.xml @@ -0,0 +1,33 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_BD_1.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_BD_1.mp3 new file mode 100644 index 0000000..ac40028 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_BD_1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_FTM2.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_FTM2.mp3 new file mode 100644 index 0000000..a181e07 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_FTM2.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_HHCL.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_HHCL.mp3 new file mode 100644 index 0000000..5833134 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_HHCL.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_HHOP.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_HHOP.mp3 new file mode 100644 index 0000000..679376c Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_HHOP.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_HHPD.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_HHPD.mp3 new file mode 100644 index 0000000..79bf78c Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_HHPD.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_HTM.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_HTM.mp3 new file mode 100644 index 0000000..990d8f1 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_HTM.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_LTM2.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_LTM2.mp3 new file mode 100644 index 0000000..d9c371c Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_LTM2.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_MTM.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_MTM.mp3 new file mode 100644 index 0000000..cadd93e Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_MTM.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_RIM1.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_RIM1.mp3 new file mode 100644 index 0000000..354c35a Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_RIM1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_SN13.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_SN13.mp3 new file mode 100644 index 0000000..319348c Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_SN13.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/AMB_SN_5.mp3 b/js/libs/soundmanager/demo/mpc/audio/AMB_SN_5.mp3 new file mode 100644 index 0000000..baf7a87 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/AMB_SN_5.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/CHINA_1.mp3 b/js/libs/soundmanager/demo/mpc/audio/CHINA_1.mp3 new file mode 100644 index 0000000..18a5142 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/CHINA_1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/CRASH_1.mp3 b/js/libs/soundmanager/demo/mpc/audio/CRASH_1.mp3 new file mode 100644 index 0000000..db77301 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/CRASH_1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/CRASH_5.mp3 b/js/libs/soundmanager/demo/mpc/audio/CRASH_5.mp3 new file mode 100644 index 0000000..4d999f2 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/CRASH_5.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/CRASH_6.mp3 b/js/libs/soundmanager/demo/mpc/audio/CRASH_6.mp3 new file mode 100644 index 0000000..d20ec27 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/CRASH_6.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/RIDE_1.mp3 b/js/libs/soundmanager/demo/mpc/audio/RIDE_1.mp3 new file mode 100644 index 0000000..1e5601c Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/RIDE_1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/RIDE_3.mp3 b/js/libs/soundmanager/demo/mpc/audio/RIDE_3.mp3 new file mode 100644 index 0000000..701e150 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/RIDE_3.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/audio/SPLASH_1.mp3 b/js/libs/soundmanager/demo/mpc/audio/SPLASH_1.mp3 new file mode 100644 index 0000000..77cb0de Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/audio/SPLASH_1.mp3 differ diff --git a/js/libs/soundmanager/demo/mpc/css/mpc.css b/js/libs/soundmanager/demo/mpc/css/mpc.css new file mode 100644 index 0000000..50eda36 --- /dev/null +++ b/js/libs/soundmanager/demo/mpc/css/mpc.css @@ -0,0 +1,164 @@ +/* Demo/example CSS - not needed for general use */ + +body { + background:#000; + font:normal 75% "helvetica neue",helvetica,verdana,arial,tahoma,"times new roman","sans serif"; + color:#fff; + margin:0px; + padding:0px; +} + +#background { + position:absolute; + left:0px; + top:0px; + width:100%; + height:100%; + background:transparent url(http://farm1.static.flickr.com/45/191496680_97cdc5351b_b.jpg) no-repeat 50% 50%; +} + +#site { + position:relative; + z-index:2; + background:rgba(0,0,0,0.5); + padding:1em; +} + +#site h1 { + margin-top:0px; +} + +#site p { + margin:0.5em 0px 0.5em 0px; +} + +#site p:last-child { + margin:0px; +} + +.clear { + float:none; + clear:both; + font-size:1px; + line-height:1px; + height:1px; + overflow:hidden; +} + +#mpc { + position:absolute; + left:50%; + top:50%; + margin-left:-19em; + margin-top:-19em; + width:38em; + _width:37.3em; + border:3px solid #666; + border:3px solid rgba(255,255,255,0.25); + -moz-border-radius:12px; + -webkit-border-radius:12px; + border-radius:12px; + z-index:2; +} + +#mpc #wrapper { + position:relative; + background:#333; + background:rgba(0,0,0,0.5); + padding:0.5em; + -moz-border-radius:12px; + -webkit-border-radius:12px; + border-radius:12px; +} + +#mpc ul { + margin:0px; + padding:0px; + margin-left:2px; + *margin-left:1em; + _margin-left:2px; + padding:2px 0px 2px 0px; +} + +#mpc ul li { + position:relative; + float:left; + display:inline; + width:7em; + height:7em; + margin:0.5em; + background:#999; + border:1px solid rgba(0,0,0,0.75); + -moz-border-radius:2px; + -webkit-border-radius:2px; + border-radius:2px; + font:normal 1em/1em "helvetica",verdana,arial,system; + padding:0.5em; + cursor:pointer; + cursor:hand; + color:#eee; + text-transform:uppercase; + font-weight:bold; +} + +#mpc ul li span { + text-transform:none; + font-weight:normal; + color:#ccc; +} + +#mpc ul li.active { + background:#666; +} + +#mpc ul li div { + /* progress indicator */ + position:absolute; + left:0px; + bottom:1em; + font-size:1em; + line-height:1em; + height:1em; + margin:0px 0px 0px 1em; + width:6em; + background:#888 url(../image/progress.png) no-repeat -256px 0px; + background-repeat:no-repeat; + border:1px solid #666; + visibility:hidden; +} + +#mpc ul li.active div, +#mpc ul li.loading div { + visibility:visible; +} + +#soundmanager-debug { + position:absolute; + right:20px; + bottom:20px; + height:12em; + width:50em; + overflow:auto; + margin-left:1em; +} + +#soundmanager-debug div { + font-size:11px; + font-family: "lucida console",system,terminal,verdana,arial; /* IE doesn't seem to obey short-hand font family here? */ + padding:0px 1em 0.5em 0px; +} + +#mpc-debug, +.note { + color:#999; +} + +#mpc-debug a, +.note a { + color:#6699cc; + text-decoration:none; +} + +#isHTML5 { + display:none; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/mpc/image/progress.png b/js/libs/soundmanager/demo/mpc/image/progress.png new file mode 100644 index 0000000..54f9631 Binary files /dev/null and b/js/libs/soundmanager/demo/mpc/image/progress.png differ diff --git a/js/libs/soundmanager/demo/mpc/index.html b/js/libs/soundmanager/demo/mpc/index.html new file mode 100644 index 0000000..5bc1c65 --- /dev/null +++ b/js/libs/soundmanager/demo/mpc/index.html @@ -0,0 +1,72 @@ + + + +SoundManager 2: A Javascript Sound API - MPC Demo + + + + + + + + + + + + +
+ +
+ +

SoundManager 2: Javascript Drum Machine Demo

+

Trigger the pads to play different sounds.

+

View with debug output

+

Photo: MPC 2500 by .schill on Flickr

+

(If supported): Your browser is cool and is using 100% HTML5 Audio. Look ma, no Flash!

+
+ +
+ +
+ +
    +
  • 1
  • +
  • 2
  • +
  • 3
  • +
  • 4
  • +
+ +
    +
  • q
  • +
  • w
  • +
  • e
  • +
  • r
  • +
+ +
    +
  • a
  • +
  • s
  • +
  • d
  • +
  • f
  • +
+ +
    +
  • z
  • +
  • x
  • +
  • c
  • +
  • v
  • +
+ +
+ +
+ +
+ + + + + + + diff --git a/js/libs/soundmanager/demo/mpc/script/mpc.js b/js/libs/soundmanager/demo/mpc/script/mpc.js new file mode 100644 index 0000000..d51370e --- /dev/null +++ b/js/libs/soundmanager/demo/mpc/script/mpc.js @@ -0,0 +1,137 @@ +// demo-specific code - not needed for general use + +// refer to bottom for initialisation and soundManager tie-ins, however! + +var MPC = function() { + var self = this; + this.idPrefix = 'btn-'; // HTML ID prefix + this.statusWidth = 6; + this.progressWidth = 256; + this.keys = {'1':0,'2':1,'3':2,'4':3,'q':4,'w':5,'e':6,'r':7,'a':8,'s':9,'d':10,'f':11,'z':12,'x':13,'c':14,'v':15} + + // scope within these event handler methods: "this" = SMSound() object instance (see SMSound() in soundmanager.js for reference) + + this.showProgress = function() { + // sound is loading, update bytes received using this.bytesLoaded / this.bytesTotal + if (self._getButton(this.sID).className != 'loading') self._getButton(this.sID).className = 'loading'; // a bit inefficient here.. + self._showStatus(this.sID,this.bytesLoaded,this.bytesTotal); + } + + this.onid3 = function() { + soundManager._writeDebug('mpc.onid3()'); + var oName = null; + for (var oName in this.id3) { + soundManager._writeDebug(oName+': '+this.id3[oName]) // write out name/value ID3 pairs (eg. "artist: Beck") + } + } + + this.onload = function() { + var sID = this.sID; + self._getButton(this.sID).className = ''; + self._getButton(this.sID).title = ('Sound ID: '+this.sID+' ('+this.url+')'); + } + + this.onfinish = function() { + self._getButton(this.sID).className = ''; + self._reset(this.sID); + } + + this.onplay = function() { + self._getButton(this.sID).className = 'active'; + } + + this.whileplaying = function() { + self._showStatus(this.sID,this.position,this.duration); + } + + this._keyHandler = function(e) { + var oEvt = e?e:event; + var sChar = String.fromCharCode(oEvt.keyCode).toLowerCase(); + if (typeof self.keys[sChar] != 'undefined') soundManager.play('s'+self.keys[sChar]); + } + + this._showStatus = function(sID,n1,n2) { + var o = self._getButton(sID).getElementsByTagName('div')[0]; + var offX = (n2>0?(-self.progressWidth+parseInt((n1/n2)*o.offsetWidth)):-self.progressWidth); + o.style.backgroundPosition = offX+'px 0px'; + } + + this._getButton = function(sID) { + return document.getElementById(self.idPrefix+sID); + } + + this._reset = function(sID) { + var id = sID; + self._showStatus(sID,1,1); + setTimeout(function(){self._showStatus(sID,0,0);},200); + } + + this.init = function() { + document.onkeydown = self._keyHandler; + } + +} + +var mpc = new MPC(); + +soundManager.useHTML5Audio = true; // why not. +soundManager.flashVersion = (window.location.toString().match(/#flash8/i)?8:9); +if (soundManager.flashVersion != 8) { + soundManager.useHighPerformance = true; + soundManager.useFastPolling = true; +} +soundManager.url = '../../swf/'; // path to load SWF from (overriding default) +soundManager.bgcolor = '#333333'; +soundManager.wmode = 'transparent'; +soundManager.debugMode = false; +soundManager.consoleOnly = false; +soundManager.useFlashBlock = true; + +soundManager.onready(function() { + + // This is the "onload" equivalent which is called when SoundManager has been initialised (sounds can be created, etc.) + + mpc.init(); + + // set up some default options / event handlers - so all sounds created are given these handlers + + soundManager.defaultOptions.autoLoad = true; + soundManager.defaultOptions.whileloading = mpc.showProgress; + soundManager.defaultOptions.onid3 = mpc.onid3; + soundManager.defaultOptions.onload = mpc.onload; + soundManager.defaultOptions.onplay = mpc.onplay; + soundManager.defaultOptions.whileplaying = mpc.whileplaying; + soundManager.defaultOptions.onfinish = mpc.onfinish; + + if (!soundManager.html5.needsFlash) { + document.getElementById('isHTML5').style.display = 'inline'; + } + var soundURLs = 'AMB_BD_1,AMB_FTM2,AMB_HHCL,AMB_HHOP,AMB_HHPD,AMB_HTM,AMB_LTM2,AMB_MTM,AMB_RIM1,AMB_SN13,AMB_SN_5,CHINA_1,CRASH_1,CRASH_5,CRASH_6,RIDE_1'.split(','); + for (var i=0; i + + +SoundManager 2 Demo: Play MP3 links on a page, "page as playlist" style + + + + + + + + + + + +
+ +

SoundManager 2 / page as a playlist, basic template (flash 8)

+ +
+ +
+ + + +

For alternate themes, add the class to the playlist UL - eg. <ul class="playlist dark"> or <ul class="playlist bubblegum">; the base default is <ul class="playlist">.

+ +

A reminder that if loading from the local filesystem, Flash will deny access to remote (network/internet) URLs by default unless whitelisted via the Flash Player Global Security Settings Page. Some URLs in this example are remote to demonstrate this.

+ +

Note that by default, the Flash 8 version is used and therefore Flash 9-only features such as the VU meter, waveform etc. are not available. Refer to the main "page player" demo for configuration examples, or view the source of page-player.js for the configuration object (similar to that used in SoundManager 2 itself.)

+ +

SoundManager 2 project

+ + + diff --git a/js/libs/soundmanager/demo/page-player/css/demo.css b/js/libs/soundmanager/demo/page-player/css/demo.css new file mode 100644 index 0000000..c7f102c --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/css/demo.css @@ -0,0 +1,124 @@ +/* + ----------------------------------------------------------------- + In-page demo CSS for code, documentation etc. + See page-player.css for actual playlist-relevant stuff. + ----------------------------------------------------------------- + */ + +#soundmanager-debug { + /* SM2 debug container (optional, makes debug more useable) */ + position:absolute;position:fixed;*position:absolute;bottom:10px;right:10px;width:50em;height:18em;overflow:auto;background:#fff;margin:1em;padding:1em;border:1px solid #999;font-family:"lucida console",verdana,tahoma,"sans serif";font-size:x-small;line-height:1.5em;opacity:0.9;filter:alpha(opacity=90);z-index:99; +} + +body { + font:75% normal verdana,arial,tahoma,"sans serif"; +} + +h1, h2, h3 { + font:300 3em "Helvetica Neue",georgia,"times new roman","Arial Rounded MT Bold",helvetica,verdana,tahoma,arial,"sans serif"; + margin-bottom:0px; +} + +h1, h2 { + letter-spacing:-1px; /* zomg web x.0! ;) */ +} + +h1, h2, h3 { + float:left; + clear:both; + border-bottom:1px solid #999; + padding-bottom:1px; + margin-bottom:0.25em; +} + +h1 { + margin-top:0px; + margin-bottom:0px; + background-color:#666; + color:#ccc; + margin-left:-5px; + padding-left:5px; + padding-right:5px; +} + +h1, +h1 a { + color:#fff; + text-decoration:none; +} + +h1 a:hover { + text-decoration:underline; +} + +h2 { + font-size:2em; + margin-top:1em; + background-color:#aaa; + color:#fff; + padding:5px; + margin-left:-5px; + min-width:23em; +} + +h3 { + font-size:1.65em; + margin-top:0.5em; + margin-bottom:0.25em; + color:#333; + min-width:28em; +} + +h3 a { + font-size:small; +} + +h4 { + color:#444; +} + +ul.notes { + margin-left:0px; + padding-left:1.5em; +} + +.note { + margin-top:0px; + font-style:italic; + color:#999; +} + +pre { + font-size:1.2em; + _font-size:1em; +} + +code { + font-family:"lucida console",monaco,courier,terminal,system; + font-size:1em; + color:#003366; +} + +code span { + color:#666; +} + +ul, +p, +pre { + clear:left; + max-width:46em; +} + +ul.tight li { + max-width:44.5em; +} + +ul.playlist { + /* undo the above nonsense */ + max-width:none; +} + +ul.tight { + padding-left:1.5em; +} diff --git a/js/libs/soundmanager/demo/page-player/css/optional-annotations.css b/js/libs/soundmanager/demo/page-player/css/optional-annotations.css new file mode 100644 index 0000000..a629025 --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/css/optional-annotations.css @@ -0,0 +1,168 @@ +/* + ------------------------------------------ + -- annotations (sub-tracks, notes etc.) -- + ------------------------------------------ +*/ + +ul.playlist li a.sm2_link .metadata { + display:none; /* hide by default */ +} + +ul.playlist li.sm2_paused a.sm2_link .metadata, +ul.playlist li.sm2_playing a.sm2_link .metadata { + display:inline; +} + +ul.playlist li ul { + list-style-type:none; + margin:0px; + padding:0px; + position:relative; + font-size:small; + display:none; +} + +ul.playlist li ul li { + position:relative; + margin:0px; + padding:2px 3px; + border:1px solid transparent; + -moz-border-radius:6px; + -khtml-border-radius:6px; + border-radius:6px; + margin-right:1em; + font-family:helvetica,verdana,tahoma,arial,"sans serif"; + font-size:x-small; + font-weight:300; + letter-spacing:0px; + background-color:transparent; + opacity:0.66; +} + +ul.playlist li ul li:hover { + opacity:1; + background-color:#fff; + border-color:#ccc; + color:#666; +} + +ul.playlist li.sm2_playing ul li, +ul.playlist li.sm2_paused ul li { + color:#fff; +} + +ul.playlist li.sm2_playing ul li:hover { + background-color:#fff; + color:#5588bb; + border-color:#336699; + opacity:0.9; +} + +ul.playlist li.sm2_paused ul li:hover { + background-color:#888; +} + +/* metadata */ + +ul.playlist li .metadata .duration { + /* optional timing data */ + display:none; +} + +ul.playlist li .metadata ul li p { + margin:0px; + padding:0px; +} + +ul.playlist li .metadata ul li span { + display:none; +} + +ul.playlist li .controls .statusbar .annotation { + position:absolute; + background-color:transparent; + top:0px; + color:#666; + text-align:right; + margin-left:10px; + height:0.5em; +} + +ul.playlist li .controls .statusbar .annotation:hover { + z-index:12; /* sit on top of note */ +} + +ul.playlist li .controls .statusbar .annotation span.bubble { + /* using · */ + display:inline-block; + background-color:#fff; + border:1px solid #666; + border-radius:6px; + -moz-border-radius:6px; + -webkit-border-radius:6px; +} + +ul.playlist li .controls .statusbar .annotation span { + display:block; + background:transparent url(../image/divot.png) no-repeat 50% 0px; + width:15px; + margin-left:-15px; + height:12px; + text-align:center; +} + +ul.playlist li .controls .statusbar .annotation.alt { + top:auto; + bottom:0px; +} + +ul.playlist li .controls .statusbar .annotation span:hover { + cursor:none; /* Fx3 rules. */ + margin-top:0.1em; +} + +ul.playlist li .controls .statusbar .annotation.alt span:hover { + margin-top:-0.1em; +} + +ul.playlist li .controls .statusbar .annotation.alt span { + background:transparent url(../image/divot-bottom.png) no-repeat 50% bottom; +} + +ul.playlist li .note { + position:absolute; + display:none; + left:0px; + top:0px; + z-index:10; + font-size:x-small; + padding:2px 4px 2px 4px; + width:auto; + color:#666; + background-color:#fff; + border:1px solid #ccc; + border-radius:6px; + -moz-border-radius:6px; + -webkit-border-radius:6px; + font-style:normal; + font-weight:bold; + font-family:arial,tahoma,verdana,"sans serif"; + letter-spacing:0px; + margin-top:1.1em; +} + +ul.playlist li .note.alt { + margin-top:-1.32em; +} + +ul.playlist li .note:hover { + display:block !important; +} + +ul.playlist li .sm2_divider { + font-size:0.75em; +} + +ul.playlist li .sm2_metadata { + font-size:0.65em; +} diff --git a/js/libs/soundmanager/demo/page-player/css/optional-themes.css b/js/libs/soundmanager/demo/page-player/css/optional-themes.css new file mode 100644 index 0000000..96a7730 --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/css/optional-themes.css @@ -0,0 +1,206 @@ +/* + --------------------------------- + -- alternate (optional) themes -- + --------------------------------- +*/ + +ul.playlist.dark li.sm2_playing a { + color:#fff; +} + +ul.playlist.dark li.sm2_playing .timing, +ul.playlist.use-peak.dark li.sm2_playing .peak { + color:#999; +} + +ul.playlist.use-spectrum.dark li.sm2_playing .spectrum-container { + background-color:#222; + border-color:#444; +} + +ul.playlist.use-spectrum.dark li.sm2_playing .spectrum-container .spectrum { + background-color:#999; +} + +ul.playlist.dark li.sm2_paused { + background-color:#333; +} + +ul.playlist.dark li.sm2_paused a { + color:#999; +} + +ul.playlist.dark li.sm2_playing, +ul.playlist.dark li.sm2_playing:hover { + background-color:#333; +} + +ul.playlist.dark li:hover .controls .statusbar { + background-color:#666; +} + +ul.playlist.dark li .controls { + background-color:#333; +} + +ul.playlist.dark li .controls .statusbar { + background-color:#666; + border-color:#444; +} + +ul.playlist.dark li .controls .statusbar .position { + background-color:#111; + border-right:3px solid #111; + border-radius:3px; + -moz-border-radius:3px; + -webkit-border-radius:3px; +} + +ul.playlist.dark li .controls .statusbar .loading { + background-color:#444; +} + +ul.playlist.dark li .timing, +ul.playlist.use-peak.dark li .peak { + background-color:#222; + border-color:#444; +} + +ul.playlist.dark.use-peak li .peak .l, +ul.playlist.dark.use-peak li .peak .r { + border-color:#444; + background-color:#999; +} + + +/* gold theme */ + +ul.playlist.gold li.sm2_paused { + background-color:#996600; +} + +ul.playlist.gold li.sm2_playing, +ul.playlist.gold li.sm2_playing:hover { + background-color:#cc9900; +} + +ul.playlist.gold li .controls { + background-color:transparent; +} + +ul.playlist.gold li .controls .statusbar { + background-color:#fff; + border-color:#fff; +} + +ul.playlist.gold li .controls .statusbar .position { + background-color:#996600; + border-right:3px solid #996600; + border-radius:3px; + -moz-border-radius:3px; + -webkit-border-radius:3px; +} + +ul.playlist.gold li .controls .statusbar .loading { + background-color:#ffeedd; +} + +ul.playlist.gold li .timing, +ul.playlist.use-peak.gold li .peak { + background-color:#CC9900; + border-color:#ffcc33; +} + +ul.playlist.use-spectrum.gold li.sm2_playing .spectrum-container { + background-color:#cc9900; + border-color:#ffcc33; +} + +ul.playlist.use-spectrum.gold li.sm2_playing .spectrum-container .spectrum { + background-color:#fff; +} + +ul.playlist.gold.use-peak li .peak .l, +ul.playlist.gold.use-peak li .peak .r { + border-color:#fff; + background-color:#fff; +} + + +/* ZOMG PONIES!!!ONEONEONE */ + +ul.playlist.bubblegum li a { + font-family:"comic sans ms",verdana,arial,tahoma,"sans serif"; /* heh */ +} + +ul.playlist.bubblegum li.sm2_paused, +ul.playlist.bubblegum li.sm2_paused:hover { + background-color:#ffccee; +} + +ul.playlist.bubblegum li.sm2_paused a, +ul.playlist.bubblegum li.sm2_paused:hover a, +ul.playlist.bubblegum li.sm2_paused .timing, +ul.playlist.use-peak.bubblegum li.sm2_paused .peak { + color:#ff6699; +} + +ul.playlist.bubblegum li:hover { + background-color:#ffddee; +} + +ul.playlist.bubblegum li.sm2_playing, +ul.playlist.bubblegum li.sm2_playing:hover { + background-color:#ff7799; +} + +ul.playlist.bubblegum li .controls { + background-color:transparent; +} + +ul.playlist.bubblegum li .controls .statusbar { + background-color:#fff; + border-color:#fff; +} + +ul.playlist.bubblegum li .controls .statusbar .position { + background-color:#ffaacc; + border-right:3px solid #ffaacc; + border-radius:3px; + -moz-border-radius:3px; + -webkit-border-radius:3px; +} + +ul.playlist.bubblegum li .controls .statusbar .loading { + background-color:#ffeedd; +} + +ul.playlist.bubblegum li .timing, +ul.playlist.use-peak.bubblegum li .peak { + background-color:#ffaacc; + border-color:#ffccee; +} + +ul.playlist.use-spectrum.bubblegum li.sm2_playing .spectrum-container { + background-color:#ffaacc; + border-color:#ffccee; +} + +ul.playlist.use-spectrum.bubblegum li.sm2_playing .spectrum-container .spectrum { + background-color:#fff; +} + +ul.playlist.bubblegum.use-peak li .peak .l, +ul.playlist.bubblegum.use-peak li .peak .r { + border-color:#fff; + background-color:#fff; +} + + +ul.playlist.shiny li.sm2_paused, +ul.playlist.shiny li.sm2_playing { + background-image:url(../image/top-highlight.png); + background-repeat:repeat-x; + background-position:0px -1px; + _background-image:none; /* can't be bothered with IE 6. */ +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/page-player/css/page-player.css b/js/libs/soundmanager/demo/page-player/css/page-player.css new file mode 100644 index 0000000..0881442 --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/css/page-player.css @@ -0,0 +1,320 @@ +/* + + SoundManager 2: "page as playlist" example + ------------------------------------------ + http://schillmania.com/projects/soundmanager2/ + +*/ + +.spectrum-container { + display:none; +} + +ul.use-spectrum li.sm2_playing .spectrum-container { + position:absolute; + left:0px; + top:0px; + margin-left:-266px; + margin-top:-1px; + display:block; + background-color:#5588bb; + border:1px solid #99ccff; + -moz-border-radius:4px; + -webkit-border-radius:4px; + border-radius:4px; +} + +ul.use-spectrum .spectrum-box { + position:relative; + width:255px; + font-size:1em; + padding:2px 0px; + height:1.2em; + overflow:hidden; +} + +ul.use-spectrum .spectrum-box .spectrum { + position:absolute; + left:0px; + top:-2px; + margin-top:20px; + display:block; + font-size:1px; + width:1px; + height:1px; /* set to 50px for a thick line, 1px for a thin line, etc. */ + overflow:hidden; + background-color:#fff; +} + +ul.playlist { + list-style-type:none; + margin:0px; + padding:0px; + +} + +ul.playlist li { + /* assume all items will be sounds rather than wait for onload etc. in this example.. may differ for your uses. */ + position:relative; + display:block; + width:auto; + font-size:2em; + color:#666; + padding:0.25em 0.5em 0.25em 0.5em; + border:none; + letter-spacing:-1px; /* ZOMG WEB X.0. ;) */ + background-color:#f9f9f9; + -webkit-transition-property: hover; + -webkit-transition: background-color 0.15s ease-in-out; + -moz-transition: background-color 0.15s linear 0s; /* firefox 4 */ + -o-transition-property: background-color; /* opera 10.5 */ + -o-transition-duration: 0.15s; + +} + +ul.playlist li a { + display:block; + text-decoration:none; + font-weight:normal; + color:#000; + font-size:120%; + outline:none; + position:relative; + z-index:2; +} + +ul.playlist li.sm2_playing, +ul.playlist li.sm2_paused, +ul.playlist li.sm2_playing a { + color:#fff; + border-radius:3px; + -webkit-border-radius:3px; + -moz-border-radius:3px; +} + +ul.playlist li:hover { + background-color:#eee; +} + +ul.playlist li:hover a { + color:#333; +} + +ul.playlist li.sm2_playing, +ul.playlist li.sm2_playing:hover { + background-color:#6699cc; +} + +ul.playlist li.sm2_paused { + background-color:#999; +} + +ul.playlist li.sm2_playing:hover a, +ul.playlist li.sm2_paused a { + color:#fff; +} + +ul.playlist li .controls { + display:none; +} + +ul.playlist li .peak, +ul.playlist.use-peak li .peak { + display:none; + position:absolute; + top:0.55em; + right:0.5em; +} + +ul.playlist li.sm2_playing .controls, +ul.playlist li.sm2_paused .controls { + position:relative; + display:block; +} + +ul.playlist.use-peak li.sm2_playing .peak, +ul.playlist.use-peak li.sm2_paused .peak { + display:inline; + display:inline-block; +} + +ul.playlist.use-peak li .peak { + display:none; /* IE 7 */ +} + +ul.playlist li.sm2_paused .controls { + background-color:#666; +} + +ul.playlist li:hover .controls .statusbar { + position:relative; + cursor:ew-resize; + cursor:-moz-grab; + cursor:grab; +} + +ul.playlist li.sm2_paused .controls .statusbar { + background-color:#ccc; +} + +ul.playlist li .controls { + position:relative; + margin-top:0.25em; + margin-bottom:0.25em; + background-color:#99ccff; +} + +ul.playlist li .controls .statusbar { + position:relative; + height:0.5em; + background-color:#ccddff; + border:2px solid #fff; + border-radius:2px; + -moz-border-radius:2px; + -webkit-border-radius:2px; + overflow:hidden; + cursor:-moz-grab; + cursor:grab; +} + +ul.playlist li .controls.dragging .statusbar { + cursor:-moz-grabbing; + cursor:grabbing; +} + +ul.playlist li .controls .statusbar .position, +ul.playlist li .controls .statusbar .loading, +ul.playlist li .controls .statusbar .annotation { + position:absolute; + left:0px; + top:0px; + height:0.5em; +} + +ul.playlist li .controls .statusbar .position { + background-color:#336699; + border-right:3px solid #336699; + border-radius:3px; + -moz-border-radius:3px; + -webkit-border-radius:3px; +} + +ul.playlist li.sm2_paused .controls .statusbar .position { + background-color:#666; + border-color:#666; +} + +ul.playlist li .controls .statusbar .loading { + background-color:#eee; +} + +ul.playlist li .controls .statusbar .position, +ul.playlist li .controls .statusbar .loading { + width:0px; +} + +ul.playlist li.sm2_playing a.sm2_link, +ul.playlist li.sm2_paused a.sm2_link { + margin-right:4.5em; /* room for timing stuff */ +} + +ul.playlist li .timing { + position:absolute; + display:none; + text-align:right; + right:1em; + top:1em; + width:auto; + height:1em; + padding:3px 5px; + background-color:#5588bb; + border:1px solid #99ccff; + -moz-border-radius:4px; + -khtml-border-radius:4px; + border-radius:4px; + letter-spacing:0px; + font:44% monaco,"VT-100",terminal,"lucida console",courier,system; + line-height:1em; + vertical-align:middle; +} + +ul.playlist.use-peak li .timing { + right:4.25em; +} + +ul.playlist li:hover .timing { + z-index:2; +} + +ul.playlist li .timing div.sm2_timing { + margin:0px; + padding:0px; + margin-top:-1em; +} + +ul.playlist li.sm2_playing .timing, +ul.playlist li.sm2_paused .timing { + display:block; +} + +ul.playlist li.sm2_paused .timing .sm2_position { + text-decoration:blink; /* hee hee. first actual appropriate use? :D */ +} + +ul.playlist li.sm2_paused .timing, +ul.playlist.use-peak li.sm2_paused .peak { + background-color:#888; + border-color:#ccc; +} + +/* peak data */ + +/* ul.playlist ... */ + +ul.playlist.use-peak li .peak { + display:none; + zoom:1; + border:1px solid #99ccff; + padding:2px; + height:0.55em; + -moz-border-radius:4px; + -khtml-border-radius:4px; + border-radius:4px; + background-color:#5588bb; + width:0.8em; + height:0.55em; + margin-top:-3px; +} + +ul.playlist.use-peak li .peak-box { + position:relative; + width:100%; + height:0.55em; + overflow:hidden; +} + +ul.playlist li .peak .l, +ul.playlist li .peak .r { + position:absolute; + left:0px; + top:0px; + width:7px; + height:50px; + background:#fff; + border:1px solid #fff; + -moz-border-radius:1px; + -khtml-border-radius:1px; + margin-top:1em; +} + +ul.playlist li .peak .l { + margin-right:1px; +} + +ul.playlist li .peak .r { + left:10px; +} + +#control-template { + display:none; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/page-player/image/divot-bottom.png b/js/libs/soundmanager/demo/page-player/image/divot-bottom.png new file mode 100644 index 0000000..05b1dff Binary files /dev/null and b/js/libs/soundmanager/demo/page-player/image/divot-bottom.png differ diff --git a/js/libs/soundmanager/demo/page-player/image/divot.png b/js/libs/soundmanager/demo/page-player/image/divot.png new file mode 100644 index 0000000..fbcf930 Binary files /dev/null and b/js/libs/soundmanager/demo/page-player/image/divot.png differ diff --git a/js/libs/soundmanager/demo/page-player/image/top-highlight.png b/js/libs/soundmanager/demo/page-player/image/top-highlight.png new file mode 100644 index 0000000..f88668d Binary files /dev/null and b/js/libs/soundmanager/demo/page-player/image/top-highlight.png differ diff --git a/js/libs/soundmanager/demo/page-player/index.html b/js/libs/soundmanager/demo/page-player/index.html new file mode 100644 index 0000000..9295556 --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/index.html @@ -0,0 +1,372 @@ + + + +SoundManager 2 Demo: Play MP3 links on a page, "page as playlist" style + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +

SoundManager 2 / "Page as a playlist"

+ +

Muxtape.com-style UI, MP3/AAC Player Example

+ +

This page uses shiny features which require Flash 9. The default config uses Flash 8.

+ +

You can also try enabling experimental visualization features.

+ +
+ +
+ + + +

MPEG4 / H.264 + HE-AAC (Flash "MovieStar" 9.0r115+) format support - audio-only example

+

A subset of MPEG4 is supported including AAC, FLV, MP4, M4A, MOV, MP4V, 3GP and 3G2 files.

+ + + +

Basics

+ +

Don't want a Flash 9 requirement, EQ/waveform, perhaps less CPU? See Flash 8-based basic demo.

+ +

Clicking a title will start loading + playing, or pause, a sound.

+

Once loading, click (or click and drag) on the loading/position bar to seek within the sound.

+

The document title reflects the currently-playing sound, and by default the list will play sequentially if left alone. (This is configurable.)

+ +

Themes

+

Just for fun, a few color schemes (visible when playing/paused):

+ + +
+
+ +
+
+ + +

Experimental (Alpha) Variant: MP3 "Metadata": Annotations / notes / sub-tracks

+

A potential approach to noting interesting moments in sounds, scene changes, new tracks in seamless DJ mixes etc. Keep in mind this is a single MP3 being loaded, but annotations are placed along the timeline as shown.

+

A "metadata" element contains a nested list of data (UL/LI combination) - in this case, a summary of each scene - and the time at which this item occurs/begins. In order to help with positioning, the total length of the sound is also specified up-front. View the source code of this page for the details.

+ +
    + +
  • + A Virtual Haircut (3 scenes) + +
  • + +
  • + Rubber Chicken Launch (Office) + +
  • + +
+ +

How It Works

+ +

This example uses SoundManager 2 to find links to MP3 files within an unordered list, and makes them playable "in-place" on a page. The script assigns CSS classes to links' parent LI nodes to indicate their state (playing/paused, etc.)

+ +

Progressive Enhancement

+ +

This provides a nice HTML base for all browsers and user agents, and enhances progressively for those with Javascript and Flash. Links pointing to MP3s are assigned an onclick handler which intercepts the click (preventing the browser from following the link and unloading the page. SM2 will then create sound objects as needed to play the MP3s. In the event there is an error at runtime or a lack of support (no JS/Flash etc.), the browser will simply load the MP3s directly as it normally would. This includes iPhones, etc.

+ +

HTML Fragments (UI Element Templates)

+

Each item in the playlist has its own set of controls and progress indicators, etc. This content is defined once as a hidden template of HTML in the player JavaScript file, separate from the playlist markup, and is cloned for each item as needed. This can be easily styled with CSS as well, of course.

+ +

I'd like to use this.

+

See this basic demo for reference.

+

The basic demo uses the default Flash 8 configuration, but you can easily change this to use Flash 9 features. The only difference in code is the configuration.

+ +

A reminder that if loading from the local filesystem, Flash will deny access to remote (network/internet) URLs by default unless whitelisted via the Flash Player Global Security Settings Page. Some URLs in this example are remote to demonstrate this.

+ +

Configuration + Options

+ +

Default configuration

+ +

Behaviours such as auto-start and UI elements like VU meters and spectrum graphs are easy configurable, using an object literal format as shown below.

+

The page player config (see related page-player.js file) as below.

+

The custom parameters used to make this demo page are highlighted in red.

+
  // ( within page-player.js )
+
+  soundManager.flashVersion = 9; // If you need flash 9, include this line.
+
+  this.config = {
+    usePeakData: true,     // [Flash 9 only] show peak (VU-meter) data
+    useFavIcon: true,      // try to show peakData in address bar (Firefox + Opera) - requires usePeakData = true too, of course.
+    useWaveformData: true, // [Flash 9 only] true: show raw waveform data - WARNING: CPU-intensive
+    useEQData: false,      // [Flash 9 only] show EQ (frequency spectrum) data - WARNING: CPU-intensive
+    fillGraph: false,      // [Flash 9 only] draw full lines instead of only top (peak) spectrum points
+    allowRightClick:true,  // let users right-click MP3 links ("save as...", etc.) or discourage (can't prevent.)
+    useThrottling: false,  // try to rate-limit potentially-expensive calls (eg. dragging position around)
+    autoStart: false,      // begin playing first sound when page loads
+    playNext: true,        // stop after one sound, or play through list until end
+    updatePageTitle: true, // change the page title while playing sounds
+    emptyTime: '-:--'      // null/undefined timer values (before data is available)
+  }
+
+ +

Per-page configuration override

+ +

Alternately, you may override the defaults on a per-page basis by defining an "alternate configuration" object before the page-player.js file has been included in your source code:

+ +
  // ( before soundManager.onready()/onload() have fired )
+
+  soundManager.flashVersion = 9; // If you need flash 9, include this line.
+
+  var PP_CONFIG = {
+    usePeakData: true,     // [Flash 9 only] whether or not to show peak data (no notable CPU cost)
+    useWaveformData: true  // [Flash 9 only] show raw waveform data. WARNING: Experimental, likely CPU-heavy
+  }
+ +

Any options specified in PP_CONFIG will override the defaults defined in page-player.js.

+ +

Basic CSS

+ +
+ If you want to make your own UI from scratch, here is the base:
+
+ ul.playlist {}
+
+ Default + hover state, "click to play":
+
+ li.sm2_link {}
+ li.sm2_link:hover {}
+
+ Playing + hover state, "click to pause":
+
+ li.sm2_playing {}
+ li.sm2_playing:hover {}
+
+ Paused + hover state, "click to resume":
+
+ li.sm2_paused {}
+ li.sm2_paused:hover {}
+
+ +

The positioning (load status / control bar) template is also applied after each MP3 link, from an element named "control-template"

+ +

"loading" and "position" have background colors applied, and have their width adjusted dynamically by SM2 as the sound(s) load/play. "timing" is replaced with the current time / duration, eg. 1:23 / 4:20

+

The class names applied can be edited within the source JS also, for convenience.

+

The controls are shown and hidden via the same dynamic CSS updates. See the source CSS for the timing / status bar layout.

+ +

Performance Considerations

+

Experimental Flash 9 features

+
    +
  • +

    Dynamic "favicon" VU meter

    +

    The VU meter "favicon" option as shown in the address/location bar for Firefox and Opera can cause a lot of disk access in Firefox (2.x/3.0 at time of writing, from what has been reported.) It may be garbage collection-related.

    +

    The behaviour seems to be connected to the dynamic swapping of <link> elements with data: URIs containing the VU meter data, and looks to be noticeable with the first sound played - after which point things settle down. Perhaps the browser is attempting to cache the favicon data being assigned.

    +
  • +
  • +

    Waveform/spectrum visualization graph

    +

    Enabling the waveformData and/or eqData features will result in some heavy DOM calls (manipulation of 256 <div> elements with each "frame" drawn) which can eat up a good amount of CPU and may make really old computers cower in fear.

    +

    Ultimately, the UI refresh rate will simply be limited if a CPU ceiling is hit, and audio playback should not be affected.

    +
  • +
+ +

More CSS comments

+ +
+
+
+ SoundManager 2: "page as playlist" example
+ ------------------------------------------
+
+ Clicks on links to MP3s are intercepted via JS, calls are
+ made to SoundManager to load/play sounds. CSS classes are
+ appended to the LI parent, which are used to highlight the
+ current play state and so on.
+
+ Class names are applied in addition to "sm2_link" base.
+
+ Default:
+
+ sm2_link
+
+ Additional states:
+
+ sm2_playing
+ sm2_paused
+
+ eg.
+
+ <!-- default -->
+ <li class="sm2_link"><a href="some.mp3">some.mp3</a></li>
+
+ <!-- playing -->
+ <li class="sm2_link sm2_playing"><a href="some.mp3">some.mp3</a></li>
+
+ The script also injects an HTML template containing control bar
+ and timing elements, which can also be targeted with CSS.
+
+
+ Note you don't necessarily require ul.playlist for your use
+ if only using one style on a page. You can just use .sm2_link
+ and so on, but isolate the CSS you want.
+
+ Side note: Would do multiple class definitions eg.
+
+ li.sm2_default.sm2_playing{}
+
+ .. except IE 6 has a parsing bug which may break behaviour,
+ applying sm2_playing {} even when the class is set to sm2_default.
+
+
+ If you want to make your own UI from scratch, here is the base:
+
+ Default + hover state, "click to play":
+
+ li.sm2_link {}
+ li.sm2_link:hover {}
+
+ Playing + hover state, "click to pause":
+
+ li.sm2_playing {}
+ li.sm2_playing:hover {}
+
+ Paused + hover state, "click to resume":
+
+ li.sm2_paused {}
+ li.sm2_paused:hover {}
+
+
+ +

SoundManager 2 project home

+ +
+ + + + + + diff --git a/js/libs/soundmanager/demo/page-player/script/optional-page-player-metadata.js b/js/libs/soundmanager/demo/page-player/script/optional-page-player-metadata.js new file mode 100644 index 0000000..0faa0e3 --- /dev/null +++ b/js/libs/soundmanager/demo/page-player/script/optional-page-player-metadata.js @@ -0,0 +1,142 @@ +// SoundManager 2: Page Player demo, MetaData UI prototype + +/*jslint white: false, onevar: true, undef: true, nomen: false, eqeqeq: true, plusplus: false, bitwise: true, newcap: true, immed: true */ +/*global pagePlayer, document, window */ + +var Metadata = function(oSound) { + + var self = this, + pl = pagePlayer, + oLI = oSound._data.oLI, + o = oLI.getElementsByTagName('ul')[0], + oItems = o.getElementsByTagName('li'), + oTemplate = document.createElement('div'), + oTemplate2 = document.createElement('div'), + oTemplate3 = document.createElement('div'), + oDuration, i; + + oTemplate.innerHTML = ' '; + oTemplate.className = 'annotation'; + oTemplate2.innerHTML = ' '; + oTemplate2.className = 'annotation alt'; + oTemplate3.className = 'note'; + + this.totalTime = 0; + this.data = []; + this.data.givenDuration = null; + this.data.currentItem = null; + this.data.mainTitle = oSound._data.oLink.innerHTML; + + this.strToTime = function(sTime) { + var segments = sTime.split(':'), + seconds = 0, i; + for (i=segments.length; i--;) { + seconds += parseInt(segments[i],10)*Math.pow(60,segments.length-1-i); // hours, minutes + } + return seconds; + }; + + // make stuff + this.createElements = function() { + var oFrag = document.createDocumentFragment(), + oNode = null, + oNodeSpan = null, + oNode2 = null, i; + for (i=0; i= metadata[i].startTimeMS && now <= metadata[i].endTimeMS) { + index = i; + break; + } + } + if (index !== metadata.currentItem) { + // update + oSound._data.oLink.innerHTML = metadata.mainTitle+' '; + pl.setPageTitle(metadata[index].title+' | '+metadata.mainTitle); + metadata.currentItem = index; + } + }; + + this.refresh = function() { + var offset = 0, + relWidth = null, + duration = (self.data.givenDuration?self.data.givenDuration:oSound.durationEstimate), i; + for (i=0; i 3) { + args.pop(); // no capture + } + } else if (len === 3) { + args.push(false); + } + return args; + } + + function apply(args, sType) { + var element = args.shift(), + method = [evt[sType]]; + if (old) { + element[method](args[0], args[1]); + } else { + element[method].apply(element, args); + } + } + + function add() { + apply(getArgs(arguments), 'add'); + } + + function remove() { + apply(getArgs(arguments), 'remove'); + } + + return { + 'add': add, + 'remove': remove + }; + + }()); + + this.hasClass = function(o, cStr) { + return (typeof(o.className)!=='undefined'?new RegExp('(^|\\s)'+cStr+'(\\s|$)').test(o.className):false); + }; + + this.addClass = function(o, cStr) { + if (!o || !cStr || self.hasClass(o,cStr)) { + return false; // safety net + } + o.className = (o.className?o.className+' ':'')+cStr; + }; + + this.removeClass = function(o, cStr) { + if (!o || !cStr || !self.hasClass(o,cStr)) { + return false; + } + o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),''); + }; + + this.select = function(className, oParent) { + var result = self.getByClassName(className, 'div', oParent||null); + return (result ? result[0] : null); + }; + + this.getByClassName = (document.querySelectorAll ? function(className, tagNames, oParent) { // tagNames: string or ['div', 'p'] etc. + + var pattern = ('.'+className), qs; + if (tagNames) { + tagNames = tagNames.split(' '); + } + qs = (tagNames.length > 1 ? tagNames.join(pattern+', ') : tagNames[0]+pattern); + return (oParent?oParent:document).querySelectorAll(qs); + + } : function(className, tagNames, oParent) { + + var node = (oParent?oParent:document), matches = [], i, j, nodes = []; + if (tagNames) { + tagNames = tagNames.split(' '); + } + if (tagNames instanceof Array) { + for (i=tagNames.length; i--;) { + if (!nodes || !nodes[tagNames[i]]) { + nodes[tagNames[i]] = node.getElementsByTagName(tagNames[i]); + } + } + for (i=tagNames.length; i--;) { + for (j=nodes[tagNames[i]].length; j--;) { + if (self.hasClass(nodes[tagNames[i]][j], className)) { + matches.push(nodes[tagNames[i]][j]); + } + } + } + } else { + nodes = node.all||node.getElementsByTagName('*'); + for (i=0, j=nodes.length; i playlist item, find next
  • and then + if (o.nextElementSibling) { + o = o.nextElementSibling; + } else { + o = o.nextSibling; // move from original node.. + while (o && o.nextSibling && o.nextSibling.nodeType !== 1) { + o = o.nextSibling; + } + } + if (o.nodeName.toLowerCase() !== 'li') { + return null; + } else { + return o.getElementsByTagName('a')[0]; + } + }; + + this.playNext = function(oSound) { + if (!oSound) { + oSound = self.lastSound; + } + if (!oSound) { + return false; + } + var nextItem = self.getNextItem(oSound._data.oLI); + if (nextItem) { + pl.handleClick({target:nextItem}); // fake a click event - aren't we sneaky. ;) + } + return nextItem; + }; + + this.setPageTitle = function(sTitle) { + if (!self.config.updatePageTitle) { + return false; + } + try { + document.title = (sTitle?sTitle+' - ':'')+self.pageTitle; + } catch(e) { + // oh well + self.setPageTitle = function() { + return false; + }; + } + }; + + this.events = { + + // handlers for sound events as they're started/stopped/played + + play: function() { + pl.removeClass(this._data.oLI,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLI,this._data.className); + self.setPageTitle(this._data.originalTitle); + }, + + stop: function() { + pl.removeClass(this._data.oLI,this._data.className); + this._data.className = ''; + this._data.oPosition.style.width = '0px'; + self.setPageTitle(); + self.resetPageIcon(); + }, + + pause: function() { + if (pl.dragActive) { + return false; + } + pl.removeClass(this._data.oLI,this._data.className); + this._data.className = pl.css.sPaused; + pl.addClass(this._data.oLI,this._data.className); + self.setPageTitle(); + self.resetPageIcon(); + }, + + resume: function() { + if (pl.dragActive) { + return false; + } + pl.removeClass(this._data.oLI,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLI,this._data.className); + }, + + finish: function() { + pl.removeClass(this._data.oLI,this._data.className); + this._data.className = ''; + this._data.oPosition.style.width = '0px'; + // play next if applicable + if (self.config.playNext) { + pl.playNext(this); + } else { + self.setPageTitle(); + self.resetPageIcon(); + } + }, + + whileloading: function() { + function doWork() { + this._data.oLoading.style.width = (((this.bytesLoaded/this.bytesTotal)*100)+'%'); // theoretically, this should work. + if (!this._data.didRefresh && this._data.metadata) { + this._data.didRefresh = true; + this._data.metadata.refresh(); + } + } + if (!pl.config.useThrottling) { + doWork.apply(this); + } else { + var d = new Date(); + if (d && d-self.lastWLExec>30 || this.bytesLoaded === this.bytesTotal) { + doWork.apply(this); + self.lastWLExec = d; + } + } + + }, + + onload: function() { + if (!this.loaded) { + var oTemp = this._data.oLI.getElementsByTagName('a')[0], + oString = oTemp.innerHTML, + oThis = this; + oTemp.innerHTML = oString+' | Load failed, d\'oh! '+(sm.sandbox.noRemote?' Possible cause: Flash sandbox is denying remote URL access.':(sm.sandbox.noLocal?'Flash denying local filesystem access':'404?'))+''; + setTimeout(function(){ + oTemp.innerHTML = oString; + // pl.events.finish.apply(oThis); // load next + },5000); + } else { + if (this._data.metadata) { + this._data.metadata.refresh(); + } + } + }, + + whileplaying: function() { + var d = null; + if (pl.dragActive || !pl.config.useThrottling) { + self.updateTime.apply(this); + if (sm.flashVersion >= 9) { + if (pl.config.usePeakData && this.instanceOptions.usePeakData) { + self.updatePeaks.apply(this); + } + if (pl.config.useWaveformData && this.instanceOptions.useWaveformData || pl.config.useEQData && this.instanceOptions.useEQData) { + self.updateGraph.apply(this); + } + } + if (this._data.metadata) { + d = new Date(); + if (d && d-self.lastWPExec>500) { + this._data.metadata.refreshMetadata(this); + self.lastWPExec = d; + } + } + this._data.oPosition.style.width = (((this.position/self.getDurationEstimate(this))*100)+'%'); + } else { + d = new Date(); + if (d-self.lastWPExec>30) { + self.updateTime.apply(this); + if (sm.flashVersion >= 9) { + if (pl.config.usePeakData && this.instanceOptions.usePeakData) { + self.updatePeaks.apply(this); + } + if (pl.config.useWaveformData && this.instanceOptions.useWaveformData || pl.config.useEQData && this.instanceOptions.useEQData) { + self.updateGraph.apply(this); + } + } + if (this._data.metadata) { + this._data.metadata.refreshMetadata(this); + } + this._data.oPosition.style.width = (((this.position/self.getDurationEstimate(this))*100)+'%'); + self.lastWPExec = d; + } + } + } + + }; // events{} + + this.setPageIcon = function(sDataURL) { + if (!self.config.useFavIcon || !self.config.usePeakData || !sDataURL) { + return false; + } + var link = document.getElementById('sm2-favicon'); + if (link) { + _head.removeChild(link); + link = null; + } + if (!link) { + link = document.createElement('link'); + link.id = 'sm2-favicon'; + link.rel = 'shortcut icon'; + link.type = 'image/png'; + link.href = sDataURL; + document.getElementsByTagName('head')[0].appendChild(link); + } + }; + + this.resetPageIcon = function() { + if (!self.config.useFavIcon) { + return false; + } + var link = document.getElementById('favicon'); + if (link) { + link.href = '/favicon.ico'; + } + }; + + this.updatePeaks = function() { + var o = this._data.oPeak, + oSpan = o.getElementsByTagName('span'); + oSpan[0].style.marginTop = (13-(Math.floor(15*this.peakData.left))+'px'); + oSpan[1].style.marginTop = (13-(Math.floor(15*this.peakData.right))+'px'); + if (sm.flashVersion > 8 && self.config.useFavIcon && self.config.usePeakData) { + self.setPageIcon(self.vuMeterData[parseInt(16*this.peakData.left,10)][parseInt(16*this.peakData.right,10)]); + } + }; + + this.updateGraph = function() { + if (pl.config.flashVersion < 9 || (!pl.config.useWaveformData && !pl.config.useEQData)) { + return false; + } + var sbC = this._data.oGraph.getElementsByTagName('div'), + scale, i, offset; + if (pl.config.useWaveformData) { + // raw waveform + scale = 8; // Y axis (+/- this distance from 0) + for (i=255; i--;) { + sbC[255-i].style.marginTop = (1+scale+Math.ceil(this.waveformData.left[i]*-scale))+'px'; + } + } else { + // eq spectrum + offset = 9; + for (i=255; i--;) { + sbC[255-i].style.marginTop = ((offset*2)-1+Math.ceil(this.eqData[i]*-offset))+'px'; + } + } + }; + + this.resetGraph = function() { + if (!pl.config.useEQData || pl.config.flashVersion<9) { + return false; + } + var sbC = this._data.oGraph.getElementsByTagName('div'), + scale = (!pl.config.useEQData?'9px':'17px'), + nHeight = (!pl.config.fillGraph?'1px':'32px'), + i; + for (i=255; i--;) { + sbC[255-i].style.marginTop = scale; // EQ scale + sbC[255-i].style.height = nHeight; + } + }; + + this.updateTime = function() { + var str = self.strings.timing.replace('%s1',self.getTime(this.position,true)); + str = str.replace('%s2',self.getTime(self.getDurationEstimate(this),true)); + this._data.oTiming.innerHTML = str; + }; + + this.getTheDamnTarget = function(e) { + return (e.target||(window.event?window.event.srcElement:null)); + }; + + this.withinStatusBar = function(o) { + return (self.isChildOfClass(o,'controls')); + }; + + this.handleClick = function(e) { + + // a sound (or something) was clicked - determine what and handle appropriately + + if (e.button === 2) { + if (!pl.config.allowRightClick) { + pl.stopEvent(e); + } + return pl.config.allowRightClick; // ignore right-clicks + } + var o = self.getTheDamnTarget(e), + sURL, soundURL, thisSound, oControls, oLI, str; + if (!o) { + return true; + } + if (self.dragActive) { + self.stopDrag(); // to be safe + } + if (self.withinStatusBar(o)) { + // self.handleStatusClick(e); + return false; + } + if (o.nodeName.toLowerCase() !== 'a') { + o = self.getParentByNodeName(o,'a'); + } + if (!o) { + // not a link + return true; + } + + // OK, we're dealing with a link + + sURL = o.getAttribute('href'); + + if (!o.href || (!sm.canPlayLink(o) && !self.hasClass(o,'playable')) || self.hasClass(o,'exclude')) { + + // do nothing, don't return anything. + return true; + + } else { + + // we have something we're interested in. + + // find and init parent UL, if need be + self.initUL(self.getParentByNodeName(o, 'ul')); + + // and decorate the link too, if needed + self.initItem(o); + + soundURL = o.href; + thisSound = self.getSoundByObject(o); + + if (thisSound) { + + // sound already exists + self.setPageTitle(thisSound._data.originalTitle); + if (thisSound === self.lastSound) { + // ..and was playing (or paused) and isn't in an error state + if (thisSound.readyState !== 2) { + if (thisSound.playState !== 1) { + // not yet playing + thisSound.play(); + } else { + thisSound.togglePause(); + } + } else { + sm._writeDebug('Warning: sound failed to load (security restrictions, 404 or bad format)',2); + } + } else { + // ..different sound + if (self.lastSound) { + self.stopSound(self.lastSound); + } + if (spectrumContainer) { + thisSound._data.oTimingBox.appendChild(spectrumContainer); + } + thisSound.togglePause(); // start playing current + } + + } else { + + // create sound + thisSound = sm.createSound({ + id:o.id, + url:decodeURI(soundURL), + onplay:self.events.play, + onstop:self.events.stop, + onpause:self.events.pause, + onresume:self.events.resume, + onfinish:self.events.finish, + whileloading:self.events.whileloading, + whileplaying:self.events.whileplaying, + onmetadata:self.events.metadata, + onload:self.events.onload + }); + + // append control template + oControls = self.oControls.cloneNode(true); + oLI = o.parentNode; + oLI.appendChild(oControls); + if (spectrumContainer) { + oLI.appendChild(spectrumContainer); + } + self.soundsByObject[o.id] = thisSound; + + // tack on some custom data + thisSound._data = { + oLink: o, // DOM reference within SM2 object event handlers + oLI: oLI, + oControls: self.select('controls',oLI), + oStatus: self.select('statusbar',oLI), + oLoading: self.select('loading',oLI), + oPosition: self.select('position',oLI), + oTimingBox: self.select('timing',oLI), + oTiming: self.select('timing',oLI).getElementsByTagName('div')[0], + oPeak: self.select('peak',oLI), + oGraph: self.select('spectrum-box',oLI), + className: self.css.sPlaying, + originalTitle: o.innerHTML, + metadata: null + }; + + if (spectrumContainer) { + thisSound._data.oTimingBox.appendChild(spectrumContainer); + } + + // "Metadata" + if (thisSound._data.oLI.getElementsByTagName('ul').length) { + thisSound._data.metadata = new Metadata(thisSound); + } + + // set initial timer stuff (before loading) + str = self.strings.timing.replace('%s1',self.config.emptyTime); + str = str.replace('%s2',self.config.emptyTime); + thisSound._data.oTiming.innerHTML = str; + self.sounds.push(thisSound); + if (self.lastSound) { + self.stopSound(self.lastSound); + } + self.resetGraph.apply(thisSound); + thisSound.play(); + + } + + self.lastSound = thisSound; // reference for next call + return self.stopEvent(e); + + } + + }; + + this.handleMouseDown = function(e) { + // a sound link was clicked + if (isTouchDevice && e.touches) { + e = e.touches[0]; + } + if (e.button === 2) { + if (!pl.config.allowRightClick) { + pl.stopEvent(e); + } + return pl.config.allowRightClick; // ignore right-clicks + } + var o = self.getTheDamnTarget(e); + if (!o) { + return true; + } + if (!self.withinStatusBar(o)) { + return true; + } + self.dragActive = true; + self.lastSound.pause(); + self.setPosition(e); + if (!isTouchDevice) { + _event.add(document,'mousemove',self.handleMouseMove); + } else { + _event.add(document,'touchmove',self.handleMouseMove); + } + self.addClass(self.lastSound._data.oControls,'dragging'); + return self.stopEvent(e); + }; + + this.handleMouseMove = function(e) { + if (isTouchDevice && e.touches) { + e = e.touches[0]; + } + // set position accordingly + if (self.dragActive) { + if (self.config.useThrottling) { + // be nice to CPU/externalInterface + var d = new Date(); + if (d-self.dragExec>20) { + self.setPosition(e); + } else { + window.clearTimeout(self.dragTimer); + self.dragTimer = window.setTimeout(function(){self.setPosition(e);},20); + } + self.dragExec = d; + } else { + // oh the hell with it + self.setPosition(e); + } + } else { + self.stopDrag(); + } + e.stopPropagation = true; + return false; + }; + + this.stopDrag = function(e) { + if (self.dragActive) { + self.removeClass(self.lastSound._data.oControls,'dragging'); + if (!isTouchDevice) { + _event.remove(document,'mousemove',self.handleMouseMove); + } else { + _event.remove(document,'touchmove',self.handleMouseMove); + } + if (!pl.hasClass(self.lastSound._data.oLI,self.css.sPaused)) { + self.lastSound.resume(); + } + self.dragActive = false; + return self.stopEvent(e); + } + }; + + this.handleStatusClick = function(e) { + self.setPosition(e); + if (!pl.hasClass(self.lastSound._data.oLI,self.css.sPaused)) { + self.resume(); + } + return self.stopEvent(e); + }; + + this.stopEvent = function(e) { + if (typeof e !== 'undefined') { + if (typeof e.preventDefault !== 'undefined') { + e.preventDefault(); + } else { + e.stopPropagation = true; + e.returnValue = false; + } + } + return false; + }; + + this.setPosition = function(e) { + // called from slider control + var oThis = self.getTheDamnTarget(e), + x, oControl, oSound, nMsecOffset; + if (!oThis) { + return true; + } + oControl = oThis; + while (!self.hasClass(oControl,'controls') && oControl.parentNode) { + oControl = oControl.parentNode; + } + oSound = self.lastSound; + x = parseInt(e.clientX,10); + // play sound at this position + nMsecOffset = Math.floor((x-self.getOffX(oControl)-4)/(oControl.offsetWidth)*self.getDurationEstimate(oSound)); + if (!isNaN(nMsecOffset)) { + nMsecOffset = Math.min(nMsecOffset,oSound.duration); + } + if (!isNaN(nMsecOffset)) { + oSound.setPosition(nMsecOffset); + } + }; + + this.stopSound = function(oSound) { + sm._writeDebug('stopping sound: '+oSound.sID); + sm.stop(oSound.sID); + sm.unload(oSound.sID); + }; + + this.getDurationEstimate = function(oSound) { + if (oSound.instanceOptions.isMovieStar) { + return (oSound.duration); + } else { + return (!oSound._data.metadata || !oSound._data.metadata.data.givenDuration ? (oSound.durationEstimate||0) : oSound._data.metadata.data.givenDuration); + } + }; + + this.createVUData = function() { + + var i=0, j=0, + canvas = vuDataCanvas.getContext('2d'), + vuGrad = canvas.createLinearGradient(0, 16, 0, 0), + bgGrad, outline; + + vuGrad.addColorStop(0,'rgb(0,192,0)'); + vuGrad.addColorStop(0.30,'rgb(0,255,0)'); + vuGrad.addColorStop(0.625,'rgb(255,255,0)'); + vuGrad.addColorStop(0.85,'rgb(255,0,0)'); + bgGrad = canvas.createLinearGradient(0, 16, 0, 0); + outline = 'rgba(0,0,0,0.2)'; + bgGrad.addColorStop(0,outline); + bgGrad.addColorStop(1,'rgba(0,0,0,0.5)'); + for (i=0; i<16; i++) { + self.vuMeterData[i] = []; + } + for (i=0; i<16; i++) { + for (j=0; j<16; j++) { + // reset/erase canvas + vuDataCanvas.setAttribute('width',16); + vuDataCanvas.setAttribute('height',16); + // draw new stuffs + canvas.fillStyle = bgGrad; + canvas.fillRect(0,0,7,15); + canvas.fillRect(8,0,7,15); + /* + // shadow + canvas.fillStyle = 'rgba(0,0,0,0.1)'; + canvas.fillRect(1,15-i,7,17-(17-i)); + canvas.fillRect(9,15-j,7,17-(17-j)); + */ + canvas.fillStyle = vuGrad; + canvas.fillRect(0,15-i,7,16-(16-i)); + canvas.fillRect(8,15-j,7,16-(16-j)); + // and now, clear out some bits. + canvas.clearRect(0,3,16,1); + canvas.clearRect(0,7,16,1); + canvas.clearRect(0,11,16,1); + self.vuMeterData[i][j] = vuDataCanvas.toDataURL('image/png'); + // for debugging VU images + /* + var o = document.createElement('img'); + o.style.marginRight = '5px'; + o.src = self.vuMeterData[i][j]; + document.documentElement.appendChild(o); + */ + } + } + + }; + + this.testCanvas = function() { + // canvas + toDataURL(); + var c = document.createElement('canvas'), + ctx = null, ok; + if (!c || typeof c.getContext === 'undefined') { + return null; + } + ctx = c.getContext('2d'); + if (!ctx || typeof c.toDataURL !== 'function') { + return null; + } + // just in case.. + try { + ok = c.toDataURL('image/png'); + } catch(e) { + // no canvas or no toDataURL() + return null; + } + // assume we're all good. + return c; + }; + + this.initItem = function(oNode) { + if (!oNode.id) { + oNode.id = 'pagePlayerMP3Sound'+(self.soundCount++); + } + self.addClass(oNode,self.css.sDefault); // add default CSS decoration + }; + + this.initUL = function(oULNode) { + // set up graph box stuffs + if (sm.flashVersion >= 9) { + self.addClass(oULNode,self.cssBase); + } + }; + + this.init = function(oConfig) { + + if (oConfig) { + // allow overriding via arguments object + sm._writeDebug('pagePlayer.init(): Using custom configuration'); + this.config = this._mergeObjects(oConfig,this.config); + } else { + sm._writeDebug('pagePlayer.init(): Using default configuration'); + } + + var i, spectrumBox, sbC, oF, oClone, oTiming; + + // apply externally-defined override, if applicable + this.cssBase = []; // optional features added to ul.playlist + + // apply some items to SM2 + sm.useFlashBlock = true; + + if (sm.flashVersion >= 9) { + + sm.useMovieStar = this.config.useMovieStar; // enable playing FLV, MP4 etc. + sm.defaultOptions.usePeakData = this.config.usePeakData; + sm.defaultOptions.useWaveformData = this.config.useWaveformData; + sm.defaultOptions.useEQData = this.config.useEQData; + + if (this.config.usePeakData) { + this.cssBase.push('use-peak'); + } + + if (this.config.useWaveformData || this.config.useEQData) { + this.cssBase.push('use-spectrum'); + } + + this.cssBase = this.cssBase.join(' '); + + if (this.config.useFavIcon) { + vuDataCanvas = self.testCanvas(); + if (vuDataCanvas && supportsFavicon) { + // these browsers support dynamically-updating the favicon + self.createVUData(); + } else { + // browser doesn't support doing this + this.config.useFavIcon = false; + } + } + + } else if (this.config.usePeakData || this.config.useWaveformData || this.config.useEQData) { + + sm._writeDebug('Page player: Note: soundManager.flashVersion = 9 is required for peak/waveform/EQ features.'); + + } + + controlTemplate = document.createElement('div'); + + controlTemplate.innerHTML = [ + + // control markup inserted dynamically after each page player link + // if you want to change the UI layout, this is the place to do it. + + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + '
    ', + + '
    ', + '
    ', + ' %s1 / %s2', + '
    ', + '
    ', + + '
    ', + '
    ', + '
    ', + + '
    ', + '
    ', + '
    ', + '
    ', + '
    ' + + ].join('\n'); + + if (sm.flashVersion >= 9) { + + // create the spectrum box ish + spectrumContainer = self.select('spectrum-container',controlTemplate); + + // take out of template, too + spectrumContainer = controlTemplate.removeChild(spectrumContainer); + + spectrumBox = self.select('spectrum-box',spectrumContainer); + + sbC = spectrumBox.getElementsByTagName('div')[0]; + oF = document.createDocumentFragment(); + oClone = null; + for (i=256; i--;) { + oClone = sbC.cloneNode(false); + oClone.style.left = (i)+'px'; + oF.appendChild(oClone); + } + spectrumBox.removeChild(sbC); + spectrumBox.appendChild(oF); + + } else { + + // flash 8-only, take out the spectrum container and peak elements + controlTemplate.removeChild(self.select('spectrum-container',controlTemplate)); + controlTemplate.removeChild(self.select('peak',controlTemplate)); + + } + + self.oControls = controlTemplate.cloneNode(true); + + oTiming = self.select('timing-data',controlTemplate); + self.strings.timing = oTiming.innerHTML; + oTiming.innerHTML = ''; + oTiming.id = ''; + + function doEvents(action) { // action: add / remove + + _event[action](document,'click',self.handleClick); + + if (!isTouchDevice) { + _event[action](document,'mousedown',self.handleMouseDown); + _event[action](document,'mouseup',self.stopDrag); + } else { + _event[action](document,'touchstart',self.handleMouseDown); + _event[action](document,'touchend',self.stopDrag); + } + + _event[action](window, 'unload', cleanup); + + } + + cleanup = function() { + doEvents('remove'); + }; + + doEvents('add'); + + sm._writeDebug('pagePlayer.init(): Ready',1); + + if (self.config.autoStart) { + // grab the first ul.playlist link + pl.handleClick({target:pl.getByClassName('playlist', 'ul')[0].getElementsByTagName('a')[0]}); + } + + }; + +} + +soundManager.onready(function() { + pagePlayer = new PagePlayer(); + pagePlayer.init(typeof PP_CONFIG !== 'undefined' ? PP_CONFIG : null); +}); \ No newline at end of file diff --git a/js/libs/soundmanager/demo/play-mp3-links/basic.html b/js/libs/soundmanager/demo/play-mp3-links/basic.html new file mode 100644 index 0000000..48d1ffb --- /dev/null +++ b/js/libs/soundmanager/demo/play-mp3-links/basic.html @@ -0,0 +1,60 @@ + + + +SoundManager 2 Demo: Play MP3 Links on a page + + + + + + + + + +

    SoundManager 2 / page as a playlist, basic template

    + +

    Don't forget to set debugMode = false within inlineplayer.js to disable debug output.

    + +
    + +
    + + + +

    SoundManager 2 project home

    + +
  • + + + diff --git a/js/libs/soundmanager/demo/play-mp3-links/css/inlineplayer.css b/js/libs/soundmanager/demo/play-mp3-links/css/inlineplayer.css new file mode 100644 index 0000000..2153f2a --- /dev/null +++ b/js/libs/soundmanager/demo/play-mp3-links/css/inlineplayer.css @@ -0,0 +1,212 @@ +/* + + SoundManager 2: In-page MP3 player example + ------------------------------------------ + + Clicks on links to MP3s are intercepted via JS, calls are + made to SoundManager to load/play sounds. CSS classes are + appended to the link, which are used to highlight the + current play state and so on. + + Class names are applied in addition to "sm2_link" base. + + Default: + + sm2_link + + Additional states: + + sm2_playing + sm2_paused + + eg. + + + some.mp3 + + + some.mp3 + + + Note you don't require ul.graphic / ul.flat etc. for your use + if only using one style on a page. You can just use .sm2_link{} + and so on, but isolate the CSS you want. + + Side note: Would do multiple class definitions eg. + + a.sm2_default.sm2_playing{} + + .. except IE 6 has a parsing bug which may break behaviour, + applying sm2_playing {} even when the class is set to sm2_default. + + + If you want to make your own UI from scratch, here is the base: + + Default + hover state, "click to play": + + a.sm2_link {} + a.sm2_link:hover {} + + Playing + hover state, "click to pause": + + a.sm2_playing {} + a.sm2_playing:hover {} + + Paused + hover state, "click to resume": + + a.sm2_paused {} + a.sm2_paused:hover {} + + +*/ + +/* two different list types */ + +ul.flat { + list-style-type:none; + padding-left:0px; +} + +ul.flat li, +ul.graphic li { + padding-bottom:1px; +} + +ul.flat li a { + display:inline-block; + padding:2px 4px 2px 4px; +} + +ul.graphic { + list-style-type:none; + padding-left:0px; + margin-left:0px; +} + +/* background-image-based CSS3 example */ + +ul.graphic { + list-style-type:none; + margin:0px; + padding:0px; +} + +ul.graphic li { + margin-bottom:2px; +} + +ul.graphic li a, +ul.graphic li a.sm2_link { + /* assume all items will be sounds rather than wait for onload etc. in this example.. may differ for your uses. */ + display:inline-block; + padding-left:22px; + min-height:16px; + vertical-align: middle; + background-color:#778899; + -moz-border-radius:3px; + -webkit-border-radius:3px; + border-radius:3px; + padding:3px 3px 3px 25px; + min-width:19em; + _width:19em; /* IE 6 */ + text-decoration:none; + font-weight:normal; + color:#f6f9ff; +} + +ul.graphic li a.sm2_link { + /* safari 3.1+ fun (or, proprietary crap. TBD.) */ + -webkit-transition-property: hover; + -webkit-transition: background-color 0.15s linear; + -moz-transition: background-color 0.15s linear 0s; /* firefox 4 */ + -o-transition-property: background-color; /* opera 10.5 */ + -o-transition-duration: 0.15s; +} + +ul.graphic li a, /* use a.sm2_link {} if you want play icons showing only if SM2 is supported */ +ul.graphic li a.sm2_paused:hover, +ul.graphic li a.sm2_link:hover { + background-image:url(../image/icon_play.png); + background-position:3px 50%; + background-repeat:no-repeat; + _background-image:url(../image/icon_play.gif); /* IE 6 */ +} + +ul.graphic li a.sm2_link:hover { + /* default hover color, if you'd like.. */ + background-color:#445566; + color:#fff; +} + +ul.graphic li a.sm2_paused { + background-color:#ccc; +} + +ul.graphic li a.sm2_paused:hover { + background:#999 url(../image/icon_play.png) no-repeat 3px 50%; + _background-image:url(../image/icon_play.gif); +} + +ul.graphic li a.sm2_playing, +ul.graphic li a.sm2_playing:hover { + background:#334455 url(../image/icon_pause.png) no-repeat 3px 50%; + _background-image:url(../image/icon_pause.gif); + text-decoration:none; +} + +/* hide button while playing? +ul.graphic li a.sm2_playing { + background-image:none; +} +*/ + +body #sm2-container object, +body #sm2-container embed { + /* + flashblock handling: hide SWF off-screen by default (until blocked timeout case.) + include body prefix to ensure override of flashblock.css. + */ + + left:-9999em; + top:-9999em; +} + +/* flat CSS example */ + +ul.flat a.sm2_link { + /* default state: "a playable link" */ + border-left:6px solid #999; + padding-left:4px; + padding-right:4px; +} + +ul.flat a.sm2_link:hover { + /* default (inactive) hover state */ + border-left-color:#333; +} + + +ul.flat a.sm2_playing { + /* "now playing" */ + border-left-color:#6666ff; + background-color:#000; + color:#fff; + text-decoration:none; +} + +ul.flat a.sm2_playing:hover { + /* "clicking will now pause" */ + border-left-color:#cc3333; +} + +ul.flat a.sm2_paused { + /* "paused state" */ + background-color:#666; + color:#fff; + text-decoration:none; +} + +ul.flat a.sm2_paused:hover { + /* "clicking will resume" */ + border-left-color:#33cc33; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.gif b/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.gif new file mode 100644 index 0000000..7f3443d Binary files /dev/null and b/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.gif differ diff --git a/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.png b/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.png new file mode 100644 index 0000000..5775ce2 Binary files /dev/null and b/js/libs/soundmanager/demo/play-mp3-links/image/icon_pause.png differ diff --git a/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.gif b/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.gif new file mode 100644 index 0000000..3954336 Binary files /dev/null and b/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.gif differ diff --git a/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.png b/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.png new file mode 100644 index 0000000..303fc4b Binary files /dev/null and b/js/libs/soundmanager/demo/play-mp3-links/image/icon_play.png differ diff --git a/js/libs/soundmanager/demo/play-mp3-links/image/test.gif b/js/libs/soundmanager/demo/play-mp3-links/image/test.gif new file mode 100644 index 0000000..075c135 Binary files /dev/null and b/js/libs/soundmanager/demo/play-mp3-links/image/test.gif differ diff --git a/js/libs/soundmanager/demo/play-mp3-links/index.html b/js/libs/soundmanager/demo/play-mp3-links/index.html new file mode 100644 index 0000000..bde2ce0 --- /dev/null +++ b/js/libs/soundmanager/demo/play-mp3-links/index.html @@ -0,0 +1,228 @@ + + + +SoundManager 2 Demo: Play MP3 Links on a page + + + + + + + + + + +
    + +

    SoundManager 2 / Make MP3 links play in-place

    + +

    Inline MP3 Player Example: Fancy* CSS 3 version

    +

    *CSS 3 border-radius supported only by Firefox 2.x+, Safari (2.x?) - sadly, not IE 8.

    + +
    + +
    + + + +

    How It Works

    + +
      +
    • Lightweight (single JS click event handler)
    • +
    • Uses existing SoundManager 2 API
    • +
    • CSS for UI, easy to modify to taste
    • +
    + +

    This example uses SoundManager 2 to find links to MP3 files, and makes them playable "in-place" on a page. The script assigns CSS classes to links to indicate their state (playing/paused, etc.)

    +

    Links pointing to MP3s are assigned an onclick handler which intercepts the click (preventing the browser from following the link and unloading the page. SM2 will then create sound objects as needed to play the MP3s.

    + +

    Static Examples

    +

    CSS classes are dynamically applied as follows:

    + +

    :hover effects are also active.

    + +

    Flat (CSS-only) style

    + + + +

    Static Examples

    + + + +

    Forcing play (or exclusion) of links

    + +

    If you have a link to a PHP file that serves MP3 files eg. /music.php?fileID=123, it won't be picked up by the script as containing a known, playable .mp3 extension. To tell the script it should be treated as playable, include a type="audio/mpeg" MIME type attribute, or CSS class="inline-playable" in the link. eg:

    + +

    + <a href="/music.php?fileID=123" type="audio/mpeg">A song</a> +

    + +

    Or via CSS class name:

    + <a href="/music.php?fileID=123" class="inline-playable">A song</a> +

    + +

    + To exclude an .MP3 or otherwise-playable link from being handled by SM2, use class="inline-exclude" and it will be ignored. +

    + +

    + SoundManager 2 project page (not an MP3 link) +

    + +

    Basic CSS

    + +
    + If you want to make your own UI from scratch, here is the base:
    +
    + Default + hover state, "click to play":
    +
    + a.sm2_link {}
    + a.sm2_link:hover {}
    +
    + Playing + hover state, "click to pause":
    +
    + a.sm2_playing {}
    + a.sm2_playing:hover {}
    +
    + Paused + hover state, "click to resume":
    +
    + a.sm2_paused {}
    + a.sm2_paused:hover {}
    +
    + +

    Other Options

    + +

    By default, one sound will be played at a time; you can easily change a "config" object value to turn on playlist-like behaviour (i.e., play the next MP3 when the current one finishes.)

    + +
    +// (within inlineplayer.js)
    +this.config = {
    + playNext: false // stop after one sound, or play through list until end
    +}
    +
    + +

    I'd like to use this.

    +

    See this basic demo for reference.

    + +
    + + + diff --git a/js/libs/soundmanager/demo/play-mp3-links/script/inlineplayer.js b/js/libs/soundmanager/demo/play-mp3-links/script/inlineplayer.js new file mode 100644 index 0000000..aa96c89 --- /dev/null +++ b/js/libs/soundmanager/demo/play-mp3-links/script/inlineplayer.js @@ -0,0 +1,244 @@ +/* + + SoundManager 2 Demo: Play MP3 links "in-place" + ---------------------------------------------- + + http://schillmania.com/projects/soundmanager2/ + + A simple demo making MP3s playable "inline" + and easily styled/customizable via CSS. + + Requires SoundManager 2 Javascript API. + +*/ + +function InlinePlayer() { + var self = this; + var pl = this; + var sm = soundManager; // soundManager instance + this.playableClass = 'inline-playable'; // CSS class for forcing a link to be playable (eg. doesn't have .MP3 in it) + this.excludeClass = 'inline-exclude'; // CSS class for ignoring MP3 links + this.links = []; + this.sounds = []; + this.soundsByURL = []; + this.indexByURL = []; + this.lastSound = null; + this.soundCount = 0; + var isIE = (navigator.userAgent.match(/msie/i)); + + this.config = { + playNext: false, // stop after one sound, or play through list until end + autoPlay: false // start playing the first sound right away + } + + this.css = { + // CSS class names appended to link during various states + sDefault: 'sm2_link', // default state + sLoading: 'sm2_loading', + sPlaying: 'sm2_playing', + sPaused: 'sm2_paused' + } + + this.addEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.addEventListener(evtName,evtHandler,false):o.attachEvent('on'+evtName,evtHandler); + } + + this.removeEventHandler = function(o,evtName,evtHandler) { + typeof(attachEvent)=='undefined'?o.removeEventListener(evtName,evtHandler,false):o.detachEvent('on'+evtName,evtHandler); + } + + this.classContains = function(o,cStr) { + return (typeof(o.className)!='undefined'?o.className.match(new RegExp('(\\s|^)'+cStr+'(\\s|$)')):false); + } + + this.addClass = function(o,cStr) { + if (!o || !cStr || self.classContains(o,cStr)) return false; + o.className = (o.className?o.className+' ':'')+cStr; + } + + this.removeClass = function(o,cStr) { + if (!o || !cStr || !self.classContains(o,cStr)) return false; + o.className = o.className.replace(new RegExp('( '+cStr+')|('+cStr+')','g'),''); + } + + this.getSoundByURL = function(sURL) { + return (typeof self.soundsByURL[sURL] != 'undefined'?self.soundsByURL[sURL]:null); + } + + this.isChildOfNode = function(o,sNodeName) { + if (!o || !o.parentNode) { + return false; + } + sNodeName = sNodeName.toLowerCase(); + do { + o = o.parentNode; + } while (o && o.parentNode && o.nodeName.toLowerCase() != sNodeName); + return (o.nodeName.toLowerCase() == sNodeName?o:null); + } + + this.events = { + + // handlers for sound events as they're started/stopped/played + + play: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLink,this._data.className); + }, + + stop: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = ''; + }, + + pause: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPaused; + pl.addClass(this._data.oLink,this._data.className); + }, + + resume: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = pl.css.sPlaying; + pl.addClass(this._data.oLink,this._data.className); + }, + + finish: function() { + pl.removeClass(this._data.oLink,this._data.className); + this._data.className = ''; + if (pl.config.playNext) { + var nextLink = (pl.indexByURL[this._data.oLink.href]+1); + if (nextLink1) { + // ignore right-click + return true; + } + var o = self.getTheDamnLink(e); + if (o.nodeName.toLowerCase() != 'a') { + o = self.isChildOfNode(o,'a'); + if (!o) return true; + } + var sURL = o.getAttribute('href'); + if (!o.href || (!sm.canPlayLink(o) && !self.classContains(o,self.playableClass)) || self.classContains(o,self.excludeClass)) { + return true; // pass-thru for non-MP3/non-links + } + var soundURL = (o.href); + var thisSound = self.getSoundByURL(soundURL); + if (thisSound) { + // already exists + if (thisSound == self.lastSound) { + // and was playing (or paused) + thisSound.togglePause(); + } else { + // different sound + thisSound.togglePause(); // start playing current + sm._writeDebug('sound different than last sound: '+self.lastSound.sID); + if (self.lastSound) self.stopSound(self.lastSound); + } + } else { + // create sound + thisSound = sm.createSound({ + id:'inlineMP3Sound'+(self.soundCount++), + url:soundURL, + onplay:self.events.play, + onstop:self.events.stop, + onpause:self.events.pause, + onresume:self.events.resume, + onfinish:self.events.finish + }); + // tack on some custom data + thisSound._data = { + oLink: o, // DOM node for reference within SM2 object event handlers + className: self.css.sPlaying + }; + self.soundsByURL[soundURL] = thisSound; + self.sounds.push(thisSound); + if (self.lastSound) self.stopSound(self.lastSound); + thisSound.play(); + // stop last sound + } + + self.lastSound = thisSound; // reference for next call + + if (typeof e != 'undefined' && typeof e.preventDefault != 'undefined') { + e.preventDefault(); + } else { + event.returnValue = false; + } + return false; + } + + this.stopSound = function(oSound) { + soundManager.stop(oSound.sID); + soundManager.unload(oSound.sID); + } + + this.init = function() { + sm._writeDebug('inlinePlayer.init()'); + var oLinks = document.getElementsByTagName('a'); + // grab all links, look for .mp3 + var foundItems = 0; + for (var i=0, j=oLinks.length; i0) { + self.addEventHandler(document,'click',self.handleClick); + if (self.config.autoPlay) { + self.handleClick({target:self.links[0],preventDefault:function(){}}); + } + } + sm._writeDebug('inlinePlayer.init(): Found '+foundItems+' relevant items.'); + } + + this.init(); + +} + +var inlinePlayer = null; + +soundManager.debugMode = true; // disable or enable debug output +soundManager.useFlashBlock = true; +soundManager.url = '../../swf/'; // path to directory containing SM2 SWF + +// optional: enable MPEG-4/AAC support (requires flash 9) + +soundManager.flashVersion = 9; +soundManager.useMovieStar = true; + +// ---- + +soundManager.onready(function() { + // soundManager.createSound() etc. may now be called + inlinePlayer = new InlinePlayer(); +}); + diff --git a/js/libs/soundmanager/demo/template/deferred-example.html b/js/libs/soundmanager/demo/template/deferred-example.html new file mode 100644 index 0000000..9a48545 --- /dev/null +++ b/js/libs/soundmanager/demo/template/deferred-example.html @@ -0,0 +1,219 @@ + + + +SoundManager 2: Deferred loading / Lazy-loading / Dynamic script loading Example + + + + + + + + + + + + +
    +

    SoundManager 2: Lazy Loading Example

    +

    This is an example of dynamically loading SoundManager 2 using JS, after window.onload() has fired.

    +

    How it works

    +

    This page waits until window.onload(), delays 1 second and loads soundmanager2.js, which should then start up.

    + +

    SoundManager 2 status: Waiting for window.onload()...

    + +
    +/*
    + * Dynamic script loading helper
    + * Normalizes good browser onload() vs. IE readyState weirdness
    + */
    +
    +
    +function loadScript(sURL, onLoad) {
    +
    +  function loadScriptHandler() {
    +
    +    var rs = this.readyState;
    +    if (rs == 'loaded' || rs == 'complete') {
    +      this.onreadystatechange = null;
    +      this.onload = null;
    +      if (onLoad) {
    +        onLoad();
    +      }
    +    }
    +
    +  }
    +
    +  function scriptOnload() {
    +
    +    this.onreadystatechange = null;
    +    this.onload = null;
    +    window.setTimeout(onLoad,20);
    +
    +  }
    +
    +  var oS = document.createElement('script');
    +  oS.type = 'text/javascript';
    +  if (onLoad) {
    +    oS.onreadystatechange = loadScriptHandler;
    +    oS.onload = scriptOnload;
    +  }
    +  oS.src = sURL;
    +  document.getElementsByTagName('head')[0].appendChild(oS);
    +
    +}
    +
    +// Wait for window load, then load soundmanager2.js, let it start and play a test sound
    +
    +window.onload = function() {
    +
    +  msg('Window loaded, waiting 1 second...');
    +
    +  setTimeout(function(){
    +
    +    msg('Loading soundmanager2.js...');
    +
    +    loadScript('../../script/soundmanager2.js', function() {
    +
    +      // SM2 script has loaded
    +
    +      soundManager.url = '../../swf/';
    +
    +      soundManager.onready(function() {
    +
    +        soundManager.createSound({
    +          id:'foo',
    +          url:'../_mp3/mouseover.mp3'
    +        }).play();
    +
    +        msg('started OK');
    +
    +      });
    +
    +      soundManager.ontimeout(function() {
    +
    +        msg('Loaded OK, but unable to start: unsupported/flash blocked, etc.');
    +
    +      });
    +
    +    });
    +
    +    soundManager.beginDelayedInit(); // ensure start-up in case document.readyState and/or DOMContentLoaded are unavailable
    +
    +  },1000);
    +
    +}
    +
    + +

    Handling flash blockers

    +

    It's good to let users see the flash component of SM2, so those with flash blockers can unblock it and allow SM2 to start. For more info on this, see the Flashblock example.

    + +

    Making SM2 wait for window.onload()

    +

    If you prefer to have the library wait for window.onload() before calling soundManager.onload()/onerror() methods, you can modify SM2's "waitForWindowLoad" property:

    +soundManager.waitForWindowLoad = true; + +

    Preventing auto-init using SM2_DEFER

    +

    If you want to completely defer the normal start-up of SM2 and call the SoundManager() constructor yourself, you can declare an SM2_DEFER global and set it to true.

    +
    window.SM2_DEFER = true;
    +// some time later, manually start SM2...
    +soundManager = new SoundManager();
    +soundManager.beginDelayedInit(); // ensure SM2 begins its init process, in the event dom ready / window.load() have already passed
    + +

    Disabling debug output

    +

    SoundManager 2 will write to a debug <div> element or a javascript console if available, by default. To disable it, simply set the relevant property to false:

    +soundManager.debugMode = false; +

    To see related configuration code, refer to the source of this page which basically does all of the above "for real."

    +

    Troubleshooting

    +

    If SM2 is failing to start and throwing errors due to flash security, timeouts or other issues, check out the troubleshooting tool which can help you fix things.

    +

    No-debug, compressed version of soundmanager2.js

    +

    Once development is finished, you can also use the "minified" (60% smaller) version of SM2, which has debug output and comments removed for you: soundmanager2-nodebug-jsmin.js. If you can, serve this with gzip compression for even greater bandwidth savings!

    + +
    + + + diff --git a/js/libs/soundmanager/demo/template/html5-dtd-test.html b/js/libs/soundmanager/demo/template/html5-dtd-test.html new file mode 100644 index 0000000..ecd1abe --- /dev/null +++ b/js/libs/soundmanager/demo/template/html5-dtd-test.html @@ -0,0 +1,77 @@ + + + +SoundManager 2: HTML 5 DTD test + + + + + + + + + + diff --git a/js/libs/soundmanager/demo/template/index.html b/js/libs/soundmanager/demo/template/index.html new file mode 100644 index 0000000..b44c516 --- /dev/null +++ b/js/libs/soundmanager/demo/template/index.html @@ -0,0 +1,137 @@ + + + +SoundManager 2 Template + + + + + + + + + + + + + + + + + + + + +
    +

    SoundManager 2 Template Example

    +

    This is a basic template for adding SoundManager to your page.

    +

    How it works

    +

    This page includes the SM2 script, which starts up on its own as appropriate. By default it will try to start as soon as possible.

    +

    The minimal code needed to get SoundManager 2 going is below, with configurable parts:

    + +
    +
    +<!-- include SM2 library -->
    +<script type="text/javascript" src="/path/to/soundmanager2.js"></script>
    +
    +<!-- configure it for your use -->
    +<script type="text/javascript">
    +
    +soundManager.url = '/path/to/sm2-flash-movies/'; // directory where SM2 .SWFs live
    +
    +// Note that SoundManager will determine and append the appropriate .SWF file to the URL,
    +// eg. /path/to/sm2-flash-movies/soundmanager2.swf automatically.
    +
    +// Beta-ish HTML5 audio support (force-enabled for iPad), flash-free sound for Safari + Chrome. Enable if you want to try it!
    +// soundManager.useHTML5Audio = true;
    +
    +// do this to skip flash block handling for now. See the flashblock demo when you want to start getting fancy.
    +soundManager.useFlashBlock = false;
    +
    +// disable debug mode after development/testing..
    +// soundManager.debugMode = false;
    +
    +// Option 1: Simple onload() + createSound() method
    +
    +soundManager.onload = function() {
    +  // SM2 has loaded - now you can create and play sounds!
    +  soundManager.createSound('helloWorld','/path/to/hello-world.mp3');
    +  soundManager.play('helloWorld');
    +};
    +
    +// Option 2 (better): More flexible onload() + createSound() method
    +
    +soundManager.onload = function() {
    +
    +  var mySound = soundManager.createSound({
    +    id: 'aSound',
    +    url: '/path/to/an.mp3'
    +    // onload: [ event handler function object ],
    +    // other options here..
    +  });
    +
    +  mySound.play();
    +
    +}
    +
    +// Option 3 (best): onready() + createSound() / ontimeout() methods for success/failure:
    +
    +soundManager.onready(function() {
    +
    +  // SM2 has loaded - now you can create and play sounds!
    +  var mySound = soundManager.createSound({
    +    id: 'aSound',
    +    url: '/path/to/an.mp3'
    +    // onload: [ event handler function object ],
    +    // other options here..
    +  });
    +  mySound.play();
    +
    +});
    +
    +soundManager.ontimeout(function() {
    +
    +  // (Optional) Hrmm, SM2 could not start. Show an error, etc.?
    +
    +});
    +
    +
    +</script>
    + +

    Handling flash blockers

    +

    It's good to let users see the flash component of SM2, so those with flash blockers can unblock it and allow SM2 to start. For more info on this, see the Flashblock example.

    + +

    Making SM2 wait for window.onload()

    +

    If you prefer to have the library wait for window.onload() before calling soundManager.onload()/onerror() methods, you can modify SM2's "waitForWindowLoad" property:

    +soundManager.waitForWindowLoad = true; +

    Disabling debug output

    +

    SoundManager 2 will write to a debug <div> element or a javascript console if available, by default. To disable it, simply set the relevant property to false:

    +soundManager.debugMode = false; +

    To see related configuration code, refer to the source of this page which basically does all of the above "for real."

    +

    Troubleshooting

    +

    If SM2 is failing to start and throwing errors due to flash security, timeouts or other issues, check out the troubleshooting tool which can help you fix things.

    +

    No-debug, compressed version of soundmanager2.js

    +

    Once development is finished, you can also use the "minified" (down to 10% of original size with gzip!) version of SM2, which has debug output and comments removed for you: soundmanager2-nodebug-jsmin.js. Serve with gzip compression wherever possible for best bandwidth savings.

    + +
    + + + diff --git a/js/libs/soundmanager/demo/template/template.css b/js/libs/soundmanager/demo/template/template.css new file mode 100644 index 0000000..63943ba --- /dev/null +++ b/js/libs/soundmanager/demo/template/template.css @@ -0,0 +1,67 @@ +/* + + DEMO ONLY, just to make the demo page pretty. + + You don't need this stuff for SM2 to work. :) + +*/ + +body { + font-size:75%; +} + +code, pre { + font-family:"lucida console",monaco,courier,terminal,system; + font-size:100%; + color:#2233cc; +} + +em em { + font-weight:normal; + font-style:normal; + color:#339933; +} + +h1, +h2.special { + letter-spacing:-1px; +} + +h1, h2, h3, h4 { + font-family:"helvetica neue",helvetica,verdana,arial,tahoma,"sans serif"; + font-size:1em; + margin:0px; + padding:0px; + vertical-align:middle; +} + +h1 { + font-size:2em; +} + +h2 { + font-family:helvetica,arial,verdana,tahoma,"sans serif"; + font-size:1.5em; +} + +h3 { + font-size:1.17em; + border-bottom:1px solid #ccc; + padding-bottom:0.25em; + margin-top:1.5em; +} + +h4 { + margin:1.5em 0px 0.5em 0px; + font-size:1.1em; +} + + +p { + font:normal 1em verdana,tahoma,arial,"sans serif"; +} + +code span, +pre span { + color:#666; +} \ No newline at end of file diff --git a/js/libs/soundmanager/demo/template/xhtml-test.xhtml b/js/libs/soundmanager/demo/template/xhtml-test.xhtml new file mode 100644 index 0000000..a77db8f --- /dev/null +++ b/js/libs/soundmanager/demo/template/xhtml-test.xhtml @@ -0,0 +1,86 @@ + + + +SoundManager 2 Template + + + + + + + + + + + + + + + + + + + + + +
    +

    SoundManager 2 Template Example

    +

    This is a basic template for adding SoundManager to your page.

    +

    How it works

    +

    This page includes the SM2 script, which starts up on its own as appropriate. By default it will try to start as soon as possible.

    +

    The minimal code needed to get SoundManager 2 going is below, with configurable parts:

    + +
    +
    +<-- include SM2 library -->
    +<script type="text/javascript" src="/path/to/soundmanager2.js"></script>
    +
    +<-- configure it for your use -->
    +<script type="text/javascript">
    +
    +soundManager.url = '/path/to/sm2-flash-movies/'; // directory where SM2 .SWFs live
    +
    +// Note that SounndManager will determine and append the appropriate .SWF file to the URL.
    +
    +// disable debug mode after development/testing..
    +// soundManager.debugMode = false;
    +
    +soundManager.onload = function() {
    +  // SM2 has loaded - now you can create and play sounds!
    +  soundManager.createSound('helloWorld','/path/to/hello-world.mp3');
    +  soundManager.play('helloWorld');
    +}
    +
    +</script>
    + +

    Making SM2 wait for window.onload()

    +

    If you prefer to have the library wait for window.onload() before calling soundManager.onload()/onerror() methods, you can modify SM2's "waitForWindowLoad" property:

    +soundManager.waitForWindowLoad = true; +

    Disabling debug output

    +

    SoundManager 2 will write to a debug <div> element or a javascript console if available, by default. To disable it, simply set the relevant property to false:

    +soundManager.debugMode = false; +

    To see related configuration code, refer to the source of this page which basically does all of the above "for real."

    +

    No-debug, compressed version of soundmanager2.js

    +

    Once development is finished, you can also use the "minified" (60% smaller) version of SM2, which has debug output and comments removed for you: soundmanager2-nodebug-jsmin.js. If you can, serve this with gzip compression for even greater bandwidth savings!

    + +
    + + + diff --git a/js/libs/soundmanager/doc/download/index.html b/js/libs/soundmanager/doc/download/index.html new file mode 100644 index 0000000..45ceddb --- /dev/null +++ b/js/libs/soundmanager/doc/download/index.html @@ -0,0 +1,1146 @@ + + + +SoundManager 2: Download + + + + + + + + + + + + + + + + +
    + + + +
    + + +
    + +
    +
    +
    + +
    +
    +
    + +
    + +
    + +
    +

    Get SoundManager 2

    +

    Get the latest and greatest.

    +
    + +
    +

    Download SoundManager 2

    +

    Latest changes: Simplified onready() behaviour (see potential onready() regression note), new ontimeout() handler, Webkit + MovieStar 30-second-pause fix. See revision history for details.

    + +

    Download SoundManager 2.97a.20110101

    +

    Also on Github (dev branches, forks etc.): http://github.com/scottschiller/SoundManager2 - Related: A year of commits (Gource visualization)

    +

    Performance tip: SM2's code size varies from 90 KB (debug) down to 10 KB (optimized) over HTTP; check the pre-optimized builds for details.

    +

    Side reading: "Probably, Maybe, No": The State of HTML5 Audio, an article written for 24ways.org touching on some of the current issues and future promise of audio in HTML.

    +
    + +
    + + +
    + +
    +

    Revision History

    +

    Latest changes and archived notes from bug fixes, API updates, feature development etc.

    +
    + +
    + +
    + +

    Revision History

    + +

    A changelog of sorts.

    + +
      + +
    • +

      V2.97a.20110101 - Simplified onready() behaviour (see potential onready() regression note), new ontimeout() handler, Webkit + MovieStar 30-second-pause fix

      +

      onready() is now called only for SM2 init success (makes default case easier, no need for "supported" check) - new ontimeout() is called only for failure case, ie., flash blocked/missing. Special Webkit/MovieStar won't-resume-after-30-seconds-paused fix. soundManager.supported() renamed to soundManager.ok() (old method aliased for the time being.)

      + +
        + +
      • +

        Bug fixes

        +
          +
        • Special bad case, Webkit/Flash+MovieStar (AAC/MPEG4/RTMP-only, not MP3): sounds don't resume after being paused for 30+ seconds(?), but setPosition() with current position gets things going again after a resume() attempt. Reported via 8tracks dudes.
        • +
        +
      • + +
      • +

        API Updates

        +
          +
        • +

          In previous releases, the soundManager.onready() queue would be processed for both OK and failure cases. The onready() queue is now processed only if successful initialisation occurs, making old "supported" checks within the onready() handlers redundant.

          +

          Potential regression note: Old error case handling within onready() will never execute as a result of this change. Update your code to use the new explicit soundManager.ontimeout() handler instead.

          + +
          +

          Old onready() method

          +
          soundManager.onready(function(){
          +  if (soundManager.supported()) {
          +    // OK, play sound etc.
          +  } else {
          +    // SM2 could not start; message user?
          +  }
          +});
          +
          + +
          +

          New onready() / ontimeout() method

          +
          soundManager.onready(function(){
          +  // OK, play sound etc.
          +});
          +
          +soundManager.ontimeout(function(){
          +  // SM2 could not start; message user?
          +});
          +
          + +
        • +
        • New soundManager.ontimeout(myFunction) method, for asynchronous queueing of init failure handlers. Fired only when SoundManager 2 is unable to initialise (usually due to blocked/missing flash, or flash security error.) Queue behaviour is the same style as onready().
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • Code cleanup: Took the unsupported "jsAMP" demo (2007 prototype) out back and shot it.
        • +
        • 360° UI demo: New "allowMultiple" config option, let 2+ sounds play at once etc. (Default: false, one at a time.)
        • +
        • 360° UI, canvas visualization demo: Minor layout, UI, code tweaks
        • +
        • API/docs/demos reference and use updated onready()/ontimeout() methods.
        • +
        +
      • + +
      +
    • + +
    • +

      V2.97a.20101221 - HTML5 loading/progress and RTMP tweaks, onready() double-firing fix, hasPriority for mobile flash, Muxtape-style player now AJAX-friendly (Download archived version)

      +

      Improved HTML5 whileloading() / whileplaying(), unload and event handling. hasPriority for off-screen SWF loading on mobile, replaces old mobileFlash positioning tricks. Effectively re-wrote page player (Muxtape-style) demo to use event delegation + read live DOM, so should not break in AJAX cases. RTMP onplay() / play() / buffering fixes, setPosition() regression fix.

      + +
        + +
      • +

        Bug fixes

        +
          +
        • Double onready()-firing bug (HTML5 and non-flashblock case) fixed.
        • +
        • HTML5: Don't request null/about:blank URL with unload(), may hang/JS error in Chrome and IE 9 preview 7.
        • +
        • RTMP: Ensure onplay() is called for auto-loading streams when resumed. Don't call play() until connected. play() sets flash pauseOnBufferFull = false (fix for reported "RTMP not playing audio" issue.)
        • +
        • overHTTP was likely returning incorrect values previously - now fixed.
        • +
        • unload() tweak: Ensure position is reset to 0 if unload() fails
        • +
        • Flash audio: Log metaDataHandler info if debug enabled, possible duration metaData fix
        • +
        • No HTML5 audio for any Safari on OS X Snow Leopard 10.6.[3|4|5] due to underlying bugs causing intermittent audio playback failure; ongoing Apple issue, on their radar. Amusingly, Safari on Windows appears to be fine.
        • +
        +
      • + +
      • +

        API Updates

        +
          +
        • Revised HTML5 Audio() events, improved whileloading() / whileplaying() / onload() for Webkit and Firefox 4. Progress/onload are still a bit quirky as HTML5 audio is more about "non-linear" loading including range and partial requests, where supported. See related discussion.
        • +
        • New soundManager.ok() method, nicer alias for soundManager.supported().
        • +
        • Took soundmanager.loadFromXML() (SM1 legacy method) out back and shot it. Last tweak was in 2008, nobody uses it.
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • Flash <object> / <embed>: hasPriority attribute, enables off-screen SWF loading with Flash 10.1+. Removed mobileFlash positioning/repositioning tricks in lieu of this.
        • +
        • Effectively re-wrote page-player (Muxtape-style) demo, now traverses live DOM for next item(s). Should be more AJAX-friendly. Event delegation now handles any links added at any time. Externalised experimental features, too.
        • +
        • HTML5: If URL lacks type attribute and extension such as .mp3 (worst-case scenario, you shouldn't be doing this anyway) just try dumbly loading it - imitating Flash behaviour.
        • +
        • Improved dataerror (wave/spectrum) exception handling, should result in lowered CPU use if playback continues with access exceptions (eg. YouTube video going in another tab.)
        • +
        • Start-up debug output/messaging clean-up (no movieStar in flash 8, minimal output in HTML5-only mode, etc.)
        • +
        • Add window unload handler if Flash being used, so back button will cause a page refresh (vs. the browser showing "previous state") to reinstate Flash in good browsers. Previously, the "previous state" was be shown but Flash audio would be broken.
        • +
        • ipod (ipod touch) gets HTML5 now, too.
        • +
        • Microsoft have added Audio() to Internet Explorer 9 as of "Platform Preview 7" - previous pre-releases of IE 9 only implemented <audio>, which SM2 does not use.
        • +
        +
      • + +
      +
    • + +
    • +

      V2.97a.20101010 - Code cleanup, HTML5 audio tweaks, merged RTMP fork, removal of experimental video, optional usePolicyFile crossdomain.xml feature (Download archived version)

      +

      Shuffling of SoundManager 2 core, approximately 5% shaved off full debug-enabled file size after bug fixes, additional comments, new features and so on. Internal event handling code cleaned up. .SWF builds optimized, Flash 9 non-debug version now under 10 KB. Debug version now flash debugger-enabled. Merged GitHub user kjvarga's RTMP fork including improvements for Red5 + Flash Media Server streaming cases - buffering, event and state handling. Experimental video feature is toast, createVideo() no longer implemented. iPhone + iPad touch events on page player + 360° player UI demos; tap and drag to seek, etc.

      + +
        + +
      • +

        Bug fixes

        +
          +
        • No HTML5 audio for *any* Safari on OS X Snow Leopard 10.6.[3|4] due to underlying bugs causing intermittent audio playback failure; ongoing Apple issue, on their radar. (See related GitHub commit)
        • +
        • Don't unload() at onfinish() for HTML5 audio (was originally done to be conservative, but results in additional HTTP requests despite caching expectations?)
        • +
        • onload() for HTML5 now using proper boolean values
        • +
        • Fix NetStream-specific autoLoad/autoPlay/volume createSound() call, specific null flash sound object error scenario. (Related changes on GitHub.)
        • +
        • Fix for "onbufferchange(1) followed immediately by onbufferchange(0)" case when audio was actually still buffering.
        • +
        • Removed setPosition() within unload(), cleaner exit when destroying a sound
        • +
        +
      • + +
      • +

        Merged: RTMP Fork

        +
          +
        • Merged GitHub user kjvarga's RTMP fork of SoundManager 2, including buffering, event and state handling fixes and improvements. For more RTMP documentation/features, see the readme on GitHub, or view locally.
        • +
        +
      • + +
      • +

        API Updates

        +
          +
        • Removed experimental video feature (originally added late 2008, never developed further.) createVideo(), allowFullScreen and related video methods are now gone. Other dedicated HTML5/flash video player projects have since solved this problem.
        • +
        • New SMSound option: usePolicyFile - (boolean, default: false) - enables Flash to request /crossdomain.xml file for content on third-party domains, if access to ID3/metadata such as wave/peak/spectrum is needed. Will automagically enable if onid3() or peak/wave/spectrum features are being used.
        • +
        • console.warn()-style messaging (instead of throwing exceptions) if createSound() etc. are called before SM2 init has fired. Now calls similar warning and exits if called after a failed, unsuccessful startup (ie., timeout or not-supported case.)
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • SoundManager 2 core code cleanup, ~5% shaved off soundmanager2.js code size after new features, bug fixes and comments etc. Internal event handling (DOM-related events for init, IE 6 vs. everybody else) improved.
        • +
        • Flash builds optimized; Flash 9 SWF build now under 10 KB. Debug-enabled Flash 9 SWF now hooks into Flash debug player/IDE debugging tools (compiled with -debug=true)
        • +
        • Attempt to detect RTL documents, position Flash accordingly if so to avoid long horizontal scrollbar issue (related discussion)
        • +
        • iPhone + iPad touchmove() and related events added to page player + 360° player UI demos; tap and drag to seek should now work.
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.96a.20100822 - HTML5 audio support no longer alpha, Safari 5.0.1/SL HTML5 audio issues continue, iPad/iPhone "play through", Flash tweak for Android (Download archived version)

      +

      useHTML5Audio feature now considered beta-worthy, though disabled by default to be safe (with the exception of iPhone + iPad.) iPhone/iPad will now play a sequence of sounds, user interaction only required to start first one. Flash on-screen positioning tweak for Android devices that run Flash. Safari 5.0.1 on Snow Leopard exhibits same buggy HTML5 audio issue, disabled by default; Apple have been notified. IE 9 "Platform Preview 4" has <audio> but no Audio() support (yet?) See bug #586311 (may require connect.microsoft.com / Windows Live ID, login first etc.)

      + +
        + +
      • +

        Bug fixes

        +
          +
        • HTML5 Audio() still broken in Safari 5.0.1 on Snow Leopard (10.6.3, 10.6.4), where sounds intermittently fail to load and play. Apple are aware of the regression. Related bug: #32519. Include sm2-ignorebadua in URL on SM2 pages to ignore this check and verify broken behaviour, etc.
        • +
        • Tweaks for experimental RTMP feature re: handling of paused state, tracking of position and onfinish() firing early.
        • +
        • Bumped SWF z-index to 5000 for Safari 5, SoundCloud-reported bug-and-fix for Safari 5-specific bad redraw issues, and occasional crash case referencing WebCore::RenderLayer::paintLayer
        • +
        +
      • +
      • +

        API Updates

        +
          +
        • iPhone/iOS 4 and iPad can now play a sequence of sounds (once the user starts sound initially), provided onfinish() is used to create/play the next sound. Example: Muxtape-style UI on homepage will play through list without further interaction once a user plays something in the list.
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Special case for getting SM2 working more reliably on HTC Android + Flash 10.1, where flash does not load until on-screen (ie., in view.) If off-screen, Flash is repositioned at left/top 0px in order to load (including scroll/resize if needed), then events released and movie is repositioned off-screen. If movie is in the DOM already eg. as in useFlashBlock cases, flashLoadTimeout is set to 0 to allow infinite wait (eg., SM2 will not timeout with an error, and will simply load when the flash is scrolled into view.)
        • +
        • Documentation: Clarified createSound() behaviour if an existing sound ID is given (returns sound object "as-is", ignores any options passed.)
        • +
        • Page-player demo updated to use canPlayLink() instead of canPlayURL, more flexible link/type handling.
        • +
        • Homepage and documentation UI/layout and language tweaks, a few new "as seen on the internets" icons etc.
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.96a.20100624 - Safari 5/Snow Leopard 10.6.3/10.6.4 HTML5 Audio() issue, X-domain SWF build fixes (Download archived version)

      + +

      Disabling HTML5 Audio for Safari 5 on Snow Leopard 10.6.3 + 10.6.4 (current release) only, as it is broken similar to Safari 4.x (also on Snow Leopard only.) Related bug: #32519. Also, version info in SWFs and fixed X-domain SWF build.

      + +
        + +
      • +

        Bug fixes

        +
          +
        • HTML5 Audio() still broken in Safari 5 on Snow Leopard (10.6.3, 10.6.4) - disabling for now, falling back to Flash as with Safari 4.x on Snow Leopard. Include sm2-ignorebadua in URL to ignore this check and verify broken behaviour, etc.
        • +
        • Fixed X-domain SWF builds to actually work cross-domain.
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Added version info string to SWFs in Flash right-click / context menu, helpful when troubleshooting SWFs.
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.96a.20100606 - RTMP (Flash Media Server) Support, HTML5 Updates (Download archived version)

      + +

      HTML5 update, new RTMP feature: Experimental Flash Media Server support, onposition() event listener, SMSound type option and code cleanup.

      + +
        + +
      • +

        API Updates

        +
          +
        • New experimental RTMP support via kjvarga's fork at http://github.com/kjvarga/SoundManager2/ while maintaining existing NetStream-based behaviour for non-RTMP MPEG4 audio, etc. Uses new serverURL parameter for FMS (I used Red5 for dev/testing,) eg. soundManager.createSound({id:'rtmpTest',serverURL:'rtmp://localhost/oflaDemo',url:'oh-alberta.mp3'}).play();
        • +
        • New SMSound option for createSound(), load(), play(): 'type', for specifying MIME type alongside URL to help with detecting playability. eg. +soundManager.createSound({id:'foo', url:'/player.php?stream=1', type:'audio/mp3'}).play(); and so on. Hat tip: sylvinus.org
        • +
        • New SMSound event: onposition(), for attaching listeners to specific times within a sound.
        • +
        +
      • +
      • +

        Bug fixes

        +
          +
        • Flash sound unload/destroy ActionScript "could not close stream" exception/warning (finally?) fixed.
        • +
        • Sound looping updated for Flash 8, working (albeit with a quirk - requires preloading.)
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Removed Base64 HTML5 Audio() tests, redundant as numerous MIME (audio/mpeg, audio/mp3 etc.) checks seem to cover it.
        • +
        • Updated MPC (drum machine) demo from 2006-era design, modernizing the CSS a bit.
        • +
        • nullURL = 'about:blank' tweak for unloading (flash 8.) May have finally fixed that dumb stream closing error on unload/destroy.
        • +
        • set soundManager.didFlashBlock *before* firing onready()/onerror() listeners
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.96a.20100520 - HTML5 Edition (Download archived version)

      + +

      Experimental HTML5 support, lots of code shuffling and performance tweaks.

      + +
        + +
      • +

        API Updates

        +
          +
        • New soundManager.useHTML5Audio (disabled by default except for iPad, Palm Pre) - adds experimental HTML5 Audio support, with Flash fallback for MP3/MP4 formats as needed.
        • +
        • Sound looping now works in Flash! eg. mySound.play({loops:3}); - for an example + discussion of how to get near-seamless looping, see Seamless Looping MP3s in Flash (demo video) on Flickr.
        • +
        +
      • +
      • +

        Bug fixes

        +
          +
        • beginDelayedInit() is always used in lazy loading case (eg. via dynamic script tag/XHR etc.,) as some cases where SM2 won't auto-start eg. document.readyState empty for Firefox 3.5.5 (seen on Win32) with an HTML5 DOCTYPE.
        • +
        • SWF is now 8x8 pixels by default, vs. 6x6 pixels (odd fix for HTML5 Doctype on Firefox 3.6/win32)
        • +
        • Fixed dumb IE undefined ID bug
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • soundmanager2.swf and soundmanager2_flash9.swf are now "non-debug" versions; with debugMode enabled, soundmanager2_debug.swf and soundmanager2_flash9_debug.swf are loaded instead.
        • +
        • New build script for JS + SWFs, see file size table. JS compression now done via Google Closure compiler; new soundmanager-jsmin.js build, debug-enabled but compressed, in addition to build-script-optimized, no-debug, compressed JS (~9 KB with gzip vs. ~90 KB for raw, commented, debug-enabled version.)
        • +
        • Null check fix for unavailable eq/waveform data
        • +
        • Experimental video (flash 9-only) change: Use stage width/height instead of 0/0 when lacking metadata
        • +
        • Page player whileloading() calls now being throttled
        • +
        • Better page player click handling for IE 7
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.95b.20100323 (Download archived version)

      +

      useFlashBlock, better handling of time-out/errors (CSS-based SWF repositioning options for unblocking on time-out), "play MP3 button" demo, canPlayLink(), canPlayMIME(), eqData + waveformData for AAC/H.264 (movieStar) content, missing documentation and miscellaneous bug fixes.

      + +
        + +
      • +

        API Updates

        +
          +
        • New soundManager.useFlashBlock (disabled by default) - enables CSS classes assigned to SWF container indicate start-up state (ok/error/blocked), allowing positioning/display of SWF for unblock cases and successful recovery from unblocking. Built into homepage + (most) demos. Updated flashblock demo as well.
        • +
        • playableClass attribute eg. <a href="foo.php" class="inline-playable">, allowing URLs without .mp3 to be picked up
        • +
        • New soundManager.canPlayLink() + canPlayMIME(), ability to check <a href="foo.php" type="audio/mp3"> for example
        • +
        +
      • +
      • +

        Bug fixes

        +
          +
        • soundManager.play() type check fix, instanceof Object vs. typeof x === 'Object' (typo)
        • +
        • computeSpectrum() can access waveform and eq (spectrum) data for movieStar (AAC/MP4, netstream-based) objects, too.
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Moved old demo code using $() to _id(), _$ in soundManager2 to _id() to avoid potential jQuery (and other $-based library) collisions
        • +
        • Make new SoundManager('/path/to/swfs/'); actually work.
        • +
        • Flash time-out (flash blockers) vs. security failure detection/other error cases is smarter on the SM2 homepage now
        • +
        • New "MP3 player button" demo
        • +
        • Removed old IE onclick handler fix in several demos for non-MP3 links
        • +
        • eqeqeq = true for jslint, why not.
        • +
        +
      • + +
      +
    • + + +
    • +

      V2.95b.20100101 (Download archived version)

      +

      New features: Flash movie debugging in SWF via debugFlash (default:false), SMSound.eqData = { left:[], right:[] }, code tidying and debug output clean-up

      + +
        + +
      • +

        API Updates

        +
          +
        • New soundManager.debugFlash property, enables debug messages from within flash (output to flash movie). Useful for troubleshooting start-up, security issues etc. Flash debug output example
        • +
        • SMSound.eqData now has left and right channels - e.g. eqData = { left: [], right: [] } - was previously a single array: eqData = []; Backwards-compatibility is maintained for now as eqData[i] still works with the new structure.
        • +
        +

        Bug fixes

        +
          +
        • stream = true is no longer automatically set when SMSound.play() is called and readyState == 0, as it was breaking the stream:false case where playback should not start until the sound has fully-loaded.
        • +
        • soundManager.reboot() forces recreation of object/embed rather than old method of node remove/re-append (in case other options changed, eg. debugFlash was false, but assigned to true after an error during start-up.)
        • +
        +

        Miscellaneous

        +
          +
        • Review of all SM2 debug output, more concise and informative messaging - especially around start-up troubleshooting/error debugging, security sandbox errors, SWF 404 case etc.
        • +
        • Code formatting clean-up (via jsbeautifier.org) + soundmanager2.js tested and passes JSLint, Edition 2009-11-22 + options: /*jslint undef: true, bitwise: true, newcap: true, immed: true */
        • +
        • Better organization/use of strings for debug output
        • +
        • New canvas-based favicon VU meter demo for home page, 360 player and muxtape-style player demos where supported (Firefox and Opera, currently.) Firefox 3.6 is disappearing support for XBM images, which were previously used.
        • +
        +
      • + +
      +
    • + +
    • +

      V2.95a.20090717 (Download archived version)

      +

      New features: onready(), fast polling, flash blocking demos etc.

      + +
        + +
      • +

        API Updates

        +
          +
        • New soundManager.onready(myFunction[,scope]) method, for asynchronous queueing of onload()-style handlers. Fires when SM2 has finished initialising. Accepts an optional scope parameter to apply to handler; if none given, window object is used. A "status" object is passed to your handler (can be ignored) which includes a success boolean indicating whether SM2 loaded OK or not. Handlers added via onready() after successful initialisation will fire immediately.
        • +
        • New soundManager.oninitmovie() event callback, single assignment similar to onload(). Fires when the flash movie has first been written to (or read from) the DOM. Used internally for a flashblock-handler-related example, custom timeout condition.
        • +
        • New soundManager.useFastPolling property (false by default), enables 1 msec Flash 9+ timer for highest-possible whileplaying() and related JS callback frequency (default is 20 msec.) Use with soundManager.useHighPerformance = true for best performance, frame rates while updating the UI via whileplaying() etc.
        • +
        • New sound option (soundManager.defaultOptions): multiShotEvents (default:false) - enable support for multiShot-style events (currently onfinish() only). Eg. When mySound.play() is called three times, onfinish() will subsequently fire three times.
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • createSound now writes a warning to debug output if the sound ID is a number, or is a string starting with a numeric character. Because SMSound objects are stored in soundManager.sounds[], while not syntactically invalid, numeric IDs will be treated as array indices and are likely to break things.
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • New flashblock / "click to flash" demo, example of handling blocked conditions and graceful recovery when flash is initially blocked until user chooses to allow it.
        • +
        • Cross-domain-scripting enabled SWF (using allowDomain("*")) included in swf/ directory (in its own .zip file.) Use when you must have domain A loading SM2 .SWF from domain B, or for testing etc and can't compile your own custom x-domain SWF from source.
        • +
        • Documentation, layout and menu tweaks
        • +
        +
      • + +
      +
    • + +
    • +

      V2.95a.20090501 (Download archived version)

      +

      Lots of updates.

      + +
        + +
      • +

        API Updates

        +
          +
        • Added soundManager.allowFullVideo for full-screen video playback, triggered by double-clicking. Also, related soundManager.onfullscreenchange event handler.
        • +
        • Updated waveformData to include stereo channels. Now an object literal instead of a single array. New format: SMSound.waveformData = { left: [], right: [] }
        • +
        • New SMSound.ondataerror() (flash 9+) handler for cases where waveform/eq data is inaccessible due to other flash movies in the current browser which have loaded sound. (Flash must have security permissions to "read" all data currently being output, long story short. Having a YouTube tab open can cause this, for example.)
        • +
        • New isBuffering property for MovieStar (MP4 audio/video) content, related onbufferchange() event handler (sound object)
        • +
        • New bufferTime property for MovieStream content. Defines seconds of data to buffer before playback begins (null = flash default of 0.1 seconds; if AAC playback is gappy, try up to 3 seconds.)
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • Off-screen flash with wmode set to non-default value (transparent/opaque) will break SM2 for non-IE on Windows, time-out error style. SM2 will now revert wmode to default for this case (losing transparency/layering of movie) - or set soundManager.flashLoadTimeout to 0 and SM2 will retain wmode, but must now wait potentially infinitely for flash to load (until user scrolls it into view.) soundManager.specialWmodeCase reflects if this fix has been applied after init time.
        • +
        • Calling soundObject.load() after directly assigning a value to soundObject.url should now work as expected.
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • Shiny new "360° UI" canvas + visualization demos (Warning: Beta-ish code.)
        • +
        • Experimental SM2 exception/error handling + stack trace reporting added, an attempt to make custom errors thrown from SM2 more meaningful (ideally showing the user's call to SM2 where things went wrong in the stack.)
        • +
        • Calling soundObject.load() after directly assigning a value to soundObject.url should now work as expected.
        • +
        • soundManager.useHighPerformance update: Now false/disabled by default. Strange bug with JS/flash communication breaking with wmode=opaque on flash, specific (?) to Firefox on windows. SM2 does not normally set wmode. When useHighPerformance = true, wmode=transparent will be used on the flash movie by default.
        • +
        • Tweaks related to position, whileplaying(), playState, buffering and state resetting when sound has finished playing (fixes for a few edge cases if replaying or reusing the same sound or video.)
        • +
        • Better code/feature separation and clean-up on inline player, Muxtape-style demos
        • +
        +
      • + +
      +
    • + +
    • +

      V2.94a.20090206 (Download archived version)

      + +
        + +
      • +

        API Updates

        +
          +
        • New isBuffering property, related onbufferchange() event handler (sound object)
        • +
        • New soundManager.reboot() method (experimental): Shut down and re-initialise SoundManager, remove and recreate flash movie (possibly handy for cases where you want to restart after flashblock-type whitelisting, etc.)
        • +
        • New soundManager.flashLoadTimeout property, milliseconds SM2 will wait for flash movie callback before failing and calling soundManager.onerror() during start-up/init. If set to 0, SM2 will wait indefinitely for flash (good for reboot/flashblock-type scenarios.)
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • Reverted Firebug 1.3 console.log().apply() hack, was breaking console.log() under IE 8 RC1 (as used with debug mode.) Firebug 1.3 seems to have a bug, occasional "console undefined" error.
        • +
        • Fixed a dumb flash 9/AS3 bug with setVolume() passing an extra parameter to flash.
        • +
        • soundManager.useHighPerformance update: Now false/disabled by default. Strange bug with JS/flash communication breaking with wmode=opaque on flash, specific (?) to Firefox on windows. SM2 does not normally set wmode. When useHighPerformance = true, wmode=transparent will be used on the flash movie by default.
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • Tweaked project page / documentation UI, nicer code/debug formatting
        • +
        • Misc. API documentation fixes, improvements
        • +
        +
      • + +
      + +
    • + + +
    • +

      V2.93a.20090117 (Download archived version)

      + +
        + +
      • +

        General Updates

        +
          +
        • New SoundManager 2 start-up debugger / troubleshooting tool, built into project home (see troubleshooting, and a standalone version - see "troubleshoot/" directory of download package)
        • +
        • New soundManager.getMemoryUse() method (flash 9+.) Returns RAM use for flash plugin (appears to be browser-wide, possibly system-wide by design.) Video demo includes an example RAM use monitor.
        • +
        • highPerformance disabled by default for Firefox on Windows due to reports of bugs preventing SM2 start-up in some cases. To override the disabling safety check, set soundManager.useHighPerformance = 'always';
        • +
        • Updated API demo testcases (API Demo page)
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • Fixed Flash 8 bug with autoLoad/autoPlay and playState not being correctly set.
        • +
        • Fixed a bug with onfinish() not firing when autoPlay is used.
        • +
        • Fixed a bug with pan and volume defaults not being correctly inherited and handled
        • +
        • console[method]() now uses apply(), preventing possible Firebug 1.3-related scope issue where this != console
        • +
        • IE now appends (vs. destructive .innerHTML write) SWF movie to target element, appends DIV with className "sm2-object-box"
        • +
        +
      • + +
      + +
    • + + +
    • +

      V2.92a.20081224 (Download archived version)

      + +
        + +
      • +

        General Updates

        +
          +
        • Note: Flash (SWF) assets moved to swf/ subdirectory, starting with this version.
        • +
        • Updated design on API demo page, new looping example
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • Improved regular-expression-based URL detection for canPlayURL(), flash 8/9 and MovieStar (video) formats
        • +
        • Improved soundManager.url-related normalizeURL() handling. If GET parameters are in the URL including the SWF, it will be left alone.
        • +
        • Fixed out-of-bounds issue with setPosition().
        • +
        • Fixed a setPosition(0) and before onfinish()-related issue, so it is possible to nicely loop sounds from within onfinish() - see looping a sound (API demo)
        • +
        • Fixed an error condition where destroying a loading sound would not terminate the HTTP request, relating to error cases involving netStream.close().
        • +
        +
      • + +
      + +
    • + + +
    • +

      V2.91a.20081205 (Download archived version)

      + +
        + +
      • +

        General Updates

        +
          +
        • Completely-redesigned project page, multiple pages/sections, more-legible grid-based documentation layout
        • +
        • Code verified with jslint. 0 errors reported with default settings, Edition 2008-11-26
        • +
        +
      • + +
      • +

        Bug fixes

        +
          +
        • True XHTML DOM compatibility. Rewrote createMovie() to use standard DOM createElement() methods, vs. previous writing to .innerHTML method which caused exceptions with XHTML documents.
        • +
        • Special-cased useHighPerformance for Firefox 2 only, disabling it as it seems to be problematic. Further research pending.
        • +
        • Removed try .. catch error handling within soundManager.onload(), catching exceptions when calling user-defined onload handler. Errors should now fall through as normally expected.
        • +
        • Fixed several setPosition()-related bugs (NaN/undefined error, seeking to invalid position, position inconsistencies with pause/resume)
        • +
        +
      • +
      + +
    • + +
    • +

      V2.90a.20081028 (Old documentation theme) - Download archived version

      + +
        +
      • +

        API: Bug fixes

        +
          +
        • Fixed numerous Flash AS3 exceptions for Flash 10 plugin users of SM2 with Flash 9 .SWF
        • +
        • Fixed a setPosition() bug where position > duration would stop sounds playing in other tabs
        • +
        • Fixed createSound(); play(); destruct(); sequence to correctly stop sound under Flash 9
        • +
        • Changed Flash 9 onload() to properly pass boolean "false" on load failure, same as Flash 8
        • +
        • Fixed autoLoad=true bug with Flash 9 movieStar (MPEG4) content, now pauses after creating
        • +
        +
      • + +
      • +

        API: New shiny!

        +
          +
        • soundManager.useHighPerformance: Minimize JS/Flash lag, ~3x whileplaying() frequency! (Most noticeable on Mac OS X, and Safari on Windows? Investigating IE cases.)
        • +
        • soundManager.pauseAll() / soundManager.resumeAll(): Global pause/resume
        • +
        • soundManager.muteAll() / soundManager.unmuteAll(): Global mute/unmute
        • +
        +
      • + +
      • +

        MovieStar MPEG4 video support! (experimental)

        +
          +
        • soundManager.createVideo() / soundManager.destroyVideo() for MovieStar MPEG4 formats!
        • +
        • Uses same SMSound instance object and API methods/options as regular sounds, with a few extra parameters
        • +
        • soundManager.useVideo will show video when applicable (false/disabled by default)
        • +
        • SMSound.onmetadata: Meta data handler for MPEG4 video files - provides dimensions (w/h)
        • +
        +
      • + +
      • +

        Miscellaneous

        +
          +
        • Removed experimental flashBlock support. Considering eliminating SM2 timeout-based onerror() behaviour in favour of asynchronous loading (eg. user may initially block, notice flash movie and take action to unblock many seconds after loading - thus, flash movie eventually loads and can eventually trigger successful SM2 init.)
        • +
        • Modified pause() and resume() to only affect playing sounds (eg. playState != 0).
        • +
        +
      • + +
      + +
    • + + + +
    • +

      V2.80a.20081005

      + +
        +
      • +

        API: Bug fixes

        +
          +
        • Changed Flash 8 onload() boolean "loaded" to be based on sound duration being >0, better test of load success.
        • +
        • Modified Flash 9 onload() to include boolean result for success/fail, parity with Flash 8
        • +
        +
      • + +
      • +

        API: New shiny!

        +
          +
        • +

          Added experimental Flash 9.0r115+ (flash codename "MovieStar", Flash 9 Update 3) MPEG4 / HE-AAC support (audio only.) A subset of MPEG4 should be supported including FLV, MP4, M4A, MOV, MP4V, 3GP and 3G2 files. Feature is disabled by default.

          +
            +
          • New soundManager useMovieStar property, controls feature availability (currently disabled by default.)
          • +
          • New SMSound option, isMovieStar, configures feature behaviour on a per-sound basis. Default (null) is to auto-detect .mp4, .mov etc. in URL and enable if found, but can also be forced on or off (true / false).
          • +
          • Video-based formats use the Flash 9 NetStream and NetConnection objects, whose API differs slightly from the Sound object. Seeking is limited to video key frames and is not as smooth as an MP3.
          • +
          • Audio playback has been seen to pause during certain events (window scrolling, etc.) while playing MovieStar formats. It doesn't appear to be from CPU overload. More investigation is needed.
          • +
          • Basic load, progress, onload, whileplaying API support is provided (page player demo includes MP4 and FLV formats). Not all methods (eg. setVolume) have been tested.
          • +
          • .AVI is not included by default, but may work if the format is actually MPEG4-based.
          • +
          • Format limitation note: EQ, peak and spectrumData are not available with MovieStar content. This may be a Flash 9/AS3 limitation.
          • +
          +
        • +
        +
      • + +
      • +
          +
        • +

          Miscellaneous

          +
            +
          • Added CSS checks to page player: "exclude" and "playable" to override default URL matching behaviour.
          • +
          +
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.78a.20080920

      + +
        +
      • +

        API: Bug fixes

        +
          +
        • Added SoundLoaderContext parameter to load(), Flash should now check policy-related (crossdomain.xml) files when loading resources from remote domains. Should fix previous security exception warnings when trying to access ID3 and/or waveform/EQ data. See related SoundLoaderContext documentation (ActionScript 3)
        • +
        • Fixed a bug with load(), was improperly expecting an options object - now works properly.
        • +
        +
      • +
      • +

        API: New shiny!

        +
          +
        • Added soundManager.altURL property (and useAltURL conditional) for convenient offline and other URL switching cases (dev vs. production environments, etc.)
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Renamed internal soundManager and SMSound self closure references to _s and _t, respectively, to avoid potential conflicts with others' code
        • +
        • Moved self-destruct to use window.onunload instead of onbeforeunload, given the latter event can be caught and canceled if desired by the user
        • +
        • Inline player demo: Added autoPlay option
        • +
        • "Basic" demo directory (demo/basic/) moved to demo/api/, added load()-related testcase
        • +
        +
      • +
      + +
    • + +
    • +

      V2.78a.20080920

      + +
        +
      • +

        API: Bug fixes

        +
          +
        • Added SoundLoaderContext parameter to load(), Flash should now check policy-related (crossdomain.xml) files when loading resources from remote domains. Should fix previous security exception warnings when trying to access ID3 and/or waveform/EQ data. See related SoundLoaderContext documentation (ActionScript 3)
        • +
        • Fixed a bug with load(), was improperly expecting an options object - now works properly.
        • +
        +
      • +
      • +

        API: New shiny!

        +
          +
        • Added soundManager.altURL property (and useAltURL conditional) for convenient offline and other URL switching cases (dev vs. production environments, etc.)
        • +
        +
      • +
      • +

        Miscellaneous

        +
          +
        • Renamed internal soundManager and SMSound self closure references to _s and _t, respectively, to avoid potential conflicts with others' code
        • +
        • Moved self-destruct to use window.onunload instead of onbeforeunload, given the latter event can be caught and canceled if desired by the user
        • +
        • Inline player demo: Added autoPlay option
        • +
        • "Basic" demo directory (demo/basic/) moved to demo/api/, added load()-related testcase
        • +
        +
      • +
      + +
    • + +
    • +

      V2.77a.20080901

      + +
        + +
      • +

        API: Bug fixes

        +
          +
        • Fixed some mute() / unmute()-related bugs, global muting should now work properly. Added some related demo page examples.
        • +
        • Removed comment on flash9Options merging code, was previously new and didn't actually work as it was commented out. Oops. :D
        • +
        • Added experimental Flashblock exception handling (mozilla/firefox extension), "notification bar"-style UI which can message and assist users in unblocking SM2 .swf. Configured via soundManager.flashBlockHelper object, currently disabled by default.
        • +
        • Modified soundManager.destroySound() and sound.destruct(), fixed a bug with these methods and flash's unloading of sounds which was breaking things. Hopefully fixes destroying sounds within whileplaying() and related event handlers, too.
        • +
        • Modified flash 9 "peak data" code to only set the data if the feature is actually enabled.
        • +
        • Modified soundManager._debug() to list all sound object details, instead of just ID/URL.
        • +
        +
      • + +
      + +
    • + +
    • +

      V2.76a.20080808

      + +
        + +
      • +

        API: Bug fixes

        +
          +
        • Fixed some memory "leaks" / garbage collection issues. RAM allocated to load sounds previously wasn't freed until page unload; now memory should be garbage collected some time after sound.unload() and/or soundManager.destroySound()/sound.destruct() methods are called. In certain cases, Flash sound objects may be destroyed and re-created (transparent to the JS-side) to release memory. Note that garbage collection is not instantaneous, and is affected by CPU/system load and other variables.
        • +
        • Fixed an issue with play() not working on sounds created with autoPlay.
        • +
        • Fixed SM2 to work under proper XHTML (served as application/xhtml+xml MIME type). Rewrote object/embed code again, now version-agnostic for IE (no CLSID parameters.)
        • +
        • Corrected reported loadFromXML() bug, multiple loadFromXML() calls should work.
        • +
        +
      • + +
      • +

        API: New shiny!

        +
          +
        • New useWaveformData and useEQData sound options, providing access to raw waveform and sound frequency/EQ spectrum data via sound.waveformData and sound.eqData.
        • +
        • Renamed useSpectrumData to useWaveformData - if using waveform stuff currently, make sure you update your code!
        • +
        • Added soundManager.features object, which reflects the "support" state for peakData, waveformData and eqData. Handy for current and future version/support branching.
        • +
        +
      • + +
      • +

        API: Miscellaneous

        +
          +
        • New flash9Options configuration object for logical separation. When Flash 9+ is used, these options are merged into the defaultOptions object.
        • +
        • Added allowDomain() stubs and documentation to .as source for allowing .swf on external domains to work (recompile of .swf required)
        • +
        +
      • + +
      • +

        "Page As Playlist" demo: Updates

        +
          +
        • Added "favicon" VU meter display option (Flash 9+ only, experimental, currently Firefox/Opera only)
        • +
        • More-efficient RAM use via unload() and destruct() sound methods, discarding inactive sounds and freeing RAM as appropriate.
        • +
        • Added useEQData, showing sound spectrum (frequency range) instead of raw waveform
        • +
        • Added fillGraph config option, allowing solid waveform graphs instead of only peak points
        • +
        • Fixed playNext bug where same track couldn't be played twice in a row.
        • +
        • Fixed duplicate URL bug; items with identical MP3 URLs will now work. (Previously, URL was the ID for items and thus had to be unique. Lookup is now done by object.)
        • +
        • Modified MP3 URL search to include URL parameters, characters after ".mp3"
        • +
        +
      • + +
      • +

        Other updates

        +
          +
        • Demo code clean-up, externalised CSS, prettier demo layout and code color highlighting
        • +
        +
      • + +
      +
    • + +
    • +

      V2.75a.20080707

      +
        +
      • Flash 9 support! (soundmanager2_flash9.swf) - multiShot now actually works (layering/"chorus" effects on sounds), new spectrumData and peakData API features. All existing API features should have parity.
      • +
      • Added soundManager.flashVersion property. Flash 8 is the supplied default.
      • +
      • Modified soundManager.url to require only a path, eg. /path/to/soundmanager-swfs/ to allow loading of varying .SWF versions.
      • +
      • Basic (API) demo: Updated multiShot/Flash 9 behaviour documentation
      • +
      • Page player demo: Added optional spectrum and VU (spectrumData/peakData) features
      • +
      • MPC + animation demos: Modified to use Flash 9 (demo improved multiShot feature)
      • +
      • Flash 9 behaviour differences: +
          +
        • multiShot properly allows play() to be called multiple times on a sound object, creating desired "chorus" effect. Will call onfinish() multiple times, but whileplaying() etc. are called only for the first "play instance" to avoid complications.
        • +
        • New soundSpectrum and peakData sound features (spectrum graph / "VU" meter-style data) available
        • +
        • Sounds can be actually unloaded ("null" MP3 no longer needed to cancel loading of an MP3), but URL cannot be changed without destroying and recreating the related Flash sound object. The Flash 9 version does this to maintain API consistency.
        • +
        +
      • +
      • New + improved documentation/project page, updated 2-column layout with content filters, "Get Satisfaction" integration and self-update checks (and a light-switch-related easter egg.)
      • +
      +
    • + +
    • +

      V2.5b.20080525

      +
        +
      • Added waitForWindowLoad for delayed init
      • +
      • Added onpause() and onresume() event handlers
      • +
      • Added mute() and unmute()
      • +
      • Updated demos, revised documentation
      • +
      +
    • + +
    • +

      V2.5b.20080505

      +
        +
      • To improve startup time, soundManager.go() (createMovie() alias) now fires at onDOMContentLoaded() by default if supported. (Otherwise, falls back to window.onload().)
      • +
      • Improved initialisation routine - soundManager.onerror() is called when the Flash init "times out." Specifically, onerror() is called when Flash fails to make an ExternalInterface (Flash-> JS) call to SM2 within 1 second of window.onload() firing.
      • +
      • Added logic to handle special Safari delayed init case (Flash not loading when in a new, unfocused tab until focused) as a exception to the above.
      • +
      • Added better exception handling + debug messaging for initialisation failure cases (Flash security restrictions due to loading from local file system, no flash support, no ExternalInterface support etc.)
      • +
      • Updated .swf appendChild() target to use best-to-worst options: (document.body || document.documentElement || document.getElementsByTagName('div')[0])
      • +
      • Safari console[log|warn|error]-style messages are now properly formatted.
      • +
      • Added tons of semicolons to closing braces, eg. };
      • +
      • "No-debug", minified version of SM2 included: soundmanager2-nodebug-jsmin.js (17.4 KB, down from full size of 35 KB.) With Gzip compression, file size is ~6 KB. (Commented, debug-enabled version compresses to 10 KB with Gzip.)
      • +
      +
    • + +
    • + +

      V2.5b.20080501

      +

      Warning: A little experimental too, read details below.

      +

      Changelog:

      +
        +
      • Rewrote SoundManager initialisation: "Way faster." Communication now initiated from Flash, verification callback then performed by JS; far faster, hopefully more-reliable (TBD.) Init time drastically reduced from seconds to milliseconds in most cases, dependent primarily on Flash movie load rather than window.onload().
      • +
      • Above change also fixes Safari "loading SM2 in background tab" issue, where Safari does not init Flash until background tab comes into focus (when a link is opened in a new, non-focused tab.)
      • +
      • Current drawback: Difficult to determine, save for falling back to window.onload() plus focus methods due to above issue, whether SM2 is actually available or not (ie., soundManager.onerror() will not likely be called as in past.) However, the supported() method will correctly reflect if SM2 has successfully initialised, for example.
      • +
      • Added sandbox/security model code; SM2 can now tell if it is restricted to either local or internet access only, for example. Helpful in potential debugging errors, plus viewing demos off the local filesystem should no longer throw init errors requiring whitelisting (seemingly due to the new initialisation method.) Win!
      • +
      • Opera 9.27 has been noted to have some bugs relating to ExternalInterface, seems to be unable to make calls from ActionScript-level methods using setTimeout() or setInterval(). As a reulst, SoundManager 2 events like onfinish(), whileplaying() and onfinish() can be sporadically called or missed altogether. No known workaround at this time, but Opera 9.5 (beta 2) does not have this issue. Popular MP3 "mix tape" site muxtape.com uses similar techniques for JS-Flash communication and appears to suffer from the same problem.
      • +
      • Warning: Random crash issue noticed when using IE 6 + 7 and this demo page, calling createSound() when soundManager.defaultOptions.autoLoad = true; from within soundManager.onload(), for creating + preloading the tab/theme switch sounds. Removing autoLoad=true (leaving the default of false) fixed the crash. Exact reason not determined, perhaps recursive calls or pre-onload issue (?), seems to be isolated to the home page. MPC demo uses autoLoad also, but did not crash. Mentioning just in case.
      • +
      • Updated Muxtape-style demo: More themes, load/security debugging info etc.
      • +
      +
    • + +
    • + +

      V2.2.20080420

      +

      Changelog:

      +
        +
      • More demos! "Page as a playlist" (muxtape.com-style) example, "Make MP3 links playable inline" demo
      • +
      • Corrected onStop() handler inheritance/overriding behaviour (was incorrectly checking defaultOptions)
      • +
      • Added debug output of options object for createSound() calls. Full options (result of merging global default + sound-instance-specific options) displayed, helpful in troubleshooting. Event handler function code is intelligently (hopefully) displayed, truncated at 64 characters of first block or end of line, whichever comes first.
      • +
      • Removed most HTML markup from non-HTML (eg. console) _writeDebug() calls
      • +
      • soundManager.destruct() writes to console, to be consistent
      • +
      + +
    • + +
    • + +

      V2.1.20080331

      +

      Changelog:

      +
        +
      • Modified createSound() to return a sound object if successful (more logical)
      • +
      • Updated setPosition() method and added position option parameter, documentation + demo (bugfix)
      • +
      • Corrected createSound() and play() sound option inheritance/overriding behaviour (eg. position) to work as expected (most to least important: Method call options -> sound object instance options -> SM2 global options)
      • +
      • Updated deleteSound() so Array.splice() is used instead of delete, the latter doesn't cause Array.length to update (bugfix)
      • +
      • Modified debug=alert to only work when debug mode is enabled (potential annoyance aversion)
      • +
      • Modified togglePause() to use position option parameter rather than undocumented offset (oops :D)
      • +
      • Added supported() convenience method (indicates pass/fail after SM2 has initialised.)
      • +
      • Added disabling debug calls from Flash (performance)
      • +
      • Added URL hash updating/bookmarking and page title updating to jsAMP demo app
      • +
      • Updated project page layout
      • +
      + +
    • + +
    • + +

      V2.0b.20070415

      +

      Changelog:

      +
        +
      • Added destroySound() method
      • +
      • Made debug output slightly less-verbose (commented out)
      • +
      • Safety tweak for position-related Flash bug when loading new sounds
      • +
      • Highly-expanded documentation (SMSound events + properties, examples, caveats, FAQs etc.)
      • +
      • Added time-sensitive light/dark theme for documentation
      • +
      + +
    • + +
    • + +

      V2.0b.20070201

      +

      Second beta?

      +

      Changelog:

      +
        +
      • Fixed stopAll() bug (previously broken)
      • +
      • Added nullURL parameter
      • +
      • Updated documentation
      • +
      +

      V2.0b.20070123

      +

      V2.0b.20070118

      +

      V2.0b.20070115

      +
    • + +
    • +

      V2.0b.20070107

      +

      First beta

      +
    • + +
    • +

      V2.0a.20060904

      +

      Prerelease alpha

      +
    • + +
    + + + +
    + +
    + +
    + + +
    + + + + +
    + + + +
    + + + +
    + +
    + + +
    + + +
    + + + + + + diff --git a/js/libs/soundmanager/doc/getstarted/index.html b/js/libs/soundmanager/doc/getstarted/index.html new file mode 100644 index 0000000..94e0469 --- /dev/null +++ b/js/libs/soundmanager/doc/getstarted/index.html @@ -0,0 +1,552 @@ + + + +SoundManager 2 Tutorial: Getting Started + + + + + + + + + + + + + + + + + + +
    + + + +
    + +
    +
    +

    How SoundManager Works

    +

    It starts out easy, but you can go down the rabbit hole if you want.

    +
    + +
    + +
    + + + +

    SoundManager 2 Tutorial: What, Why, How

    + +

    Problem: Browsers lack good, consistent native audio support. (HTML 5's Audio() is the future, but does not have majority support yet.)

    +

    Solution: Javascript API via Flash + ExternalInterface, works almost everywhere. If HTML5 audio support is enabled, flash fallback used for browsers that don't support "non-free" MP3 + MP4 formats.

    +

    SoundManager 2 wraps and extends both the Flash and HTML Audio Sound APIs, providing a single, unified sound API to Javascript; the API is the same, whether HTML or Flash is ultimately used to play sound. (The flash portion is hidden, transparent to both developers and end users.)

    + +
    + +
    + + +

    Including SoundManager

    + +

    The soundmanager2.js core can get down to 10 KB over the wire, depending on what version you use. A few versions of the SM2 script are available, balancing code size between commented, debug-enabled and production-optimized builds.

    +

    Regardless of which build you use, take advantage of gzip compression on your server for big savings. As shown below, SoundManager 2 compresses quite well with gzip; the full debug-enabled version served with gzip is smaller than even the minified, no-debug version served without it.

    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    Build versionRecommended useFile size+ gzip
    +

    Original, formatted debug-enabled version with comments. Passes jslint.

    +
    <script src="soundmanager2.js"></script>
    +
    Development, testing, debugging90 KB~25 KB
    +

    Minified (Google Closure Compiler-munged, no comments or whitespace), debug-enabled version

    +
    <script src="soundmanager2-jsmin.js"></script>
    +
    Production, with debug code42 KB~14 KB
    +

    Build-script optimized, minified, no-debug version

    +
    <script src="soundmanager2-nodebug-jsmin.js"></script>
    +
    Production-optimized, debug code removed30 KB~9.5 KB!
    + +

    You then need to tell SM2 where to find the flash .SWF it will need (if no HTML5 support), and optionally what version of Flash (~3 KB for flash 8, ~10 KB for flash 9) depending on what API features you want, as well as other features:

    + +
    +<script>
    +soundManager.url = '/path/to/swf-files/';
    +soundManager.flashVersion = 9; // optional: shiny features (default = 8)
    +soundManager.useFlashBlock = false; // optionally, enable when you're ready to dive in
    +// enable HTML5 audio support, if you're feeling adventurous. iPad/iPhone will always get this.
    +// soundManager.useHTML5Audio = true;
    +soundManager.onready(function() {
    +  // Ready to use; soundManager.createSound() etc. can now be called.
    +});
    +</script>
    + +

    If you plan to eventually use the flash block handling feature (disabled in this example), you'll want to look at the flash block demo and include the relevant CSS it uses.

    + + + +

    Basic SoundManager Template

    + +

    For a live example of a page including SoundManager 2, check the bare-bones template.

    + +

    SoundManager File Structure

    +

    Or, "What you get when you download SM2."

    +

    The core audio API bits require script/soundmanager2.js and the SWF files swf/soundmanager2.swf and swf/soundmanager2_flash9.swf, as well as the _debug versions of the SWFs. The flash 9 SWF enables some extra API features, and is only used if you set soundManager.flashVersion = 9 (the default is 8.)

    + +
      +
    • + soundmanager2/ +
        +
      • + demo/ - Examples, MP3 player UIs etc. +
      • +
      • + doc/ - API method documentation, notes, troubleshooting +
      • +
      • + script/ - API core, soundmanager2.js +
      • +
      • + src/ - AS2/AS3 Flash source used to build SWFs (for flash development) +
      • +
      • + swf/ - API core, SoundManager 2 .SWF files +
      • +
      • + troubleshoot/ - Tool for finding/fixing startup issues +
      • +
      +
    • +
    + +

    How SoundManager 2 Really Works

    + +

    SoundManager 2 is the result of Javascript talking to a hidden Flash movie. The Flash layer is not something you have to work with directly, but it is the component which makes audio control possible behind the scenes.

    + +
    + +
    + soundmanager2.js <-flash externalinterface magic-> soundmanager2.swf <- HTTP -> .mp3/.mp4 +
    + +
    + +

    Flash can expose methods to Javascript via ExternalInterface, allowing bi-directional calls to be made and thus providing additional functionality to Javascript.

    + +

    For the real gory details on the behind-the-scenes action of JS + Flash, see How SoundManager 2 Works on schillmania.com.

    + + +
    + +
    + +

    Startup / Initialization

    + +

    In brief, here is now SM2 starts up:

    +
      +
    • soundmanager2.js loads
    • +
    • new SoundManager() constructor call, event listeners attached for dom ready/init
    • +
    • document.createElement('embed') (or 'object' for IE), append Flash .SWF to document
    • +
    • SWF loads, Flash makes call to JS function: "Hi, JS!"
    • +
    • JS -> Flash test (JS calls Flash function): "Hello, Flash!"
    • +
    • -- startup is complete, soundManager.onready() fires --
    • +
    + +

    A single Javascript include will link in all of the required code for the library, which will automatically begin loading either at onDOMContentLoaded() if supported, or alternately, after window.onload() (eg., IE 6 and others.) The default behaviour is to start "as soon as possible", but the library can be configured to wait for window.onload() in all cases as well. Loading and initialisation are separate events.

    + +

    Once initialised, SM2 will call event handlers/listeners registered via soundManager.onready(). There are also "old-skool" onload()/onerror() event handlers which you can define just as you would with window.onload().

    + +

    If you want to lazy-load or defer SM2, see Lazy-loading and SM2_DEFER.

    + +

    SoundManager onready() / ontimeout() and onload() / onerror() Event Handlers

    + +

    onready() is a flexible method that can be used to queue numerous listeners for SM2's successful start-up. Simply pass a callback function, which will be called when SM2 has successfully started:

    + +
    soundManager.onready(function() {
    +    // SM2 is ready to go!
    +    makeSomeNoise(); // soundManager.createSound(), etc.
    +});
    + +

    ontimeout() is used to add listeners for SM2 init failures, which can happen due to missing or blocked Flash support. They are not necessarily fatal as in the flash block case, where onready() calls can follow ontimeout() if the user unblocks flash after a failed init attempt.

    + +
    soundManager.ontimeout(function() {
    +    // SM2 could not start. Flash blocked, missing or security error? Complain, etc.?
    +});
    + +

    SoundManager onload() + onerror()

    + +

    A more traditional, less-flexible style of event handling is to assign single onload() / onerror() handlers. You should use onready() as it can be assigned at any time once soundManager has been defined, and is more robust.

    + +
    soundManager.onload = function() {
    +  // SM2 is ready to go!
    +  makeSomeNoise(); // soundManager.createSound(), etc.
    +}
    +
    +soundManager.onerror = function() {
    +  // SM2 could not start, no sound support, something broke etc. Handle gracefully.
    +  disableSoundInMyApp(); // for example
    +}
    + +

    Lazy-loading SM2 (deferred start-up): SM2_DEFER

    + +

    Let's say you wanted to load and start SM2 after your page has loaded, using Javascript to insert a script node etc., or otherwise only start SM2 conditionally. You can edit soundmanager2.js and take out the SoundManager() constructor call at the bottom, or set the global variable SM2_DEFER = true which will have the same effect.

    +

    Example:

    + +
    function lazy_load_sm2() {
    +  window.SM2_DEFER = true;
    +  // -- load soundmanager2.js via <script>, createElement('script') or XHR etc. --
    +  // imaginary load_script() function ..
    +  load_script('/path/to/soundmanager2.js', function() {
    +    // once soundmanager2.js has loaded and has parsed, construct + init.
    +    window.soundManager = new SoundManager(); // Flash expects window.soundManager.
    +    soundManager.beginDelayedInit(); // start SM2 init.
    +  });
    +}
    + +

    For a live demo, check out the deferred loading example.

    + +
    + + +
    + +
    + +
    + +
    +

    Sound Options Object Format

    +

    Object Literal, JSON-style data passed to createSound() and play()

    +
    + +
    + +
    + +

    Object Literal Format

    + +

    Sounds can be created with instance-specific parameters in an object literal (JSON-style) format, where omitted parameters inherit default values as defined in soundManager.

    + +
    soundManager.createSound({
    +  id: 'mySound',
    +  url: '/path/to/some.mp3',
    +  autoLoad: true,
    +  autoPlay: false,
    +  onload: function() {
    +    alert('The sound '+this.sID+' loaded!');
    +  },
    +  volume: 50
    +});
    + +

    This object can also be passed as an optional argument to the play method, overriding options set at creation time.

    + +

    For a full list of available options, see Sound Properties Object

    + +
    + + +
    + +
    + +
    +
    +

    "Use Responsibly"

    +

    Only you can prevent audio pollution?

    +
    + +
    + +
    + +

    A Word Of Vice

    +

    Not every button, link, element or paragraph on the web needs to zoom, move, change colour and be noisy, repetitive and annoying all at the same time. Use your own discretion!

    +

    Sites which automatically start playing background sound, and/or don't have volume or mute controls are the kind of things you should avoid building. As a developer, gentle reader, you may eventually find yourself in such a situation. Please do your part in enhancing the web with sound if you use SM2, while at the same time keeping it audibly usable. :)

    + +
    + +
    + +
    + +
    + +
    +

    Troubleshooting

    +

    Console-style messaging, useful for troubleshooting start-up and runtime issues.

    +
    + +
    + +

    SoundManager 2 Start-up and Debug Tools

    +

    This troubleshooting tool can come in handy for debugging SM2 start-up problems.

    + +

    Flash options: Flash 8 (default), Flash 9 (normal) or Flash 9 + highPerformance + fastPolling modes.

    + +
    +
      + +
    • +

      OKFAILN/AUnknownSoundManager 2 start-up

      +
      +

      soundManager.onload() or soundManager.onerror() is ultimately called when start-up completes.

      +

      If you're seeing a failure, refer to the below for troubleshooting details for common causes.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash

      +
      +

      The Flash 8 plugin is a minimal requirement for SoundManager 2, but the exact requirement varies based on soundManager.flashVersion. You are currently using [unknown].

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash SWF

      +
      +

      SoundManager 2 must load a flash movie before initialisation can proceed. If you have errors here, check that soundManager.url is correctly defined and that the URL being loaded is correct.

      +

      If the Flash movie URL is OK, Flash security or flash blockers are the likely cause. Check the section below.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash -> JS

      +
      +

      Once the flash component of SM2 has loaded, it tries to make a call to Javascript-land. This is a common point of failure, for security reasons.

      +
        +
      • +

        Have a flash blocker? Check that the SM2 flash movie (below) is loading and is not being blocked.

        +
      • +
      • + First time opening SM2 after downloading it? Is your browser URL at file:// or c:/path/ or otherwise not using HTTP? Flash security "whitelisting" is required to allow Flash + JS to work when offline, placing it in the "LocalTrusted" Flash security sandbox rather than "localWithFile". + +
        +

        Offline viewing: Adding a "trusted location" to the Flash Security Settings Panel

        +

        The Flash Player Global Security Settings Panel is a web-based control panel which allows you to configure Flash security. You will need to add the path of the SoundManager 2 project in order for it to work "offline" (ie., when viewing via file:// or c:/)

        +

        Show me how: Adding a "trusted location"

        + +

        Launch the Flash Security Settings Panel

        +
        + +
      • +
      • Flash blockers (FlashBlock, "click to flash" etc.) preventing flash load and start-up - need whitelisting/"allow this domain" to work smoothly. If you suspect blocking is the issue, try the SoundManager 2 Flashblock demo.
      • +
      • Online viewing (HTTP/S): Same-domain security rules apply to HTML + Flash content by default (crossdomain.xml/allowDomain() in .AS source required to override.)
      • +
      +

      See Flash debug output for more security error details.

      + +
      +

      Online viewing: Cross-domain security restrictions

      +

      HTML page on domain A loading .SWF from domain B: Flash security prevents JS + Flash when a cross-domain XML permission file is not available on domain B, and/or flash movie was not compiled with allowDomain('domainA') or allowDomain('*') - note that the SWF distributed with SM2 does not use this by default; try using the cross-domain version of the SWF, or compile your own which whitelists your own domain(s).

      + +

      Flash Blockers

      +

      Browser extensions/add-ons like "FlashBlock" and "click to flash" can prevent the .SWF from loading, and this will mean SM2 will time-out and fail waiting for a response from Flash. For development, it's best to whitelist the domain(s) or the .SWF for SM2 to allow it to work.

      +

      Have a flash blocker installed? Want to test it? Try the SoundManager 2 Flashblock demo.

      + +
      + +
      +
    • + +
    • +

      OKErrorN/AUnknownJS -> Flash

      +
      +

      At this point, Javascript attempts to respond to Flash's initial outgoing Flash -> JS call, completing the test for JS/flash communication. If SM2 does not receive a response from flash, it will eventually fail.

      +

      Offline viewing conditions and cross-domain security rules will prevent Flash <-> JS communication. See the details of Flash -> JS for information.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownSound test

      +
      +

      Here, a simple createSound() call is made to test SM2's actual operation. A sound should load and play provided SM2 was able to start successfully.

      +
      +
    • + +
    +
    + +

    Flash detection code from Flash Detect (featureblend.com)

    + +

    Flash Movie Debug Output

    +

    When soundManager.debugFlash = true, Flash will write debug info as text to the flash movie. This can be helpful for troubleshooting Flash/JS issues when timeouts or security errors are involved which prevent Flash from talking to Javascript, potentially hiding useful debug information. A CSS class of flash_debug will also be appended to the Flash #sm2-container DIV element when enabled, if you wish to style it differently.

    +

    You can also specify ?debug=1 in the URL to the SWF, and it will write debug output. Try soundmanager2_debug.swf?debug=1, or soundmanager2_flash9_debug.swf?debug=1. + +

    + +
    + +

    Live Debug Output

    +

    SoundManager 2 relies on Javascript and Flash communicating via ExternalInterface, and this is subject to a number of timing, loading and browser security conditions. Because of this complexity, debug information is essential for troubleshooting start-up, loading, initialization and error conditions between Flash and Javascript.

    +

    With debug mode enabled via soundManager.debugMode = true, SM2 can write helpful troubleshooting information to javascript console.log()-style interfaces. Additionally, output can be written to an optional DIV element with the ID of "soundmanager-debug".

    +

    If loading from the local filesystem (offline eg. file://, not over HTTP), Flash security is likely preventing SM2 from talking to Javascript. You will need to add this project's directory to the trusted locations in the Flash global security settings panel, or simply view this page over HTTP.

    +

    Below is a live example of debug output.

    +
    +
    + +
    +
    +

    For more examples of live debug output, see the Basic Template, API demo and other demos in the top navigation.

    + +

    Standalone version of troubleshooting tool

    +

    For debugging your development/production environment with this widget, see the troubleshooting subdirectory of the SoundManager 2 package.

    + +
    + +
    + +
    + + + + +
    + +
    + + + +
    + +
    + + +
    + + +
    + + + + + + diff --git a/js/libs/soundmanager/doc/index.html b/js/libs/soundmanager/doc/index.html new file mode 100644 index 0000000..1b220e7 --- /dev/null +++ b/js/libs/soundmanager/doc/index.html @@ -0,0 +1,1687 @@ + + + +SoundManager 2: Documentation + + + + + + + + + + + + + + + + + +
    + + + +
    + + +
    + +
    +
    +
    + +
    +
    +
    + +
    + +
    +
    +

    SoundManager Configuration

    +

    Flash URLs, version + performance options

    +
    +
    + +

    SoundManager Properties

    + +
    + +

    SoundManager has properties which configure debug mode, flash movie path and other behaviours. At minimum, the soundManager.url property must be assigned a path used to look for the necessary flash movie.

    + +
    allowPolling = true;     // enable flash status updates. Required for whileloading/whileplaying.
    +consoleOnly = false;     // if console is being used, do not create/write to #soundmanager-debug
    +debugMode = true;        // enable debugging output (div#soundmanager-debug, OR console..)
    +debugFlash = false;      // enable debugging output inside SWF, troubleshoot Flash/browser issues
    +flashLoadTimeout = 1000; // ms to wait for flash movie to load before failing (0 = infinity)
    +flashVersion = 8;        // version of flash to require, either 8 or 9. Some features require 9.
    +nullURL = 'about:blank'; // (Flash 8 only): URL of silent/blank MP3 for unloading/stop request.
    +url = '/path/to/swfs/';  // path (directory) where SM2 .SWF files will be found.
    +useConsole = true;       // use firebug/safari console.log()-type debug console if available
    +useMovieStar = true;     // enable Flash 9.0r115+ MPEG4 audio support
    +useFastPolling = false;  // fast timer=higher callback frequency, combine w/useHighPerformance
    +flashPollingInterval = null; // Frequency for Flash. Default = 50 unless useFastPolling = true.
    +useHighPerformance = false;// position:fixed flash movie for faster JS/flash callbacks
    +waitForWindowLoad = false; // always delay soundManager.onload() until after window.onload()
    +wmode = 'transparent';     // null, transparent, opaque (last two allow HTML on top of flash)
    +allowScriptAccess = 'always'; // for scripting SWF (object/embed prop.), 'always' or 'sameDomain'
    +useFlashBlock = true;      // better handling of SWF if load fails, let user unblock. See demo.
    +useHTML5Audio = false;     // beta feature: Use HTML5 Audio() where supported.
    +
    +

    To modify global SoundManager default parameters for SM2 itself or for all sound objects, edit the main soundmanager2.js file (look for above section in code) or assign new values in your own application script before either onDOMContentLoaded() or window.onload() fire. (Specifically, both external and inline script blocks which immediately execute are OK.)

    +

    Example per-application override:

    +
    soundManager.debugMode = false;          // disable debug mode
    +soundManager.defaultOptions.volume = 33; // set global default volume for all sound objects
    +
    + +
    + +
    +

    soundManager.debugMode

    +

    soundManager.debugMode configures SM2's debug behaviour, enabled (true) by default. When enabled, SoundManager 2 will write console-like output to console.log()-style javascript interfaces, and/or an HTML element with the ID soundmanager-debug (will be created if not found in the DOM at runtime.)

    +

    For a live example of debug output, see Debug + Console Output.

    +
    + +
    +

    soundManager.debugFlash

    +

    soundManager.debugFlash configures SM2's flash debugging output, disabled (false) by default. When enabled, the Flash portion of SM2 will write debug statements within the Flash movie. This can be useful for troubleshooting Flash/JS/browser (ExternalInterface) issues and so on.

    +

    A CSS class of flash_debug will also be appended to the Flash #sm2-container DIV element when enabled, if you wish to style it differently.

    +

    For a live example, see Flash Movie Debug Output in the Troubleshooting section.

    +
    + +
    +

    soundManager.url

    +

    soundManager.url specifies the "online", generally HTTP-based path which SM2 will load .SWF movies from. The "local" (current) directory will be used by default. The appropriate .SWF required (depending on the desired Flash version) will be appended to the URL.

    +

    Example: soundManager.url = '/path/to/swfs/'; (Note trailing slash)

    +

    For cases where SM2 is being used "offline" in non-HTTP cases (eg., development environments), see altURL.

    +
    + +
    +

    soundManager.altURL

    +

    soundManager.altURL specifies an alternate path to soundManager.url which SM2 can load its SWF from. It is a simple convenience for when you may need to load SWFs from different paths depending on your hosting environment (eg., offline development vs. production.)

    +

    Example: soundManager.altURL = '../'; (Load from parent directory - note trailing slash)

    +

    For altURL to be used, it must be defined and an "alternate environment" condition must be met:

    +

    soundManager.useAltURL = (!document.location.protocol.match(/http/i));

    +

    By default and as shown above, SM2 will use this property when the hosting page is not being served over HTTP, and thus is assumed to being served "offline" - for example, when loading via file://, from the local file system.

    +

    This can easily be adapted to taste, eg., checking the domain matching yourdomain.com vs. localhost:

    +

    soundManager.useAltURL = (!document.location.match(/mydomain.com/i));

    +

    If soundManager.altURL is null (the default), soundManager.url will be used for all cases.

    +
    + +
    + +

    soundManager.flashVersion

    + +

    SoundManager 2 started with a Flash 8 base requirement, but can also now use Flash 9 and take advantages of some new features Flash 9 offers. By default Flash 8 will be used, but the version can be easily changed by setting flashVersion appropriately.

    + +

    Example: soundManager.flashVersion = 9;

    + +

    The Flash 8 version is soundmanager2.swf, and the flash 9 version is soundmanager2_flash9.swf, accordingly. Note that only Flash 8 and Flash 9 are supported at this time; other values will result in errors.

    + +
    + + +
    + +

    New Flash 9-only features:

    + +
      +
    • MPEG-4 (HE-AAC/H.264) audio support
    • +
    • True "multi-shot" sound behaviour. play() can be called multiple times, giving a layered, "chorus" effect. Sound will also fire onfinish() multiple times. (Previous behaviour did not layer sounds, but would re-play a single instance.)
    • +
    • waveformData array: 256 waveform data values available while playing sound
    • +
    • eqData array: 256 EQ spectrum data values available while playing sound
    • +
    • peakData object: Left and right channel peak/volume data available while playing sound
    • +
    + +
    + + +
    +

    soundManager.flashLoadTimeout

    +

    After initializing the flash component during start-up, SM2 will wait for a defined period of time before timing out and calling soundManager.onerror().

    +

    The default value is 1000 (msec.) Setting a value of 0 disables the timeout and makes SM2 wait indefinitely for a call from the flash component. If you want to handle flash block-type situations, see soundManager.useFlashBlock.

    +

    Setting this parameter to 0 may be useful when attempting to gracefully recover from a flashBlock situation, where the user has whitelisted the movie after it was blocked etc.

    +

    Note that when the timeout is disabled, soundManager will not fire its onerror() handler if there is an error at the flash loading stage.

    +
    + +
    +

    soundManager.useFastPolling

    +

    By default useFastPolling = false, and thus SoundManager uses a 20-milisecond timer inside Flash when polling for updated sound properties such as bytesLoaded and data and event callbacks eg. whileloading(), whileplaying() and so on. With useFastPolling = true, a 1-msec timer is used and callback frequency may noticeably increase. This is best combined with useHighPerformance for optimal results.

    +
    + +
    +

    soundManager.flashPollingInterval

    +

    Setting this will override useFastPolling. E.g. set this to 200 to have 200ms intervals. This is useful in case your callbacks are CPU intensive.

    +
    + +
    +

    soundManager.useHighPerformance

    +

    Perhaps intuitively, Flash is given higher priority when positioned within the viewable area of the browser, at least 6px in height (oddly), fully-opaque, visible and displayed on the screen. By default, soundManager.useHighPerformance is enabled and should noticeably reduce JS/flash lag and increase the frequency of callbacks such as whileplaying() in some circumstances.

    +

    soundManager.useHighPerformance = true;

    +

    This has made a noticeable impact in responsiveness on Mac OS X, and Safari on Windows; animation lag is practically non-existent (see demo). Because setting wmode=transparent and fixed position has been reported to cause some issues, the feature is disabled by default.

    +

    To be least-obtrusive, SM2 attempts to set position:fixed, and uses bottom/left:0px to stay within view (though using wmode=transparent where possible, to be hidden from view.) It occupies an 8x8px square. If you wish to position the movie yourself or show it inline, have a DIV element with the ID of sm2-container present in the DOM for SM2 to reference and it will write the movie there without positioning.

    +
    + +
    +

    soundManager.useFlashBlock

    +

    Flash blockers (eg. FlashBlock, "Click To Flash") can prevent the flash portion of SM2 from loading, which will cause a start-up error with a time-out.

    +

    SM2 historically has kept the flash movie off-screen and out of view, and thus the user could not click on and unblock it. Now with useFlashBlock = true, the movie positioning can be handled by CSS. The initial state is still off-screen by default, but will change to be in view when a blocking (time-out) situation may be encountered. You can also edit the CSS to taste, of course.

    +

    When starting up, CSS classes are appended to the #sm2-container DIV (which you can provide, or SM2 will create and append to the document.) The CSS classes change with the state of SM2's start-up, eg. #sm2-container.swf_timedout { border:1px solid red; } could be used to highlight the movie to the user for unblocking and so on.

    +

    Setting useFlashBlock = true will cause SM2 to wait infinitely for the Flash content to load after an initial (non-fatal) timeout, having already waited for flashLoadTimeout to pass. If flashLoadTimeout = 0, SM2 will immediately go into "flash block mode" on start-up.

    +

    The relevant CSS is as follows:

    +
    #sm2-container {
    + /* Initial state: position:absolute/off-screen, or left/top:0 */
    +}
    +#sm2-container.swf_timedout {
    +  /* Didn't load before time-out, show to user.
    +  Maybe highlight on-screen, red border, etc..? */
    +}
    +#sm2-container.swf_unblocked {
    +  /* Applied if movie loads successfully
    +  (flash started, so move off-screen etc.) */
    +}
    +#sm2-container.swf_error {
    +  /* "Fatal" error case: SWF loaded,
    +  but SM2 was unable to start for some reason.
    +  (Flash security or other error case.) */
    +}
    +#sm2-container.high_performance {
    +  /* Additional modifier for "high performance" mode
    +  should apply position:fixed and left/bottom 0 to stay on-screen
    +  at all times (better flash performance) */
    +}
    +#sm2-container.flash_debug {
    +  /* Additional modifier for flash debug output mode
    +  should use width/height 100% so you can read debug messages */
    +}
    + +

    For a live example, see the FlashBlock Demo.

    +
    + +
    + +

    soundManager.useHTML5Audio

    + +

    Warning: Beta-ish, in-progress feature; subject to bugs, API changes etc. By default, special check to enable feature for the Apple iPad 3.2+ (which does not support Flash) and Palm Pre, otherwise currently disabled by default. Works on iPhone OS 4.0 / iOS 4.0+.

    +

    Determines whether HTML5 Audio() support is used to play sound, if available, with Flash as the fallback for playing MP3/MP4 (AAC) formats. Browser support for HTML5 Audio varies, and format support (eg. MP3, MP4/AAC, OGG, WAV) can vary by browser/platform.

    +

    The SM2 API is effectively transparent, consistent whether using Flash or HTML5 Audio() for sound playback behind the scenes. The HTML5 Audio API is roughly equivalent to the Flash 8 feature set, minus ID3 tag support and a few other items. (Flash 9 features like waveform data etc. are not available.)

    + +
    SoundManager 2 + useHTML5Audio: Init Process
    + +

    At DOM ready (if useHTML5Audio = true), a test for Audio() is done followed by a series of canPlayType() tests to see if MP3, MP4, WAV and OGG formats are supported. If none of the "required" formats (MP3 + MP4, by default) are supported natively, then Flash is also added as a requirement for SM2 to start.

    +

    soundManager.audioFormats currently defines the list of formats to check (MP3, MP4 and so on), their possible canPlayType() strings (long story short, it's complicated) and whether or not they are "required" - that is, whether Flash should be loaded if they don't work under HTML5. (Again, only MP3 + MP4 are supported by Flash.) If you had a page solely using OGG, you could make MP3/MP4 non-required, but many browsers would not play them inline.

    +

    SM2 will indicate its state (HTML 5 support or not, using Flash or not) in console.log()-style debug output messages when debugMode = true.

    + +
    "My browser does HTML5, why not MP3"?
    + +

    Despite best efforts, some browsers eg. Chrome on Windows may only return "maybe" for Audio().canPlayType('audio/mpeg; codecs=mp3') and variants; by default, SoundManager 2 will only assume a format is supported if a "probably" response is given. You can modify soundManager.html5Test to something like /(probably|maybe)/i if you want to be a bit riskier, but you should consider potential false positives.

    + +

    At this time, only Safari and Chrome (excluding Chromium?) support MP3 and MP4 formats. Other browsers have excluded them because MP3 and MP4 are not "free" formats. For these cases, Flash is used as the fallback support for MP3/MP4 as needed.

    + +
    Bonus HTML5 formats: OGG, WAV
    + +

    WAVe (an old standard) and OGG (a MP3-like codec, except free) are both supported in a majority of browsers via HTML5, so SoundManager 2 will also test for support for these formats. A Flash fallback for these formats has not been implemented.

    + +
    Testing audio format support
    + +

    Once soundManager.onready() has fired and SM2 has started, you can check for support via a number of methods. Namely, soundManager.canPlayLink() will take an <a> element and check its href and type attributes, if available, for hints as to its format or type. You can also pass arbitrary URLs to soundManager.canPlayURL(), which will make a "best guess" based on the extension it finds. In any event, SM2 will return a true/false value from canPlay methods based on HTML and/or flash capabilities.

    + +

    To see what formats are supported by HTML5, watch SM2's debug/console output when debug is enabled, or dump the contents of soundManager.html5 to the console; it will show the results of tests for simple items like "mp3", as well as canPlayType() strings such as 'mpeg; codecs=mp3'

    + +
    Apple iPad, iPhone, Palm Pre: Special Cases
    +

    The "Big iPhone" doesn't do Flash, and does support HTML5 Audio() pretty decently - so SM2 makes a special exception to enable useHTML5Audio when it detects an iPad, iPhone or Palm Pre user agent string by default. Feel free to disable this if you wish.

    +

    iPad and iPhone require user interaction to start a sound, eg. the createSound() and play() call should happen within an onclick() handler on a link, etc. The "security" model here seems to be implemented similarly to the way pop-up blockers work. You may "chain" sounds (eg. create and play a new one) provided it is done via the onfinish() event of a sound initiated by a user, however. The Muxtape-style demo on the SM2 homepage uses this, and will advance the playlist on the iPad/iPhone if allowed.

    +

    iPad 3.2 gets hung up on the "BC quail" HE-AAC example sound for some reason, and endlessly loops it rather than finishing and moving on to the next item. May be an iPad playback bug, as other formats are fine. iPhone OS 4 (iOS 4) does not show this issue.

    +

    iPhone OS version < 3.1 doesn't work, but 3.1 (and possibly earlier versions, not verified) have a native Audio() object. However, they seem to simply not play sound when play() is called, so SM2 looks for and ignores the iPhone with these OS revisions.

    +

    The Palm Pre supports a number of MP3, MP4 and WAV formats (WebOS 1.4.1 was tested; it didn't seem to like MP3s at 192kbps, but 128kbps was fine.)

    + + +
    + +
    HTML5 Audio: Notes, bugs, quirks and annoyances
    + +

    As of the January, 2011 (V2.97a.20110101) and December, 2010 releases of SM2 (V2.97a.20101221):

    +
      +
    • The bytesLoaded and bytesTotal properties may become less-relevant under HTML5 due to non-linear HTTP downloading (using ranges and partials), but they are still provided under Firefox at this time.
    • +
    • Related to bytes loading/total, a sound's onload event may not always be fired (Mozilla currently discourage use of the DOM loaded event), again because of range requests and the ability to arbitrarily seek within a file.
    • +
    • Basic support for the W3 TimeRanges implementation of sound buffering (ie., loaded data) has been implemented. This gives an idea of "total time loaded", but again, is not necessarily sequential.
    • +
    • HTML5 audio is disabled for all versions of Safari (4 and 5) on Snow Leopard (OS X 10.6.3 - 10.6.5) until Apple fixes issues with audio loading and playback due to bugs in "underlying frameworks." See Webkit #32159. HTML5 audio in Safari on Windows (provided QuickTime is installed) does not have the same fatal bug.
    • +
    + +

    As of the October, 2010 release of SM2 (V2.97a.20101010):

    +
      +
    • HTML5 audio is disabled for all versions of Safari (4 and 5) on Snow Leopard (OS X 10.6.3 and 10.6.4) until Apple fixes issues with audio loading and playback due to bugs in "underlying frameworks." See Webkit #32159.
    • +
    + +

    As of the August, 2010 release of SM2 (V2.96a.20100822):

    +
      +
    • Safari 5.0.1 (533.17.18) on Snow Leopard (10.6.x) continues to show buggy HTML5 audio load/playback behaviour. Apple are aware of the regression, which began with Safari 4.0 on Snow Leopard (perhaps with the new QuickTime.) See Webkit #32159.
    • +
    • iPad/iPhone iOS4 will now play a sequence of sounds if using onfinish() to create/start the next (eg., the Muxtape-style playlist on the SM2 homepage will play through once the user starts it.) In any event, user interaction is always required to start the first sound.
    • +
    + +

    As of the June, 2010 release of SM2 (V2.96a.20100624):

    +
      +
    • Safari 5.0 (533.16) on OS X Snow Leopard (10.6.x) continues to show buggy HTML5 audio load/playback behaviour, same as with Safari 4.0.5 on Snow Leopard only - may be related to underlying QuickTime implementation (a guess, at this point.) SM2 will disable HTML5 audio support by default for this specific browser + OS combo. See Webkit #32159 for discussion + testcases.
    • +
    + +

    As of the May, 2010 release of SM2 (V2.96a.20100520):

    +
      +
    • Safari 4.0.5 on OS X Snow Leopard (10.6.x) appears to have an annoying bug where audio inconsistently fails to load / play; SM2 will currently disable or ignore the HTML5 feature on this exact browser + OS version. See Webkit #32159 for discussion + testcases. Note that Safari on OS X 10.5 "Leopard" and on Windows do not appear to have this bug; it seems to be limited to Snow Leopard, seen on OS X 10.6.3.
    • +
    • Some browsers (and iPad 3.2?) do not fire progress events, and/or do not implement bytesLoaded/bytesTotal-style attributes.
    • +
    • iPad 3.2 appears to be able to only play one sound at a time, and will terminate other sounds.
    • +
    • iPad 3.2 may also loop AAC+ (HE-AAC) and WAV sounds, perhaps not firing onfinish() and resetting the position to 0 each time, but is fine with MP3s. This has been observed, but not fully-tested.
    • +
    • Looping in HTML5 is either "infinite" or "none". A wrapper may be created for SM2 so that a number of loops can be specified, as with Flash. This is not yet implemented.
    • +
    • Panning (left/right channel balance) does not appear to be in HTML5.
    • +
    • Flash-only features such as ID3 tag reading, waveform and spectrum data will simply be ignored, and their related events will not fire on SMSound objects which are using HTML5.
    • +
    + +
    + +
    General Disclaimer
    +

    HTML5 audio support may still be in flux, and may not be fully-supported or implemented consistently in modern browsers. Be careful out there.

    + +
    Related Reading on HTML5
    +

    For some more backstory on HTML and audio, see the 24ways.org article "Probably, Maybe, No": The State Of HTML5 Audio (published December, 2010.)

    + +
    + +
    +

    soundManager.wmode

    +

    The wmode property is applied directly to the flash movie, and can be either null, 'window', 'transparent' or 'opaque'. By default if useHighPerformance is enabled, transparency will be attempted by SM2 unless there are known issues with the rendering mode.

    +

    It appears that non-IE browsers on Windows will not load SWF content "below the fold" (out of scrollable view) when wmode is set to anything other than null (window). This will break SM2 as it expects Flash to load within a reasonably short amount of time - so SM2 by default will reset wmode for this case. If you wish to force retention of your wmode, set soundManager.flashTimeout = 0 which will ensure that if the content is below the fold, SM2 will not time out waiting for it to load.

    +

    Additionally, soundManager.specialWmodeCase will be set to true if wmode has been reset due to this special condition.

    +
    + +
    + + +
    + +
    + +
    +

    SoundManager Core API

    +

    Methods for the soundManager object.

    +
    + +
    + +
    + +

    SoundManager Global Object

    + +

    This is a collection of methods, collections, properties and event handlers available via the soundManager Javascript object. Sound properties and methods can be set on a global (inherited) default, or per-sound basis.

    + +
    + + + +
    +
    canPlay:boolean canPlayMIME(MIMEtype:string)
    +
    Returns a boolean indicating whether soundManager can play the given MIME type - eg., audio/mp3. The types supported vary based on Flash version and MPEG4 (MovieStar mode) options.
    +
    + MIME type patterns are as follows: +
      +
    • Defaults: /^audio\/(?:x-)?(?:mp(?:eg|3))\s*;?/i; - eg. audio/mp3 or audio/mpeg
    • +
    • MovieStar-only formats: /^audio\/(?:x-)?(?:mp(?:eg|3)|mp4a-latm|aac|speex)\s*;?/i; - eg. audio/m4a or audio/aac
    • +
    +
    +
    Example: +
    // link example: <a id="song1" href="foo.php?songID=1" type="audio/mp3">play song 1</a>
    +var aLink = document.getElementById('song1');
    +if (soundManager.canPlayLink(aLink)) {
    + soundManager.play('song1Sound',aLink.href);
    +}
    +
    If no type attribute is found, this method will return null instead of false.
    +
    + +
    +
    canplay:boolean canPlayURL(mediaURL:string)
    +
    Returns a boolean indicating whether soundManager can play the given URL. Playability is determined by a matching URL pattern set at runtime, based on Flash version and MPEG4 (MovieStar mode) support.
    +
    Example: +
    var sURL = '/path/to/some.mp3';
    +if (soundManager.canPlayURL(sURL)) {
    + soundManager.createSound('fooSound',sURL);
    +}
    +
    If no href attribute is found, this method will return null instead of false.
    +
    + +
    + +
    object:SMSound createSound(object:options)
    +
    Creates a sound with an arbitrary number of optional arguments. Returns a SMSound object instance. Requires id and url at a minimum.
    +
    + Example: +
    soundManager.createSound({
    + id: 'mySound', // required
    + url: '/audio/mysoundfile.mp3', // required
    + // optional sound parameters here, see Sound Properties for full list
    + volume: 50,
    + autoPlay: true,
    + whileloading: soundIsLoading
    +});
    +

    Each createSound() call results in the creation of a SMSound object which stores all properties, methods and events relevant to that particular sound instance.

    +

    Individual sound objects can also easily be referenced as returned from createSound():

    +
    var mySoundObject = soundManager.createSound({
    + id: 'mySound',
    + url: '/audio/mysoundfile.mp3'
    +});
    +mySoundObject.play(); // SMSound object reference, same as soundManager.getSoundById('mySound')
    + +

    (Note: Code formatting is stylistic, not necessarily recommended.) See Object Literal Format.

    +
    +
    If createSound is called with the ID of an existing sound, that sound object will be returned "as-is". Any other createSound options passed (eg., url or volume, etc.) will be ignored.
    + +
    + +
    +
    object:SMSound createSound(id:string, url:string) - overloaded method
    +
    Creates a sound with the specified ID and URL (simple two-parameter method.)
    +
    Example: soundManager.createSound('mySound','/audio/mysoundfile.mp3');
    +
    + +
    +
    destroySound(id:string)
    +
    Stops, unloads and destroys a sound specified by ID.
    +
    Example: soundManager.destroySound('mySound');
    +
    SMSound equivalent example: mySound.destruct();
    +
    + +
    +
    object:SMSound mute([id:string])
    +
    Mutes the sound specified by ID and returns that sound object. If no ID specified, all sounds will be muted and null is returned. Affects muted property (boolean.)
    +
    Example: soundManager.mute('mySound');
    +
    + +
    +
    onready(callback:function, [scope])
    +
    Queues an event callback/handler for successful initialization and "ready to use" state of SoundManager 2. An optional scope parameter can be specified; if none, the callback is scoped to the window. If onready() is called after successful initialization, the callback will be executed immediately. The onready() queue is processed before soundManager.onload().
    +
    Example: +
    soundManager.onready(function() {
    +  alert('Yay, SM2 loaded OK!');	
    +});
    +
    +
    Queueing multiple handlers: soundManager.onready(myOnReadyHandler); soundManager.onready(myOtherHandler);
    +
    The same listener may be added multiple times; there is no duplicate checking. Queue is processed in order of addition.
    +
    If soundManager.reboot() is called, all listeners' "fired" flags will be reset and they will be eligible to fire again when SM2 starts.
    +
    + +
    +
    ontimeout(callback:function, [scope])
    +
    Queues an event callback/handler for SM2 init failure, processed at (or immediately, if added after) SM2 initialization has failed, just before soundManager.onerror() is called. An optional scope parameter can be specified; if none, the callback is scoped to the window.
    +
    Example: +
    soundManager.ontimeout(function() {
    +  alert('SM2 failed to start. Flash missing, blocked or security error?');	
    +});
    +
    +
    Queueing multiple handlers: soundManager.ontimeout(myOnTimeoutHandler); soundManager.ontimeout(myOtherHandler);
    +
    The timeout event is not necessarily fatal, as SM2 may be rebooted and fire an onready() in the useFlashBlock case (where the user sees, and chooses to unblock, the Flash component after a failed init attempt.)
    +
    The same listener may be added multiple times; there is no duplicate checking. Queue is processed in order of addition.
    +
    If soundManager.reboot() is called, all listeners' "fired" flags will be reset and they will be eligible to fire again when SM2 starts.
    +
    + +
    +
    object:SMSound play(id:string, [options object])
    +
    Starts playing the sound specified by ID. (Will start loading if applicable, and will play ASAP.)
    +
    Returns an SMSound (sound object) instance.
    +
    Example: soundManager.play('mySound');
    +
    Note that the second parameter, options object, is not required and can take almost any argument from the object literal format (eg. volume.) It is convenient when you wish to override the sound defaults for a single instance.
    +
    Example: soundManager.play('mySound',{volume:50,onfinish:playNextSound});
    +
    + +
    +
    object:SMSound pause(id:string)
    +
    Pauses the sound specified by ID. Does not toggle. Affects paused property (boolean.) Returns the given sound object.
    +
    Example: soundManager.pause('mySound');
    +
    + +
    +
    pauseAll()
    +
    Pauses all sounds whose playState is >0. Affects paused property (boolean.)
    +
    Example: soundManager.pauseAll();
    +
    + +
    +
    reboot()
    +
    Destroys any created SMSound objects, unloads the flash movie (removing it from the DOM) and restarts the SM2 init process, retaining all currently-set properties.
    +
    Example: +
    soundManager.onerror = function() {
    +  // Something went wrong during init - in this example, we *assume* flashblock etc.
    +  soundManager.flashLoadTimeout = 0; // When restarting, wait indefinitely for flash
    +  soundManager.onerror = {}; // Prevent an infinite loop, in case it's not flashblock
    +  soundManager.reboot(); // and, go!
    +}
    +
    +
    This method may be helpful when trying to gracefully recover from FlashBlock-type situations where the user has prevented the SWF from loading, but is able to whitelist it. For more ideas, see Flashblock demo.
    +
    When using this method also consider flashLoadTimeout, which can have SM2 wait indefinitely for the flash to load if desired.
    +
    + +
    +
    object:SMSound resume(id:string)
    +
    Resumes and returns the currently-paused sound specified by ID.
    +
    Example: soundManager.resume('mySound');
    +
    + +
    +
    resumeAll()
    +
    Resumes all currently-paused sounds.
    +
    Example: soundManager.resumeAll();
    +
    + +
    +
    object:SMSound setPan(id:string,volume:integer)
    +
    Sets the stereo pan (left/right bias) of the sound specified by ID, and returns the related sound object. Accepted values: -100 to 100 (L/R, 0 = center.) Affects pan property.
    +
    Example: soundManager.setPan('mySound',-80);
    +
    + +
    +
    object:SMSound setPosition(id:string,msecOffset:integer)
    +
    Seeeks to a given position within a sound, specified by miliseconds (1000 msec = 1 second) and returns the related sound object. Affects position property.
    +
    Example: soundManager.setPosition('mySound',2500);
    +
    Can only seek within loaded sound data, as defined by the duration property.
    +
    + +
    +
    object:SMSound setVolume(id:string, volume:integer)
    +
    Sets the volume of the sound specified by ID and returns the related sound object. Accepted values: 0-100. Affects volume property.
    +
    Example: soundManager.setVolume('mySound',50);
    +
    + +
    +
    object:SMSound stop(id:string)
    +
    Stops playing the sound specified by ID. Returns the related sound object.
    +
    Example: soundManager.stop('mySound');
    +
    + +
    +
    stopAll()
    +
    Stops any currently-playing sounds.
    +
    Example: soundManager.stopAll();
    +
    + +
    +
    object:SMSound toggleMute(id:string)
    +
    Mutes/unmutes the sound specified by ID. Returns the related sound object.
    +
    Example: soundManager.toggleMute('mySound');
    +
    + +
    +
    object:SMSound togglePause(id:string)
    +
    Pauses/resumes play on the sound specified by ID. Returns the related sound object.
    +
    Example: soundManager.togglePause('mySound');
    +
    + +
    +
    object:SMSound unload(id:string)
    +
    Stops loading the sound specified by ID, canceling any current HTTP request. Returns the related sound object.
    +
    Example: soundManager.unload('mySound');
    +
    Note that for Flash 8, SoundManager does this by loading a new, tiny "stub" MP3 file, ./null.mp3, which replaces the current one from loading. This is defined in the SM2 global object as nullURL, and can be edited.
    +
    + +
    +
    object:SMSound unmute([id:string])
    +
    Unmutes the sound specified by ID. If no ID specified, all sounds will be unmuted. Affects muted property (boolean.) Returns the related sound object.
    +
    Example: soundManager.unmute('mySound');
    +
    + +
    +
    object:SMSound load(id:string, [options object])
    +
    Starts loading the sound specified by ID, with options if specified. Returns the related sound object.
    +
    Example: soundManager.load('mySound');
    +
    Example 2: soundManager.load('mySound',{volume:50,onfinish:playNextSound});
    +
    + +
    +
    object:SMSound getSoundById(id:string)
    +
    Returns an SMSound object specified by ID, or null if a sound with that ID is not found.
    +
    Example: var mySMSound = soundManager.getSoundById('mySound');
    +
    + +
    +
    number:bytesUsed getMemoryUse()
    +
    Returns the total number of bytes allocated to the Adobe Flash player or Adobe AIR, or 0 if unsupported (Flash 9+ only.) This number may include memory use across all tabs, browsers etc. See system.totalMemory (livedocs.adobe.com)
    +
    Example: var mbUsed = (soundManager.getMemoryUse()/1024/1024).toFixed(2); // eg. 12.05 MB
    +
    + +
    +
    isSupported:boolean ok() ( previous name: supported() )
    +
    Returns a boolean indicating whether soundManager has attempted to and succeeded in initialising. This function will return false if called before initialisation has occurred, and is useful when you want to create or play a sound without knowing SM2's current state.
    +
    Example: var isSupported = soundManager.ok();
    +
    + +
    + +
    + +
    + +
    +

    SMSound (Sound Object) API

    +

    Each createSound() call generates a matching SMSound (sound instance) object, which lasts for the life of the page or until explicitly destroyed. Each instance stores stateful information (eg. playState) and provides event handlers for state changes (eg. onload().)

    +

    SoundManager is a convenient wrapper for most sound object methods: It will check for and gracefully exit if a sound object (specified by ID) does not exist, and provides convenient global functionality, eg. muting or pausing of all sounds.

    +

    Nonetheless, each SMSound object can have its methods called directly. eg. mySound.mute() instead of soundManager.mute('mySound'), and so on.

    +

    Note that for code examples, mySound is assumed to be a valid SMSound instance object - eg.,
    var mySound = soundManager.createSound(); or
    var mySound = soundManager.getSoundById();

    +
    + +
    + +
    + +

    Sound Object Methods

    + +

    Each sound under SoundManager 2 is given a SMSound object instance which includes the following events, methods and properties. Note that most methods will return the sound object instance, allowing for method chaining if desired.

    + +
    +
    destruct()
    +
    Stops, unloads and destroys a sound, freeing resources etc.
    +
    Example: mySound.destruct();
    +
    + +
    +
    object:SMSound load([options object])
    +
    Starts loading the given sound, with options if specified.
    +
    Example: mySound.load();
    +
    Example 2: mySound.load({volume:50,onfinish:playNextSound});
    +
    + +
    +
    object:SMSound mute()
    +
    Mutes the given sound. Affects muted property.
    +
    Example: mySound.mute();
    +
    + +
    +
    object:SMSound onposition(msecOffset:integer, callback:function, [scope])
    +
    Registers an event listener, fired when a sound reaches or passes a certain position while playing. Position being "listened" for is passed back to event handler. Will also fire if a sound is "rewound" (eg. via setPosition() to an earlier point) and the given position is reached again. Listeners will be removed if a sound is unloaded. An optional scope can be passed as well.
    +
    Note that for multiShot cases, only the first play instance's position is tracked in Flash; therefore, subsequent "shots" will not have onposition() events being fired.
    +
    Example: mySound.onposition(3000, function(eventPosition){console.log(this.sID+' reached '+eventPosition});
    +
    + +
    +
    object:SMSound pause()
    +
    Pauses the given sound. (Does not toggle.) Affects paused property (boolean.)
    +
    Example: mySound.pause();
    +
    + +
    +
    object:SMSound play([options object])
    +
    Starts playing the given sound, with an optional options object. (Will start loading if applicable, and will play ASAP.)
    +
    Note that the options object parameter is not required and can take almost any argument from the object literal format (eg. volume.)
    +
    Example: mySound.play('mySound',{volume:50,onfinish:playNextSound});
    +
    + +
    +
    object:SMSound setPosition(msecOffset:integer)
    +
    Seeks to a given position within a sound, specified by miliseconds (1000 msec = 1 second.) Affects position property.
    +
    Example: mySound.setPosition(2500);
    +
    Can only seek within loaded sound data, as defined by the duration property.
    +
    + +
    +
    object:SMSound resume()
    +
    Resumes the currently-paused sound. Does not affect currently-playing sounds.
    +
    Example: mySound.resume();
    +
    + +
    +
    object:SMSound setPan(volume:integer)
    +
    Sets the stereo pan (left/right bias) of the given sound. Accepted values: -100 to 100 (L/R, 0 = center.) Affects pan property.
    +
    Example: mySound.setPan(-80);
    +
    + +
    +
    object:SMSound setVolume(volume:integer)
    +
    Sets the volume of the given sound. Accepted values: 0-100. Affects volume property.
    +
    Example: mySound.setVolume(50);
    +
    + +
    +
    object:SMSound toggleMute()
    +
    Mutes/unmutes the given sound. Affected muted property (boolean.)
    +
    Example: mySound.toggleMute();
    +
    + +
    +
    object:SMSound togglePause()
    +
    Pauses/resumes play of the given sound. Will also start a sound if it is has not yet been played.
    +
    Example: mySound.togglePause();
    +
    + +
    +
    object:SMSound stop()
    +
    Stops playing the given sound.
    +
    Example: mySound.stop();
    +
    + +
    +
    object:SMSound unload()
    +
    Stops loading the given sound, canceling any current HTTP request.
    +
    Example: mySound.unload();
    +
    Note that for Flash 8, SoundManager does this by loading a new, tiny "stub" MP3 file, ./null.mp3, which replaces the current one from loading. This is defined in the SM2 global object as nullURL, and can be edited.
    +
    + +
    +
    object:SMSound unmute()
    +
    Unmutes the given sound. Affects muted property.
    +
    Example: mySound.unmute();
    +
    + +
    + +
    + + +
    + +
    + +
    +

    SMSound Events

    +

    Event handlers for SMSound objects.

    +
    + +
    + +
    + +

    Sound Object Events

    + +

    Like native javascript objects, each SoundManager SMSound (sound instance) object can fire a number of onload-like events. Handlers cannot be "directly" assigned (eg. someSound.onload), but can be passed as option parameters to several sound methods.

    +
    +
    soundManager.play('mySound',{
    +  onfinish: function() {
    +    alert('The sound '+this.sID+' finished playing.');
    +  }
    +});
    +
    +

    Event handlers are scoped to the relevant sound object, so the this keyword will point to the sound object on which the event fired such that its properties can easily be accessed - eg. within an SMSound event handler, this.sID will give the sound ID.

    + +
    + +
    + +
    +
    onbufferchange()
    +
    Fires when a sound's reported buffering state has changed while playing and/or loading. The current state is reflected in the boolean isBuffering property.
    +
    Flash 9+ only. Related information on Adobe, Sound.isBuffering.
    +
    + +
    +
    ondataerror()
    +
    Fires at least once per sound play instance when Flash encounters a security error when trying to call computeSpectrum() internally. This typically happens when sounds are 'inaccessible' due to another Flash movie (eg. YouTube) in another tab which has loaded, and may (or may not be) playing sound. Flash attempts to read the "combined" output to the sound card, and must have security permissions for all sounds as a result. See areSoundsInaccessible() on Adobe for more info.
    +
    If the offending resource causing the security error is closed or becomes inactive(?), the data will become available again. Intermittent availability will result in intermittent calls to ondataerror().
    +
    + +
    +
    onbeforefinishcomplete()
    +
    Fires when a sound has finished, onfinish() has been called, but before the sound play state and other meta data (position, etc.) are reset.
    +
    + +
    +
    onbeforefinish()
    +
    Fires when a playing, fully-loaded sound has reached onbeforefinishtime (eg. 5000 msec) from its end.
    +
    + +
    +
    onconnect()
    +
    Fires when a sound using an RTMP serverURL property has attempted to connect, and has either succeeded or failed. Affects connected property. Once connected, a stream can be requested from the RTMP server.
    +
    Example: +
    var s = soundManager.createSound({
    +  id: 'rtmpTest',
    +  serverURL: 'rtmp://localhost/test/',
    +  url: 'song.mp3',
    +  onconnect: function(bConnect) {
    +    // this.connected can also be used
    +    soundManager._writeDebug(this.sID+' connected: '+(bConnect?'true':'false'));
    +  }
    +}).play(); // will result in connection being made
    +
    +
    + +
    +
    onfinish()
    +
    Fires when a playing sound has reached its end. By this point, relevant properties like playState will have been reset to non-playing status.
    +
    + +
    +
    onid3()
    +
    Fires when ID3 data has been received. Relevant property is id3, which is an object literal (JSON)-style object. Only fields with data will be populated.
    +
    Note that ID3V2 data is located at the beginning (header) of an MP3 file and will load almost immediately, whereas ID3V1 data is at the end and will not be received until the MP3 has fully loaded.
    +
    + Example handler code: +
    +
    soundManager._writeDebug('sound '+this.sID+' ID3 data received');
    +var prop = null;
    +var data = '';
    +for (prop in this.id3) {
    +  data += prop+': '+this.id3[prop]+','; // eg. title: Loser, artist: Beck
    +}
    +
    +
    +
    Refer to the Flash 8 Sound.id3 documentation for a list of ID3 properties.
    +
    When parsing ID3 data, it is best to check for the existance of ID3V1 data first, and apply ID3V2 if no matching ID3V1 data is defined. (V1 should "inherit" from V2, ideally, if available.)
    +
    Note that Flash's cross-domain security restrictions may prevent access to ID3 information, even though the MP3 itself can be loaded. (crossdomain.xml files on the remote host can grant Flash permission to access this.)
    +
    Also note some issues with parsing ID3 from iTunes.
    +
    + + +
    +
    onjustbeforefinish()
    +
    Fires approximately justbeforefinishtime before the end of a fully-loaded, playing sound.
    +
    This is based on a polling approach given SM2 must track the sound's position, and is approximated (eg. a 200 msec value may fire at 187 msec before the end of the sound.)
    +
    + +
    +
    onload(boolean:success)
    +
    Fires on sound load. Boolean reflects successful load (true), or fail/load from cache (false).
    +
    False value should seemingly only be for failure, but appears to be returned for load from cache as well. This strange behaviour comes from Flash. More detail may be available from the Flash 8 sound object documentation.
    +
    Failure can occur if the Flash sandbox (security) model is preventing access, for example loading SoundManager 2 on the local file system and trying to access an MP3 on a network (or internet) URL. (Security can be configured in the Flash security panel, [see here].)
    + +
    + +
    +
    onpause()
    +
    Fires when a sound pauses, eg. via sound.pause().
    +
    Example: soundManager.pause('mySound');
    +
    + +
    +
    onplay()
    +
    Fires when sound.play() is called.
    +
    + +
    +
    onresume()
    +
    Fires when a sound resumes playing, eg. via sound.resume().
    +
    Example: soundManager.resume('mySound');
    +
    + +
    +
    onstop()
    +
    Fires when sound.stop() is explicitly called. For natural "sound finished" onfinish() case, see below.
    +
    + +
    +
    whileloading()
    +
    Fires at a regular interval when a sound is loading and new data has been received. The relevant, updated property is bytesLoaded.
    +
    Example handler code: soundManager._writeDebug('sound '+this.sID+' loading, '+this.bytesLoaded+' of '+this.bytesTotal);
    +
    Note that the duration property starts from 0 and is updated during whileloading() to reflect the duration of currently-loaded sound data (ie. when a 4:00 MP3 has loaded 50%, the duration will be reported as 2:00 in milliseconds.) However, an estimate of final duration can be calculated using bytesLoaded, bytesTotal and duration while loading. Once fully-loaded, duration will reflect the true and accurate value.
    +
    + +
    +
    whileplaying()
    +
    Fires at a regular interval when a sound is playing, and a position (time) change is detected. The relevant, updated property is position.
    +
    Example handler code: soundManager._writeDebug('sound '+this.sID+' playing, '+this.position+' of '+this.duration);
    +
    + + +
    + +
    + +
    + + +
    + +
    +

    SMSound Properties

    +

    Instance Option properties (parameters) can be used with createSound() and play().

    +

    Example:

    +
    soundManager.createSound({
    + id: 'foo',
    + url: '/path/to/an.mp3'
    +});
    +

    Dynamic Properties can be read to monitor the state of a sound object.

    +

    Example:

    +
    alert(mySound.playState);
    + + +
    + +
    + +
    + +

    Sound Object Properties

    +

    Each sound object inherits these properties from soundManager.defaultOptions. They can be set individually or at once when enclosed in object literal form to either createSound() or play().

    + +
    + +
    + +
    +
    sID
    +
    Sound ID string as provided from the id parameter via createSound() or play(). Can be referenced as this.sID from within sound object event handlers such as onload(), whileloading() or whileplaying(), etc.
    +
    If an ID is known, the related SMSound object can be retrieved via getSoundById or directly referencing sounds[sID] on the SoundManager global object.
    +
    + +
    +
    url
    +
    The specified URL from which the sound is loaded, typically over HTTP. Can be referenced as this.url from within sound object event handlers such as onload() or whileplaying(), etc.
    +
    + +
    +
    serverURL
    +
    Note: Experimental feature. Only for use with RTMP streaming, ie., Flash Media Server and similar servers.
    +
    The RTMP server address which Flash will connect to using a NetStream object. Only the server address is specified here, when RTMP is in use; the url property is used to point to a specific resource on the server.
    +
    Example: +
    soundManager.createSound({
    +  id: 'mySound',
    +  serverURL: 'rtmp://localhost/rtmpDemo/', // RTMP server
    +  url: 'mysong.mp3' // path to stream
    +}).play();
    +
    + +
    +
    usePolicyFile
    +
    Boolean value (default: false) which instructs Flash, when loading MP3/MP4 content from remote/third party domains, to request example.com/crossdomain.xml first in order to determine permissions for access to metadata such as ID3 info, waveform, peak and/or spectrum data.
    +
    usePolicyFile will be automagically set to true if your sound options have an onid3() event handler, or uses sound data (peak/wave/spectrum) features. By default, Flash will not have access to this metadata on remote domains unless granted cross-domain security permissions via the crossdomain.xml file.
    +
    Consider additional HTTP traffic (albeit, perhaps with caching-like behaviour for subsequent checks?) and silent 404s in most cases given few hosts use crossdomain.xml files.
    +
    See Adobe's knowledge base for related ID3 + crossdomain.xml documentation.
    +
    + +
    + +
    + +
    + +

    Sound Object Dynamic Properties

    +

    Each sound includes a number of properties that are updated throughout the life of a sound - while loading or playing, for example. Many of these properties have related events that fire when they are updated, and should be treated as read-only.

    + +
    + + +
    +
    bytesLoaded
    +
    The number of bytes currently received while loading a sound.
    +
    + +
    +
    bytesTotal
    +
    The total number of bytes to be downloaded, while loading a sound.
    +
    + +
    +
    didBeforeFinish
    +
    Boolean indicating whether beforeFinish() condition was reached.
    +
    + +
    +
    didJustBeforeFinish
    +
    Boolean indicating whether justBeforeFinish() condition was reached.
    +
    + +
    +
    duration
    +
    The current length of the sound, specified in milliseconds.
    +
    Note that during loading, this property reflects the length of downloaded data, not the full length, until completely loaded (see whileloading().) For an approximate "full duration" value while loading, see durationEstimate.
    +
    + +
    +
    durationEstimate
    +
    The estimated duration of the sound, specified in milliseconds.
    +
    Due to the dynamic nature of duration while loading, this attempts to provide the full duration by calculating parseInt((self.bytesTotal/self.bytesLoaded)*self.duration) and is updated with each whileloading() interval.
    +
    Once the sound has fully loaded, duration should be referenced as it will contain the final and accurate value.
    +
    Note that this method works only with Constant Bitrate (CBR)-encoded MP3s due to the consistent data/time assumption. VBR-encoded MP3s will give inaccurate results.
    +
    + +
    +
    eqData = {left:[], right: []}
    +
    Object containing two arrays of 256 floating-point (three decimal place) values from 0 to 1, the result of an FFT on the waveform data. Can be used to draw a spectrum (frequency range) graph while playing a sound. See Page-as-playlist demo for example implementation. Requires Flash 9+.
    +
    A spectrum frequency graph reflects the level of frequencies being played, from left to right, low to high (i.e., 0 to 20,000 Hz.)
    +
    eqData is set and updated during whileplaying(). A simple graph could be drawn by looping through the values and multiplying by a vertical scale value (eg. 32, thus a graph with peaks of 32 pixels.)
    +
    Example code: +
    someSoundObject.whileplaying = function() {
    +  // Move 256 absolutely-positioned 1x1-pixel DIVs, for example (ugly, but works)
    +  var gPixels = document.getElementById('graphPixels').getElementsByTagName('div');
    +  var gScale = 32; // draw 0 to 32px from bottom
    +  for (var i=0; i<256; i++) {
    +    graphPixels[i].style.top = (32-(gScale+Math.ceil(this.waveformData.left[i]*gScale)))+'px';
    +  }
    +}
    +
    +
    Related Adobe technical documentation (Flash 9/AS3 Sound() object): computeSpectrum()
    +
    Note: Flash security measures may deny access to waveformData when loading MP3s from remote domains.
    +
    Warning: This feature can eat up a lot of CPU in some cases. The amount of data passed from Flash to JS is not terribly large, but the JS-DOM updates and browser reflow can be expensive. Use with caution.
    +
    Backward compatibility note: Up to SoundManager 2.95a.20090717, eqData was a single array containing one channel of data. In newer versions this is unchanged, except the array now has .left[] and .right[] objects attached to it. To ensure future compatibility, use eqData.left[0] instead of eqData[0] and so on.
    +
    + +
    +
    id3
    +
    An object literal populated, if applicable, when ID3 data is received (related handler: onid3())
    +
    For property details, see onid3().
    +
    + +
    +
    isBuffering
    +
    Boolean value reflecting the buffering state of a playing or loading object. To be notified when this property changes, see onbufferchange().
    +
    Flash 9+ only. Related information on Adobe, Sound.isBuffering.
    +
    + +
    +
    connected
    +
    Boolean value reflecting the state of an RTMP server connection (when serverURL is used to connect to a Flash Media Server or similar RTMP service.) Calls to load or play will result in a connection attempt being made, and onconnect() ultimately being called.
    +
    For example code using connected, see onconnect().
    +
    + +
    +
    loaded
    +
    Boolean value indicating load success as returned from Flash. True indicates success, False is a failure.
    +
    Because of the potential for false positives, duration and other properties could be checked as a test of whether sound data actually loaded. For more granular state information, see readyState.
    +
    + +
    +
    muted
    +
    Boolean indicating muted status. True/False.
    +
    Treat as read-only; use mute(), unmute() and toggleMute() methods to affect state.
    +
    + +
    +
    paused
    +
    Boolean indicating pause status. True/False.
    +
    Treat as read-only; use pause(), resume() and togglePause() methods to affect state.
    +
    + +
    +
    peakData = {left:0.0, right:0.0}
    +
    Object literal format including left and right properties with floating-point values ranging from 0 to 1, indicating "peak" (volume) level. Updated during whileplaying(). See Page-as-playlist demo as one example. Requires Flash 9+.
    +
    Example (within relevant sound object handler): +
    someSoundObject.whileplaying = function() {
    +  soundManager._writeDebug('Peaks, L/R: '+this.peakData.left+'/'+this.peakData.right);
    +}
    +
    + +
    +
    playState
    +
    Numeric value indicating the current playing state of the sound.
    +
    0 = stopped/uninitialised
    +
    1 = playing or buffering sound (play has been called, waiting for data etc.)
    +
    Note that a 1 may not always guarantee that sound is being heard, given buffering and autoPlay status.
    +
    + + +
    +
    position
    +
    The current location of the "play head" within the sound, specified in milliseconds (1 sec = 1000 msec).
    +
    + +
    +
    readyState
    +
    Numeric value indicating a sound's current load status
    +
    0 = uninitialised
    +
    1 = loading
    +
    2 = failed/error
    +
    3 = loaded/success
    +
    + +
    +
    type
    +
    A MIME type-like string eg. audio/mp3, used as a hint for SM2 to determine playability of a link with methods like canPlayURL().
    +
    This can be helpful when you have a sound URL that does not have an .mp3 extension, but serves MP3 data (eg., a PHP or other CGI script.)
    +
    Example: +
    var s = soundManager.createSound({
    +  id: 'aSound',
    +  url: '/path/to/some.php?songID=123',
    +  type: 'audio/mp3' // indicates an MP3 link, so SM2 can handle it appropriately
    +});
    +
    + + +
    +
    waveformData = {left:[], right:[]}
    +
    Array of 256 floating-point (three decimal place) values from -1 to 1, can be used to draw a waveform while playing a sound. See Page-as-playlist demo for example implementation. Requires Flash 9+.
    +
    waveformData is set and updated during whileplaying(). A simple graph could be drawn by looping through the values and multiplying by a vertical scale value (eg. 32, which would make a graph with peaks of -32 and +32 pixels.)
    +
    Example code: +
    someSoundObject.whileplaying = function() {
    +  // Move 256 absolutely-positioned 1x1-pixel DIVs, for example (ugly, but works)
    +  var gPixels = document.getElementById('graphPixels').getElementsByTagName('div');
    +  var gScale = 32; // draw -32 to +32px from "zero" (i.e., center Y-axis point)
    +  for (var i=0; i<256; i++) {
    +    graphPixels[i].style.top = (gScale+Math.ceil(this.waveformData.left[i]*-gScale))+'px';
    +  }
    +}
    +
    +
    SM2 implementation note: waveformData contains both left and right channels, and the data represents a raw sound wave rather than a frequency spectrum.
    +
    Related Adobe technical documentation (Flash 9/AS3 Sound() object): computeSpectrum()
    +
    Note: Flash security measures may deny access to waveformData when loading MP3s from remote domains.
    +
    Warning: This feature can eat up a lot of CPU in some cases. The amount of data passed from Flash to JS is not terribly large, but the JS-DOM updates and browser reflow can be expensive. Use with caution.
    +
    + +
    + +
    + +
    + +
    +
    +

    SMSound Methods

    +

    Functions which may be called directly on sound objects.

    +
    +
    + +
    +

    SMSound Object Methods

    +

    SoundManager provides wrappers for most SMSound methods - eg. soundManager.play('mySound') checks for a valid sound object, and then calls soundManager.sounds['mySound'].play() on that particular object; thus, it is the same as var sound = soundManager.getSoundById('mySound'); mySound.play();

    +

    The following methods can be called directly on a SMSound instance. The method calls are the same as the SoundManager global methods documented above for existing sound objects, minus the sound ID parameter.

    +
    + + + +
    +
    + + + +
    + +
    +

    SoundManager Default Options

    +

    An optional object specifying event handlers etc., passed to createSound() and play().

    +
    + +
    + +
    + +

    SoundManager Global Sound Object Defaults

    + +

    The soundManager.defaultOptions object contains default parameters inherited by sound objects made via createSound(). They can be overridden on a per-sound basis at create time, or changed dynamically in some cases. Note that none of these options are required when calling createSound() except for id and url; the others will inherit the default values if unspecified.

    +

    soundManager.defaultOptions apply the properties and event handlers as specified above. Defaults are shown below as an example.

    + +
    soundManager.defaultOptions = {
    +  autoLoad: false,       // enable automatic loading (otherwise .load() will call with .play())
    +  autoPlay: false,       // enable playing of file ASAP (much faster if "stream" is true)
    +  loops: 1,              // number of times to play the sound. Related: looping (API demo)
    +  multiShot: true,       // let sounds "restart" or "chorus" when played multiple times..
    +  multiShotEvents: false,// allow events (onfinish()) to fire for each shot, if supported.
    +  onid3: null,           // callback function for "ID3 data is added/available"
    +  onload: null,          // callback function for "load finished"
    +  onstop: null,          // callback for "user stop"
    +  onfinish: null,        // callback function for "sound finished playing"
    +  onbeforefinish: null,  // callback for "before sound finished playing (at [time])"
    +  onbeforefinishtime: 5000,    // offset (milliseconds) from sound end, call beforefinish..
    +  onbeforefinishcomplete: null,// function to call when said sound finishes playing
    +  onjustbeforefinish: null,    // callback for [n] msec before end of current sound
    +  onjustbeforefinishtime: 200, // if unused, set to 0 (or null handler), event will not fire.
    +  onpause: null,        // callback for "pause"
    +  onplay: null,         // callback for "play" start
    +  onresume: null,       // callback for "resume" (pause toggle)
    +  position: null,       // offset (milliseconds) to seek to within downloaded sound.
    +  pan: 0,               // "pan" settings, left-to-right, -100 to 100
    +  stream: true,         // allows playing before entire file has loaded (recommended)
    +  type: null,           // MIME-like hint for file pattern / canPlay() tests, eg. audio/mp3
    +  usePolicyFile: false, // enable crossdomain.xml request for audio on remote domains (for ID3/waveform access)
    +  volume: 100,          // self-explanatory. 0-100, the latter being the max.
    +  whileloading: null,   // callback function for updating progress (X of Y bytes received)
    +  whileplaying: null,   // callback during play (position update)
    +
    +  // *** merged soundManager.flash9Options, as applicable ***
    +  isMovieStar: null,    // "MovieStar" MPEG4 audio mode. Null (default) = auto detect MP4, AAC etc. based on URL. true = force on, ignore URL
    +  usePeakData: false,   // enable left/right channel peak (level) data
    +  useWaveformData:false,// enable sound spectrum (raw waveform data) - Note: May be CPU-intensive, UI redraw/layout etc.
    +  useEQData: false,     // enable sound EQ (frequency spectrum data) - Note: CPU potential also.
    +  onbufferchange: null, // callback for "isBuffering" property change
    +  ondataerror: null     // callback for waveform/eq data access error (flash playing audio in other tabs/domains)
    +
    +  // *** merged soundManager.movieStarOptions, as applicable ***
    +  bufferTime: null,     // seconds of data to buffer (null = flash default of 0.1 - if AAC gappy, try up to 3 seconds)
    +  serverURL: null,      // rtmp: flash media server to connect to, required for RTMP
    +  onconnect: null       // rtmp: callback for connection to flash media server
    +
    +}
    +
    + +

    As a simple example, the following code would override the default autoPlay, pan and volume options for a given sound:

    + +
    soundManager.createSound({
    +  id: 'mySound',
    +  url: '/path/to/some.mp3',
    +  autoPlay: true,
    +  pan: -75,
    +  volume: 50
    +});
    + +

    Note: For live examples, see the code behind the "page as playlist" demo which uses much of this functionality.

    + +
    + +
    + +

    Sound Properties Object: Version-specific Options (Merging)

    + +

    Some sound properties object items (eg. usePeakData) are flash version-specific, non-default and are intentionally separated from soundManager.defaultOptions. Flash 9-specific options fall under this category.

    + +

    soundManager.flash9Options and soundManager.movieStarOptions are both defined as separate objects, and if supported according to flashVersion and defaultOptions parameters, are merged "without nesting" into soundManager.defaultOptions.

    + +
    soundManager.flash9Options = {
    +  isMovieStar: null,      // "MovieStar" MPEG4 audio mode. Null (default) = auto detect MP4, AAC etc. based on URL. true = force on, ignore URL
    +  usePeakData: false,     // enable left/right channel peak (level) data
    +  useWaveformData: false, // enable sound spectrum (raw waveform data) - WARNING: May set CPUs on fire.
    +  useEQData: false,       // enable sound EQ (frequency spectrum data) - WARNING: Also CPU-intensive.
    +  onbufferchange: null,	  // callback for "isBuffering" property change
    +  ondataerror: null	  // callback for waveform/eq data access error (flash playing audio in other tabs/domains)
    +}
    +soundManager.movieStarOptions = {
    +  bufferTime: null  // seconds of data to buffer (null = flash default of 0.1 - if AAC gappy, try up to 3 seconds)
    +}
    +// if applicable, these options are merged into soundManager.defaultOptions at SM2 init.
    +// soundManager.flash9Options.isMovieStar -> soundManager.defaultOptions.isMovieStar, etc.
    +
    + +

    defaultOptions.peakData vs. flash9Options.usePeakData

    + +

    Note that soundManager.defaultOptions.peakData will be undefined until SoundManager 2 has self-initialized, at which point it determines the flash version to use and creates the .SWF, etc. Only then will defaultOptions be populated with optional option parameters, if applicable.

    + +

    Once SM2 has written out the .SWF, it is safe to modify soundManager.defaultOptions.usePeakData directly, for example - but if making changes before initialization, eg., at the time when you are setting soundManager.flashVersion, it is best to modify the source objects as they haven't yet been merged. ie., soundManager.flash9Options.usePeakData = true;

    + + +
    + +
    + +
    + +
    +
    +

    SoundManager Runtime Properties

    +

    Elements of SoundManager which are set at runtime, intended as read-only.

    +
    + +
    + +
    + +

    SoundManager Dynamic (Runtime) Properties

    + +

    Some properties are dynamic, determined at initialisation or later during runtime, and should be treated as read-only. Currently, ok() and features are the only properties that fall in this category.

    + +

    soundManager.features Object

    + +

    As certain sound functionality is only available beginning with Flash 9, soundManager.features can provide a consistent way of checking for feature support.

    + +

    The structure (intended as read-only) is currently as follows:

    + +
    soundManager.features = {
    +  buffering: [boolean],
    +  peakData: [boolean],
    +  waveformData: [boolean],
    +  eqData: [boolean],
    +  movieStar: [boolean]
    +}
    + +

    Example (checking for peakData support):

    +
    if (soundManager.features.peakData) {
    +  // do peak data-related things here
    +}
    + +

    The features object is populated at initialisation time; the current feature support tests simply check the value of soundManager.flashVersion being >= 9. This object has been added in anticipation of additional features with future versions of Flash.

    + +
    + +
    +
    + +
    +
    +

    SoundManager Core Events

    +

    Events fired by SoundManager at start-up

    +
    +
    + +
    + +

    The following events are attached to the soundManager global object and are useful for detecting the success/failure of the API's initialisation.

    +

    Keep in mind that these core events are effectively asynchronous (ie., they may fire long before or after window.onload()) and therefore should not be relied on as the "ready" event for starting your application. Use the standard "DOM content loaded" or window load events for your own initialization routines.

    +

    For a more flexible queue-based, addListener-style approach to the onload event, see soundManager.onready().

    + +
    + + +
    onerror()
    +
    Function called when SoundManager fails to successfully initialise after Flash attempts an init call via ExternalInterface.
    +
    Example: soundManager.onerror = function() { alert('SoundManager failed to load'); }
    +
    This handler should be called if there is an ExternalInterface problem or other exceptions that fire when the initialisation function is called.
    +
    If you want multiple listeners for this event, see soundManager.onready().
    + +
    oninitmovie()
    +
    Function called immediately after the SWF is either written to (or retrieved from) the DOM as part of the start-up process. This event can be useful if you wish to implement your own start-up time-out, eg. for handling flash blockers, start-up failures or other custom messaging.
    +
    Example: soundManager.oninitmovie = function(){ alert('SWF init.'); }
    + +
    onload()
    +
    Function called when SoundManager has successfully loaded.
    +
    Example: soundManager.onload = function() { alert('SoundManager ready to use'); }
    +
    Once this function has been called, all core methods will be available to use.
    +
    Note that onload() is not called when SoundManager fails to load; instead, onerror() is called.
    +
    If you want multiple listeners for this event, see soundManager.onready().
    + +
    onready(callback:function(status),[scope])
    +
    Queue onload()-style event listener(s), triggered when soundManager has successfully started.
    +
    Example: soundManager.onready(myOnReadyHandler); soundManager.onready(myOtherHandler);
    +
    For more detail and examples, see soundManager.onready().
    + +
    + +
    + + +
    +
    + +
    +
    +

    SoundManager Collections

    +

    Object collections which SoundManager maintains during runtime.

    +
    +
    + +
    + +

    SoundManager Object Collections

    + +
    +
    soundIDs[]
    +
    An array of sound ID strings, ordered by creation. Can be used to iterate through sounds{} by ID.
    +
    sounds{}
    +
    An object literal/JSON-style instance of SMSound objects indexed by sound ID (as in sounds['mySound'] or sounds.mySound), used internally by SoundManager. soundManager.getSoundById() may be used as an alternate to directly accessing this object.
    +
    + +
    + +
    +
    + +
    + +
    +

    Sound Options Object Format

    +

    Object Literal, JSON-style form passed to createSound() and play()

    +
    + +
    + +
    + +

    Object Literal Format

    + +

    Sounds can be created with instance-specific parameters in an object literal (JSON) format, where omitted parameters inherit default values as defined in soundManager.

    + +
    soundManager.createSound({
    +  id: 'mySound',
    +  url: '/path/to/some.mp3',
    +  autoLoad: true,
    +  autoPlay: false,
    +  onload: function() {
    +    alert('The sound '+this.sID+' loaded!');
    +  },
    +  volume: 50
    +});
    + +

    This object can also be passed as an optional argument to the play method, overriding options set at creation time.

    + +

    For a full list of available options, see Sound Properties Object

    + +
    + + +
    + +
    + +
    + + + + +
    + + + +
    + +

    API Elements

    + +

    SoundManager and SMSound API

    + + + + +
    + +
    + +
    + +
    + + +
    + + +
    + + + + + + + diff --git a/js/libs/soundmanager/doc/resources/index.html b/js/libs/soundmanager/doc/resources/index.html new file mode 100644 index 0000000..8ac72b0 --- /dev/null +++ b/js/libs/soundmanager/doc/resources/index.html @@ -0,0 +1,239 @@ + + + +SoundManager 2: Resources + + + + + + + + + + + + + + + + +
    + + + +
    + + +
    + +
    +

    Licensing

    +

    BSD licensed.

    +
    + +
    +

    SoundManager 2 License

    +

    SoundManager 2 is provided under a BSD license.

    +
    + +
    + + + + + +
    + + + + +
    + + + +
    + + + +
    + +
    + + +
    + + +
    + + + + + + diff --git a/js/libs/soundmanager/doc/technotes/index.html b/js/libs/soundmanager/doc/technotes/index.html new file mode 100644 index 0000000..c24827a --- /dev/null +++ b/js/libs/soundmanager/doc/technotes/index.html @@ -0,0 +1,305 @@ + + + +SoundManager 2: Technical Notes + + + + + + + + + + + + + + + + +
    + + + +
    + + +
    + +
    +
    +
    + +
    +
    +
    + +
    + +
    + +
    +

    Requirements + Specifications

    +

    What SM2 needs, and how it works.

    +
    + +
    + +
    + +

    Requirements + Specifications

    + +

    Prerequisites (client)

    + +
      +
    • Flash plugin, version 8 or higher
    • +
    • Supported Browser
    • +
    + +

    Supported Browsers/Platforms

    + +

    Javascript-to-flash communication is possible through Flash 8's ExternalInterface feature, which uses a standard browser plugin architecture implemented by each browser manufacturer (see NPAPI.) As a result, the following browsers should be supported:

    + +
      +
    • IE 5.0+, Windows
    • +
    • Netscape 8.0+, Windows/Mac
    • +
    • Mozilla 1.7.5+, Windows/Mac
    • +
    • Firefox 1.0+, Windows/Mac
    • +
    • Firefox 1.5+, Linux (Flash 9 beta)
    • +
    • Safari 1.3+, Mac / All Windows versions
    • +
    • Google Chrome (All versions/OSes)
    • +
    • Opera 9.10 (slightly buggy, 9.5+ ideal), Windows/Mac
    • +
    + +

    For reference, see Adobe's Flash 8 documentation, under the "ExternalInterface support" page which details supported browsers.

    + +

    At this time, not all combinations of browser/OS have been tested. Some unlisted configurations may be supported, but have not been explicitly verified to work.

    + +
    + +
    + +

    Caveats + Limitations / FAQ

    + +
    + +
    + +

    Supported sound formats (MP3 via Flash 8 and MP4/M4A/AAC via Flash 9 "MovieStar", with caveats)

    +

    SM2 uses Flash's native Sound object for loading and managing sound, so it is subject to the same limitations that Flash 8 is. Perhaps a design decision, the Flash 8 sound object only supports MP3 files through the loadSound() ActionScript method. SM2 is not able to load other sound formats, including audio-only SWF files, due to this limitation. Refer to the Flash 8 documentation for details.

    + +

    MP3 Format Caveats

    +

    Additionally, some very low and very high bitrate MP3s, and Variable Bitrate (VBR) MP3s may play either too quickly or too slowly (see "the chipmunk problem"); if you are encountering this issue, try re-encoding at a different bitrate (between 64 kbps and 192 kbps, for example.) Using Constant Bitrate (CBR) encoding may also alleviate this problem.

    +

    It has been suggested that sample rates that are neither 22/44 KHz can also contribute to this issue. 44 KHz is the standard CD-spec sample rate, and is recommended for "hi-fi" recordings.

    + +

    Looping

    +

    Perhaps due to the way Flash dynamically loads and decodes MP3 data, seamless looping doesn't seem to be fully implemented. Loops have a noticeable gap between the finish and start. This has been an issue since the original version of SoundManager. Rather than have a broken feature, the funcionality has been omitted until a solid workaround is found.

    + +

    Flash 8 limitations with multiShot (overlaying/"chorus") effects

    +

    Regarding "layering" sounds (calling play() on a sound multiple times): Even though a multi-shot option can be specified, it does not work with Flash 8; a single instance of a sound can only have one timeline. The current behaviour is that when multiShot is specified and play() is called on a currently-playing sound, it will restart from the beginning without an overlay.

    +

    However, the API does provide some creative ways (onbeforefinish for looping, multiple sound objects for multi-shot layering) of working around these Flash limitations.

    +

    It should be noted that sounds can loop seamlessly and be layered when linked and exported to SWF from within the Flash IDE, but SoundManager does not support SWF-based audio.

    + +

    Flash 9 multiShot capabilities

    +

    The Flash 9-based version of SoundManager2 can successfully layer sounds via "multiShot", truly playing a single sound multiple times on top of itself. However the API will only call certain timing-related methods such as whileplaying() for the first play() "instance" of the sound, to avoid confusion. By contrast, simpler methods such as onfinish() will be called multiple times, one for each instance of play().

    + +

    ID3 Parsing

    +

    ID3 data can differ in formatting, version and subsequently be oddly-parsed by Flash. Values may sometimes be repeated across different fields.

    +

    ID3 info seems to fail to load for iTunes 7-edited files, perhaps due to the format or inclusion of album artwork (image data.)

    + +

    Performance Notes: Caching + RAM Obeservations

    +

    Flash appears to use the browser cache (presumably the OS' native, or closest browser,) so the browser's cache size and other settings may affect Flash's cache behaviour. It is safe to assume a 100 MB MP3 will probably not be cached, for example, but a 16 MB one most likely will be.

    +

    MP3s appear to be loaded and stored in RAM while loading over HTTP, so memory use needs to be considered for both large MP3s and streaming radio-type applications.

    + +

    Timing/Latency (JS + Flash, ExternalInterface-related)

    +

    Javascript-to-Flash communication is not instantaneous on slower systems, but can be much better on more modern systems. Latency (timing lag/delays) can be noted in some cases from function call to sound execution. It is possible some performance analysis can help to speed up this area for timing-critical applications involving animation etc., but this area has not been thoroughly investigated yet. Brad Neuberg has some notes on speeding up ExternalInterface which may be relevant.

    +

    Flash-to-OS/hardware latency (where flash reports progress, but no sound is heard for a number of milliseconds) may also be an unfortunate reality of Flash-based audio, varying between platform and OS version etc.

    +

    Additionally, MP3 files may contain audible gaps at the beginning or end by default when encoded, even if the source (eg. WAVE) file did not. Using optional "nogap" encoding options with programs such as LAME may help to remedy this.

    +

    Finally, the useHighPerformance option may help with JS/flash lag. Using this option causes the flash movie to be placed with position:fixed on-screen at all times (though in a small, hidden box) and has been shown to notably improve performance on Mac OS X. As well, useFastPolling will use a lower timer interval within Flash, making polling calls run as quickly as reasonably possible and increasing the frequency of calls to whileplaying(), whileloading() and other time-related events.

    + +
    + +
    + +
    + +
    +
    +

    Debug + Console Output

    +

    Console-style messaging, useful for troubleshooting start-up and runtime issues.

    +
    + +
    +

    Live Debug Output

    +

    With debug mode enabled via soundManager.debugMode = true, SM2 can write helpful troubleshooting information to javascript console.log()-style interfaces. Additionally, output can be written to an optional DIV element with the ID of "soundmanager-debug".

    +

    soundManager.consoleOnly can be set to true to disable HTML output (using console.log()-only methods) as well.

    +

    Additionally, debugging within the Flash portion of SM2 is also available and set using soundManager.debugFlash = true. Debug messages are written to the flash movie itself.

    +

    For info on SoundManager 2 loading/initialization failures and how to fix them, see troubleshooting.

    + +

    Below is a live example of debug output from SM2:

    + +
    +
    + +
    +
    + +

    And, Flash debug output:

    + +
    + +
    + +
    + +
    + + +
    + + + + +
    + + + +
    + + + +
    + +
    + + +
    + + +
    + + + + + + diff --git a/js/libs/soundmanager/index.html b/js/libs/soundmanager/index.html new file mode 100644 index 0000000..7486319 --- /dev/null +++ b/js/libs/soundmanager/index.html @@ -0,0 +1,528 @@ + + + +SoundManager 2: JavaScript Sound For The Web + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + +
    + +
    + +
    +

    What SoundManager 2 does

    +

    Audio features, accessible from JavaScript.

    +
    + +
    + +

    About SoundManager 2, Features and Live Demos

    + +
    + + speaker icon + +

    SoundManager 2 makes it easier to play audio using JavaScript.

    + +

    By wrapping and extending HTML5 and Flash Audio APIs, SoundManager 2 brings reliable cross-platform audio to JavaScript. How it works »

    + +
     
    + +
    + +
    +
    +
    +

    Inline JavaScript Sound API Examples

    +
    +

    Basic MP3 ButtonsMore »

    +
    +

    + Change  coins.mp3 +   |  + Glass 1  glass0.mp3 +   |  2  glass1.mp3 +   |  3  glass2.mp3 +

    +
    +

    Playable MP3 linksMore »

    + +

    360° Player UIMore »

    +
    +
    + + +
    +
    +
    + +

    Muxtape-style UI (+HTML5 tests)More »

    + + +
     
    + +
    + + +debug + +
    + +
    + +
    + +

    HTML5 Audio Support (Beta-ish)

    +
      +
    • 100% Flash-free MP3 + MP4/AAC where supported. Works on iPad, iPhone iOS 4
    • +
    • Fallback to Flash for MP3/MP4 support, as needed
    • +
    • SM2 API is unchanged, transparent; HTML5/Flash switching handled internally
    • +
    • HTML5 API support approximates Flash 8 API features, minus ID3, plus buffering
    • +
    • Some other formats (WAV/OGG) supported via HTML5, depending on browser
    • +
    • See soundManager.useHTML5Audio for implementation details
    • +
    + +

    Basic API Features (Flash 8)

    +
      +
    • Load, stop, play, pause, mute, seek, pan, volume control from JavaScript
    • +
    • Events: onload(), whileloading(), whileplaying(), onfinish() and more
    • +
    • ID3V1 and ID3V2 tag support for MP3s (title, artist, genre etc.)
    • +
    + +

    Shiny Flash 9-only Features

    + +
    + + +
    Beta-ish, somewhat experimental demo
    + +
    + +
      +
    • RTMP / Flash Media Server streaming support (experimental) - see serverURL for details
    • +
    • MPEG-4 (AAC, HE-AAC, H.264) audio support
    • +
    • "MultiShot" play (layered/chorusing effects)
    • +
    • Waveform/frequency spectrum data
    • +
    • Peak (L/R channel volume) data
    • +
    • Audio buffering state/event handling
    • +
    + +

    General Tech Stuff

    + + +

    As Heard On TV The Internets

    +

    A few nifty places SoundManager 2 has been seen in use on the Wild World Web:

    + + +

    Download!

    +

    Get SoundManager 2

    + +
    + +
     
    + +
    + +
    +

    Playing MP3s with JavaScript

    +

    Play audio in one line, or get fancy with multiple options.

    +
    + +
    +

    How To Play Audio Using SoundManager 2

    +

    Simple ID / URL method:

    + soundManager.play('mySound','/path/to/an.mp3'); +

    And, setting the volume:

    + soundManager.setVolume('mySound',50); +

    More flexible method supporting option parameters as an object literal:

    +
    var mySound = soundManager.createSound({
    +  id: 'someSound',
    +  url: '/path/to/some.mp3',
    +  volume: 50,
    +  onload: soundLoadedFunction
    +});
    +mySound.play();
    +

    See API Demos

    +
    + +
    + +
    + +
    +

    Using SM2 on your site

    +

    How to include SoundManager 2 from HTML, and some basic event handlers.

    +
    + +
    +

    Include the SoundManager 2 core script, tell it where to look for the flash .SWF and provide an onload() handler.

    +
    <script type="text/javascript" src="/path/to/soundmanager2.js"></script>
    +<script type="text/javascript">
    +soundManager.url = '/path/to/swfs/';
    +soundManager.onload = function() {
    +  // SM2 is ready to go! 
    +  // soundManager.createSound(...) calls can now be made, etc.
    +}
    +</script>
    + +

    See a basic template demo

    + +
    + +
    + +
    + +
    +

    Licensing

    +

    BSD licensed.

    +
    + +
    +

    SoundManager 2 is provided under a BSD license.

    +
    + +
    + + +
    + +
    + + + + +
    + +
    + +
    +
    +
    +
    +
    +
    +
    +
    + %s1 / %s2
    +
    +
    +
    +
    +
    +
    + +
    +
    +
    +
    +
    + + + +
    + + + + diff --git a/js/libs/soundmanager/license.txt b/js/libs/soundmanager/license.txt new file mode 100644 index 0000000..4aebf4c --- /dev/null +++ b/js/libs/soundmanager/license.txt @@ -0,0 +1,29 @@ +Software License Agreement (BSD License) + +Copyright (c) 2007, Scott Schiller (schillmania.com) +All rights reserved. + +Redistribution and use in source and binary forms, with or without modification, +are permitted provided that the following conditions are met: + +* Redistributions of source code must retain the above copyright notice, this + list of conditions and the following disclaimer. + +* Redistributions in binary form must reproduce the above copyright notice, this + list of conditions and the following disclaimer in the documentation and/or + other materials provided with the distribution. + +* Neither the name of schillmania.com nor the names of its contributors may be + used to endorse or promote products derived from this software without + specific prior written permission from schillmania.com. + +THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND +ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED +WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE +DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR +ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES +(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; +LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON +ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT +(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS +SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. \ No newline at end of file diff --git a/js/libs/soundmanager/script/soundmanager2-jsmin.js b/js/libs/soundmanager/script/soundmanager2-jsmin.js new file mode 100644 index 0000000..4f454aa --- /dev/null +++ b/js/libs/soundmanager/script/soundmanager2-jsmin.js @@ -0,0 +1,96 @@ +/** @license + + SoundManager 2: Javascript Sound for the Web + -------------------------------------------- + http://schillmania.com/projects/soundmanager2/ + + Copyright (c) 2007, Scott Schiller. All rights reserved. + Code provided under the BSD License: + http://schillmania.com/projects/soundmanager2/license.txt + + V2.97a.20110101 +*/ +(function(P){function xa(Oa,Pa){function ya(){if(b.debugURLParam.test(J))b.debugMode=true;if(x(b.debugID))return false;var c,a,f,h;if(b.debugMode&&!x(b.debugID)&&(!ga||!b.useConsole||b.useConsole&&ga&&!b.consoleOnly)){c=l.createElement("div");c.id=b.debugID+"-toggle";a={position:"fixed",bottom:"0px",right:"0px",width:"1.2em",height:"1.2em",lineHeight:"1.2em",margin:"2px",textAlign:"center",border:"1px solid #999",cursor:"pointer",background:"#fff",color:"#333",zIndex:10001};c.appendChild(l.createTextNode("-")); +c.onclick=za;c.title="Toggle SM2 debug console";if(A.match(/msie 6/i)){c.style.position="absolute";c.style.cursor="hand"}for(h in a)if(a.hasOwnProperty(h))c.style[h]=a[h];a=l.createElement("div");a.id=b.debugID;a.style.display=b.debugMode?"block":"none";if(b.debugMode&&!x(c.id)){try{f=X();f.appendChild(c)}catch(e){throw Error(q("appXHTML"));}f.appendChild(a)}}}this.flashVersion=8;this.debugMode=true;this.debugFlash=false;this.useConsole=true;this.waitForWindowLoad=this.consoleOnly=false;this.nullURL= +"about:blank";this.allowPolling=true;this.useFastPolling=false;this.useMovieStar=true;this.bgColor="#ffffff";this.useHighPerformance=false;this.flashPollingInterval=null;this.flashLoadTimeout=1E3;this.wmode=null;this.allowScriptAccess="always";this.useHTML5Audio=this.useFlashBlock=false;this.html5Test=/^probably$/i;this.ondebuglog=false;this.audioFormats={mp3:{type:['audio/mpeg; codecs="mp3"',"audio/mpeg","audio/mp3","audio/MPA","audio/mpa-robust"],required:true},mp4:{related:["aac","m4a"],type:['audio/mp4; codecs="mp4a.40.2"', +"audio/aac","audio/x-m4a","audio/MP4A-LATM","audio/mpeg4-generic"],required:true},ogg:{type:["audio/ogg; codecs=vorbis"],required:false},wav:{type:['audio/wav; codecs="1"',"audio/wav","audio/wave","audio/x-wav"],required:false}};this.defaultOptions={autoLoad:false,stream:true,autoPlay:false,loops:1,onid3:null,onload:null,whileloading:null,onplay:null,onpause:null,onresume:null,whileplaying:null,onstop:null,onfailure:null,onfinish:null,onbeforefinish:null,onbeforefinishtime:5E3,onbeforefinishcomplete:null, +onjustbeforefinish:null,onjustbeforefinishtime:200,multiShot:true,multiShotEvents:false,position:null,pan:0,type:null,usePolicyFile:false,volume:100};this.flash9Options={isMovieStar:null,usePeakData:false,useWaveformData:false,useEQData:false,onbufferchange:null,ondataerror:null,onstats:null};this.movieStarOptions={bufferTime:3,serverURL:null,onconnect:null,bufferTimes:null,duration:null};this.version=null;this.versionNumber="V2.97a.20110101";this.movieURL=null;this.url=Oa||null;this.altURL=null; +this.enabled=this.swfLoaded=false;this.o=null;this.movieID="sm2-container";this.id=Pa||"sm2movie";this.swfCSS={swfBox:"sm2-object-box",swfDefault:"movieContainer",swfError:"swf_error",swfTimedout:"swf_timedout",swfUnblocked:"swf_unblocked",sm2Debug:"sm2_debug",highPerf:"high_performance",flashDebug:"flash_debug"};this.oMC=null;this.sounds={};this.soundIDs=[];this.muted=false;this.debugID="soundmanager-debug";this.debugURLParam=/([#?&])debug=1/i;this.didFlashBlock=this.specialWmodeCase=false;this.filePattern= +null;this.filePatterns={flash8:/\.mp3(\?.*)?$/i,flash9:/\.mp3(\?.*)?$/i};this.baseMimeTypes=/^\s*audio\/(?:x-)?(?:mp(?:eg|3))\s*(?:$|;)/i;this.netStreamMimeTypes=/^\s*audio\/(?:x-)?(?:mp(?:eg|3))\s*(?:$|;)/i;this.netStreamTypes=["aac","flv","mov","mp4","m4v","f4v","m4a","mp4v","3gp","3g2"];this.netStreamPattern=RegExp("\\.("+this.netStreamTypes.join("|")+")(\\?.*)?$","i");this.mimePattern=this.baseMimeTypes;this.features={buffering:false,peakData:false,waveformData:false,eqData:false,movieStar:false}; +this.sandbox={type:null,types:{remote:"remote (domain-based) rules",localWithFile:"local with file access (no internet access)",localWithNetwork:"local with network (internet access only, no local access)",localTrusted:"local, trusted (local+internet access)"},description:null,noRemote:null,noLocal:null};this.hasHTML5=null;this.html5={usingFlash:null};this.ignoreFlash=false;var ha,b=this,x,A=navigator.userAgent,J=P.location.href.toString(),o=this.flashVersion,l=document,p=P,ia,Y,E=[],ja=true,B,K= +false,Q=false,t=false,C=false,ka=false,m,Qa=0,R,y,la,G,L,ma,Z,Aa,na,H,Ba,$,S,M,oa,X,aa,pa,Ca,Ra=["log","info","warn","error"],Da,ba,Ea,T=null,qa=null,q,ra,N,za,ca,da,sa,u,ea=false,ta=false,Fa,Ga,I=null,Ha,fa,z=false,U,F,ua,Ia,v,Ja=Array.prototype.slice,Ka=A.match(/pre\//i),Sa=A.match(/(ipad|iphone|ipod)/i);A.match(/mobile/i);var D=A.match(/MSIE/i),La=A.match(/webkit/i),V=A.match(/safari/i)&&!A.match(/chrome/i),ga=typeof console!=="undefined"&&typeof console.log!=="undefined",va=typeof l.hasFocus!== +"undefined"?l.hasFocus():null,O=typeof l.hasFocus==="undefined"&&V,Ma=!O;this._use_maybe=J.match(/sm2\-useHTML5Maybe\=1/i);this._overHTTP=l.location?l.location.protocol.match(/http/i):null;this.useAltURL=!this._overHTTP;if(Sa||Ka){b.useHTML5Audio=true;b.ignoreFlash=true}if(Ka||this._use_maybe)b.html5Test=/^(probably|maybe)$/i;(function(){var c=J,a=null;if(c.indexOf("#sm2-usehtml5audio=")!==-1){a=c.substr(c.indexOf("#sm2-usehtml5audio=")+19)==="1";if(typeof console!=="undefined"&&typeof console.log!== +"undefined")console.log((a?"Enabling ":"Disabling ")+"useHTML5Audio via URL parameter");b.useHTML5Audio=a}})();this.supported=this.ok=function(){return I?t&&!C:b.useHTML5Audio&&b.hasHTML5};this.getMovie=function(c){return D?p[c]:V?x(c)||l[c]:x(c)};this.createSound=function(c){function a(){f=ca(f);b.sounds[e.id]=new ha(e);b.soundIDs.push(e.id);return b.sounds[e.id]}var f=null,h=null,e=null;if(!t||!b.ok()){sa("soundManager.createSound(): "+q(!t?"notReady":"notOK"));return false}if(arguments.length=== +2)c={id:arguments[0],url:arguments[1]};e=f=y(c);e.id.toString().charAt(0).match(/^[0-9]$/)&&b._wD("soundManager.createSound(): "+q("badID",e.id),2);b._wD("soundManager.createSound(): "+e.id+" ("+e.url+")",1);if(u(e.id,true)){b._wD("soundManager.createSound(): "+e.id+" exists",1);return b.sounds[e.id]}if(fa(e)){h=a();b._wD("Loading sound "+e.id+" via HTML5");h._setup_html5(e)}else{if(o>8&&b.useMovieStar){if(e.isMovieStar===null)e.isMovieStar=e.serverURL||(e.type?e.type.match(b.netStreamPattern):false)|| +e.url.match(b.netStreamPattern)?true:false;e.isMovieStar&&b._wD("soundManager.createSound(): using MovieStar handling");if(e.isMovieStar){if(e.usePeakData){m("noPeak");e.usePeakData=false}e.loops>1&&m("noNSLoop")}}e=da(e,"soundManager.createSound(): ");h=a();if(o===8)b.o._createSound(e.id,e.onjustbeforefinishtime,e.loops||1,e.usePolicyFile);else{b.o._createSound(e.id,e.url,e.onjustbeforefinishtime,e.usePeakData,e.useWaveformData,e.useEQData,e.isMovieStar,e.isMovieStar?e.bufferTime:false,e.loops|| +1,e.serverURL,e.duration||null,e.autoPlay,true,e.bufferTimes,e.onstats?true:false,e.autoLoad,e.usePolicyFile);if(!e.serverURL){h.connected=true;e.onconnect&&e.onconnect.apply(h)}}}if(e.autoLoad||e.autoPlay)if(h)if(b.isHTML5){h.autobuffer="auto";h.preload="auto"}else h.load(e);e.autoPlay&&h.play();return h};this.destroySound=function(c,a){if(!u(c))return false;var f=b.sounds[c],h;f._iO={};f.stop();f.unload();for(h=0;h=2)e.style.fontWeight="bold";if(a===3)e.style.color="#ff3333"}h.insertBefore(e,h.firstChild)}catch(k){}return true};this._debug= +function(){m("currentObj",1);for(var c=0,a=b.soundIDs.length;c0){b._wD('SMSound.play(): "'+a.sID+'" is resuming from paused state',1);a.resume()}else{b._wD('SMSound.play(): "'+a.sID+'" is starting to play');a.playState=1;a.paused=false;if(!a.instanceCount||a._iO.multiShotEvents||o>8&&!a.isHTML5&&!a.getAutoPlay())a.instanceCount++; +a.position=typeof a._iO.position!=="undefined"&&!isNaN(a._iO.position)?a._iO.position:0;if(!a.isHTML5)a._iO=da(ca(a._iO));if(a._iO.onplay&&g){a._iO.onplay.apply(a);a._onplay_called=true}a.setVolume(a._iO.volume,true);a.setPan(a._iO.pan,true);if(a.isHTML5){n();a._setup_html5().play()}else b.o._start(a.sID,a._iO.loops||1,o===9?a.position:a.position/1E3)}return a};this.stop=function(d){if(a.playState===1){a._onbufferchange(0);a.resetOnPosition(0);if(!a.isHTML5)a.playState=0;a.paused=false;a._iO.onstop&& +a._iO.onstop.apply(a);if(a.isHTML5){if(i){a.setPosition(0);i.pause();a.playState=0;a._onTimer();k();a.unload()}}else{b.o._stop(a.sID,d);a._iO.serverURL&&a.unload()}a.instanceCount=0;a._iO={}}return a};this.setAutoPlay=function(d){b._wD("sound "+a.sID+" turned autoplay "+(d?"on":"off"));a._iO.autoPlay=d;b.o._setAutoPlay(a.sID,d);if(d)if(!a.instanceCount&&a.readyState===1){a.instanceCount++;b._wD("sound "+a.sID+" incremented instance count to "+a.instanceCount)}};this.getAutoPlay=function(){return a._iO.autoPlay}; +this.setPosition=function(d){if(d===undefined)d=0;d=a.isHTML5?Math.max(d,0):Math.min(a.duration||a._iO.duration,Math.max(d,0));a.position=d;a.resetOnPosition(a.position);a._iO.position=d;if(a.isHTML5){if(i){b._wD("setPosition(): setting position to "+a.position/1E3);if(a.playState)try{i.currentTime=a.position/1E3}catch(g){b._wD("setPosition("+a.position+"): WARN: Caught exception: "+g.message,2)}else b._wD("HTML5 warning: cannot set position while playState == 0 (not playing)",2);if(a.paused){a._onTimer(true); +a._iO.useMovieStar&&a.resume()}}}else{d=o===9?a.position:a.position/1E3;a.serverURL&&a.playState===0?a.play({position:d}):b.o._setPosition(a.sID,d,a.paused||!a.playState)}return a};this.pause=function(d){if(a.paused||a.playState===0&&a.readyState!==1)return a;b._wD("SMSound.pause()");a.paused=true;if(a.isHTML5){a._setup_html5().pause();k()}else if(d||d===undefined)b.o._pause(a.sID);a._iO.onpause&&a._iO.onpause.apply(a);return a};this.resume=function(){if(!a.paused)return a;b._wD("SMSound.resume()"); +a.paused=false;a.playState=1;if(a.isHTML5){a._setup_html5().play();n()}else{b.o._pause(a.sID);a._iO.isMovieStar&&La&&a.setPosition(a.position)}if(!a._onplay_called&&a._iO.onplay){a._iO.onplay.apply(a);a._onplay_called=true}else a._iO.onresume&&a._iO.onresume.apply(a);return a};this.togglePause=function(){b._wD("SMSound.togglePause()");if(a.playState===0){a.play({position:o===9&&!a.isHTML5?a.position:a.position/1E3});return a}a.paused?a.resume():a.pause();return a};this.setPan=function(d,g){if(typeof d=== +"undefined")d=0;if(typeof g==="undefined")g=false;a.isHTML5||b.o._setPan(a.sID,d);a._iO.pan=d;if(!g)a.pan=d;return a};this.setVolume=function(d,g){if(typeof d==="undefined")d=100;if(typeof g==="undefined")g=false;if(a.isHTML5){if(i)i.volume=d/100}else b.o._setVolume(a.sID,b.muted&&!a.muted||a.muted?0:d);a._iO.volume=d;if(!g)a.volume=d;return a};this.mute=function(){a.muted=true;if(a.isHTML5){if(i)i.muted=true}else b.o._setVolume(a.sID,0);return a};this.unmute=function(){a.muted=false;var d=typeof a._iO.volume!== +"undefined";if(a.isHTML5){if(i)i.muted=false}else b.o._setVolume(a.sID,d?a._iO.volume:a.options.volume);return a};this.toggleMute=function(){return a.muted?a.unmute():a.mute()};this.onposition=function(d,g,j){a._onPositionItems.push({position:d,method:g,scope:typeof j!=="undefined"?j:a,fired:false});return a};this.processOnPosition=function(){var d,g;d=a._onPositionItems.length;if(!d||!a.playState||a._onPositionFired>=d)return false;for(d=d;d--;){g=a._onPositionItems[d];if(!g.fired&&a.position>=g.position){g.method.apply(g.scope, +[g.position]);g.fired=true;b._onPositionFired++}}return true};this.resetOnPosition=function(d){var g,j;g=a._onPositionItems.length;if(!g)return false;for(g=g;g--;){j=a._onPositionItems[g];if(j.fired&&d<=j.position){j.fired=false;b._onPositionFired--}}return true};this._onTimer=function(d){var g={};if(a._hasTimer||d)if(i&&(d||(a.playState>0||a.readyState===1)&&!a.paused)){a.duration=s();a.durationEstimate=a.duration;d=i.currentTime?i.currentTime*1E3:0;a._whileplaying(d,g,g,g,g);return true}else{b._wD('_onTimer: Warn for "'+ +a.sID+'": '+(!i?"Could not find element. ":"")+(a.playState===0?"playState bad, 0?":"playState = "+a.playState+", OK"));return false}};s=function(){var d=i?i.duration*1E3:undefined;return d&&!isNaN(d)?d:null};n=function(){a.isHTML5&&Fa(a)};k=function(){a.isHTML5&&Ga(a)};f=function(){a._onPositionItems=[];a._onPositionFired=0;a._hasTimer=null;a._added_events=null;a._onplay_called=false;i=a._audio=null;a.bytesLoaded=null;a.bytesTotal=null;a.position=null;a.duration=a._iO&&a._iO.duration?a._iO.duration: +null;a.durationEstimate=null;a.failures=0;a.loaded=false;a.playState=0;a.paused=false;a.readyState=0;a.muted=false;a.didBeforeFinish=false;a.didJustBeforeFinish=false;a.isBuffering=false;a.instanceOptions={};a.instanceCount=0;a.peakData={left:0,right:0};a.waveformData={left:[],right:[]};a.eqData=[];a.eqData.left=[];a.eqData.right=[]};f();this._setup_html5=function(d){d=y(a._iO,d);if(i){if(a.url!==d.url){b._wD("setting new URL on existing object: "+d.url);i.src=d.url}}else{b._wD("creating HTML5 Audio() element with URL: "+ +d.url);a._audio=new Audio(d.url);i=a._audio;a.isHTML5=true;h()}i.loop=d.loops>1?"loop":"";return a._audio};e={canplay:function(){b._wD("HTML5::canplay: "+a.sID);a._onbufferchange(0)},load:function(){if(i&&!a.loaded){a._onbufferchange(0);a._whileloading(a.bytesTotal,a.bytesTotal,s());a._onload(true)}},ended:function(){b._wD("HTML5::ended: "+a.sID);a._onfinish()},error:function(){if(i){b._wD("HTML5::error: "+i.error.code);a._onload(false)}},loadstart:function(){b._wD("HTML5::loadstart: "+a.sID);a._onbufferchange(1)}, +play:function(){b._wD("HTML5::play: "+a.sID);a._onbufferchange(0)},playing:function(){b._wD("HTML5::playing: "+a.sID);a._onbufferchange(0)},progress:function(d){if(!i||a.loaded)return false;var g,j,r;r=0;var w=d.type==="progress";j=d.target.buffered;var W=d.loaded||0,wa=d.total||1;if(j&&j.length){for(g=j.length;g--;)r=j.end(g)-j.start(g);W=r/d.target.duration;if(w&&j.length>1){r=[];j=j.length;for(g=0;ga._iO.duration?a.duration:a._iO.duration:parseInt(a.bytesTotal/a.bytesLoaded*a.duration,10);if(a.durationEstimate===undefined)a.durationEstimate=a.duration}a.readyState!==3&&a._iO.whileloading&&a._iO.whileloading.apply(a)};this._onid3=function(d,g){b._wD('SMSound._onid3(): "'+this.sID+'" ID3 data received.'); +var j=[],r,w;r=0;for(w=d.length;r0)d=0;a.position=d;a.processOnPosition();if(o>8&&!a.isHTML5){if(a._iO.usePeakData&&typeof g!=="undefined"&&g)a.peakData={left:g.leftPeak,right:g.rightPeak};if(a._iO.useWaveformData&&typeof j!=="undefined"&&j)a.waveformData={left:j.split(","),right:r.split(",")};if(a._iO.useEQData)if(typeof w!=="undefined"&& +w&&w.leftEQ){d=w.leftEQ.split(",");a.eqData=d;a.eqData.left=d;if(typeof w.rightEQ!=="undefined"&&w.rightEQ)a.eqData.right=w.rightEQ.split(",")}}if(a.playState===1){!a.isHTML5&&b.flashVersion===8&&!a.position&&a.isBuffering&&a._onbufferchange(0);a._iO.whileplaying&&a._iO.whileplaying.apply(a);if((a.loaded||!a.loaded&&a._iO.isMovieStar)&&a._iO.onbeforefinish&&a._iO.onbeforefinishtime&&!a.didBeforeFinish&&a.duration-a.position<=a._iO.onbeforefinishtime)a._onbeforefinish()}return true};this._onconnect= +function(d){d=d===1;b._wD('SMSound._onconnect(): "'+a.sID+'"'+(d?" connected.":" failed to connect? - "+a.url),d?1:2);if(a.connected=d){a.failures=0;a._iO.onconnect&&a._iO.onconnect.apply(a,[d]);if(u(a.sID)&&(a.options.autoLoad||a.getAutoPlay()))a.play(undefined,a.getAutoPlay())}};this._onload=function(d){d=d?true:false;b._wD('SMSound._onload(): "'+a.sID+'"'+(d?" loaded.":" failed to load? - "+a.url),d?1:2);if(!d&&!a.isHTML5){b.sandbox.noRemote===true&&b._wD("SMSound._onload(): "+q("noNet"),1);b.sandbox.noLocal=== +true&&b._wD("SMSound._onload(): "+q("noLocal"),1)}a.loaded=d;a.readyState=d?3:2;a._onbufferchange(0);a._iO.onload&&a._iO.onload.apply(a,[d]);return true};this._onfailure=function(d,g,j){a.failures++;b._wD('SMSound._onfailure(): "'+a.sID+'" count '+a.failures);a._iO.onfailure&&a.failures===1?a._iO.onfailure(a,d,g,j):b._wD("SMSound._onfailure(): ignoring")};this._onbeforefinish=function(){if(!a.didBeforeFinish){a.didBeforeFinish=true;if(a._iO.onbeforefinish){b._wD('SMSound._onbeforefinish(): "'+a.sID+ +'"');a._iO.onbeforefinish.apply(a)}}};this._onjustbeforefinish=function(){if(!a.didJustBeforeFinish){a.didJustBeforeFinish=true;if(a._iO.onjustbeforefinish){b._wD('SMSound._onjustbeforefinish(): "'+a.sID+'"');a._iO.onjustbeforefinish.apply(a)}}};this._onstats=function(d){a._iO.onstats&&a._iO.onstats(a,d)};this._onfinish=function(){a._onbufferchange(0);a.resetOnPosition(0);a._iO.onbeforefinishcomplete&&a._iO.onbeforefinishcomplete.apply(a);a.didBeforeFinish=false;a.didJustBeforeFinish=false;if(a.instanceCount){a.instanceCount--; +if(!a.instanceCount){a.playState=0;a.paused=false;a.instanceCount=0;a.instanceOptions={};k()}if(!a.instanceCount||a._iO.multiShotEvents)if(a._iO.onfinish){b._wD('SMSound._onfinish(): "'+a.sID+'"');a._iO.onfinish.apply(a)}}};this._onbufferchange=function(d){if(a.playState===0)return false;if(d&&a.isBuffering||!d&&!a.isBuffering)return false;a.isBuffering=d===1;if(a._iO.onbufferchange){b._wD("SMSound._onbufferchange(): "+d);a._iO.onbufferchange.apply(a)}return true};this._ondataerror=function(d){if(a.playState> +0){b._wD("SMSound._ondataerror(): "+d);a._iO.ondataerror&&a._iO.ondataerror.apply(a)}}};X=function(){return l.body?l.body:l._docElement?l.documentElement:l.getElementsByTagName("div")[0]};x=function(c){return l.getElementById(c)};y=function(c,a){var f={},h,e;for(h in c)if(c.hasOwnProperty(h))f[h]=c[h];h=typeof a==="undefined"?b.defaultOptions:a;for(e in h)if(h.hasOwnProperty(e)&&typeof f[e]==="undefined")f[e]=h[e];return f};v=function(){function c(e){e=Ja.call(e);var k=e.length;if(f){e[1]="on"+e[1]; +k>3&&e.pop()}else k===3&&e.push(false);return e}function a(e,k){var n=e.shift(),s=[h[k]];f?n[s](e[0],e[1]):n[s].apply(n,e)}var f=p.attachEvent,h={add:f?"attachEvent":"addEventListener",remove:f?"detachEvent":"removeEventListener"};return{add:function(){a(c(arguments),"add")},remove:function(){a(c(arguments),"remove")}}}();fa=function(c){return c.type?U({type:c.type}):U(c.url)||z};U=function(c){if(!b.useHTML5Audio||!b.hasHTML5)return false;var a,f=b.audioFormats;if(!F){F=[];for(a in f)if(f.hasOwnProperty(a)){F.push(a); +if(f[a].related)F=F.concat(f[a].related)}F=RegExp("\\.("+F.join("|")+")","i")}a=typeof c.type!=="undefined"?c.type:null;c=typeof c==="string"?c.toLowerCase().match(F):null;if(!c||!c.length){if(!a)return false}else c=c[0].substr(1);if(c&&typeof b.html5[c]!=="undefined")return b.html5[c];else{if(!a)if(c&&b.html5[c])return b.html5[c];else a="audio/"+c;a=b.html5.canPlayType(a);return b.html5[c]=a}};Ia=function(){function c(n){var s,i,d=false;if(!a||typeof a.canPlayType!=="function")return false;if(n instanceof +Array){s=0;for(i=n.length;s1&&c.stream){m("as2loop");c.stream=false}return c};da=function(c,a){if(c&&!c.usePolicyFile&&(c.onid3||c.usePeakData||c.useWaveformData||c.useEQData)){b._wD((a?a+":":"")+q("policy"));c.usePolicyFile=true}return c};sa=function(c){typeof console!=="undefined"&&typeof console.warn!=="undefined"?console.warn(c):b._wD(c)}; +ia=function(){return false};Da=function(c){for(var a in c)if(c.hasOwnProperty(a)&&typeof c[a]==="function")c[a]=ia};ba=function(c){if(typeof c==="undefined")c=false;if(C||c){m("smFail",2);b.disable(c)}};Ea=function(c){var a=null;if(c)if(c.match(/\.swf(\?.*)?$/i)){if(a=c.substr(c.toLowerCase().lastIndexOf(".swf?")+4))return c}else if(c.lastIndexOf("/")!==c.length-1)c+="/";return(c&&c.lastIndexOf("/")!==-1?c.substr(0,c.lastIndexOf("/")+1):"./")+b.movieURL};na=function(){if(o!==8&&o!==9){b._wD(q("badFV", +o,8));b.flashVersion=8}var c=b.debugMode||b.debugFlash?"_debug.swf":".swf";if(b.useHTML5Audio&&!z&&b.audioFormats.mp4.required&&b.flashVersion<9){b._wD(q("needfl9"));b.flashVersion=9}o=b.flashVersion;b.version=b.versionNumber+(z?" (HTML5-only mode)":o===9?" (AS3/Flash 9)":" (AS2/Flash 8)");if(o>8){b.defaultOptions=y(b.defaultOptions,b.flash9Options);b.features.buffering=true}if(o>8&&b.useMovieStar){b.defaultOptions=y(b.defaultOptions,b.movieStarOptions);b.filePatterns.flash9=RegExp("\\.(mp3|"+b.netStreamTypes.join("|")+ +")(\\?.*)?$","i");b.mimePattern=b.netStreamMimeTypes;b.features.movieStar=true}else{b.useMovieStar=false;b.features.movieStar=false}b.filePattern=b.filePatterns[o!==8?"flash9":"flash8"];b.movieURL=(o===8?"soundmanager2.swf":"soundmanager2_flash9.swf").replace(".swf",c);b.features.peakData=b.features.waveformData=b.features.eqData=o>8};Ca=function(c,a){if(!b.o||!b.allowPolling)return false;b.o._setPolling(c,a)};aa=function(c,a){function f(){b._wD("-- SoundManager 2 "+b.version+(!z&&b.useHTML5Audio? +b.hasHTML5?" + HTML5 audio":", no HTML5 audio support":"")+(!z?(b.useMovieStar?", MovieStar mode":"")+(b.useHighPerformance?", high performance mode, ":", ")+((b.flashPollingInterval?"custom ("+b.flashPollingInterval+"ms)":b.useFastPolling?"fast":"normal")+" polling")+(b.wmode?", wmode: "+b.wmode:"")+(b.debugFlash?", flash debug mode":"")+(b.useFlashBlock?", flashBlock mode":""):"")+" --",1)}var h=a?a:b.url,e=b.altURL?b.altURL:h,k;k=X();var n,s,i=N(),d,g=null;g=(g=l.getElementsByTagName("html")[0])&& +g.dir&&g.dir.match(/rtl/i);c=typeof c==="undefined"?b.id:c;if(K&&Q)return false;if(z){na();f();b.oMC=x(b.movieID);Y();Q=K=true;return false}K=true;na();b.url=Ea(b._overHTTP?h:e);a=b.url;b.wmode=!b.wmode&&b.useHighPerformance&&!b.useMovieStar?"transparent":b.wmode;if(b.wmode!==null&&!D&&!b.useHighPerformance&&navigator.platform.match(/win32/i)){b.specialWmodeCase=true;m("spcWmode");b.wmode=null}k={name:c,id:c,src:a,width:"100%",height:"100%",quality:"high",allowScriptAccess:b.allowScriptAccess,bgcolor:b.bgColor, +pluginspage:"http://www.macromedia.com/go/getflashplayer",type:"application/x-shockwave-flash",wmode:b.wmode};if(b.debugFlash)k.FlashVars="debug=1";b.wmode||delete k.wmode;if(D){h=l.createElement("div");s=''+(b.wmode?' ': +"")+''+(b.debugFlash?'':"")+"'; + } else { + oMovie = _doc.createElement('embed'); + for (tmp in oEmbed) { + if (oEmbed.hasOwnProperty(tmp)) { + oMovie.setAttribute(tmp, oEmbed[tmp]); + } + } + } + + _initDebug(); + extraClass = _getSWFCSS(); + oTarget = _getDocument(); + + if (oTarget) { + _s.oMC = _id(_s.movieID)?_id(_s.movieID):_doc.createElement('div'); + if (!_s.oMC.id) { + _s.oMC.id = _s.movieID; + _s.oMC.className = _s.swfCSS.swfDefault + ' ' + extraClass; + // "hide" flash movie + s = null; + oEl = null; + if (!_s.useFlashBlock) { + if (_s.useHighPerformance) { + s = { + 'position': 'fixed', + 'width': '8px', + 'height': '8px', + // >= 6px for flash to run fast, >= 8px to start up under Firefox/win32 in some cases. odd? yes. + 'bottom': '0px', + 'left': '0px', + 'overflow': 'hidden', + 'hasPriority': 'true' // http://help.adobe.com/en_US/as3/mobile/WS4bebcd66a74275c36cfb8137124318eebc6-7ffd.html + }; + } else { + s = { + 'position': 'absolute', + 'width': '6px', + 'height': '6px', + 'top': '-9999px', + 'left': '-9999px', + 'hasPriority': 'true' + }; + if (isRTL) { + s.left = Math.abs(parseInt(s.left,10))+'px'; + } + } + } + if (_isWebkit) { + _s.oMC.style.zIndex = 10000; // soundcloud-reported render/crash fix, safari 5 + } + if (!_s.debugFlash) { + for (x in s) { + if (s.hasOwnProperty(x)) { + _s.oMC.style[x] = s[x]; + } + } + } + try { + if (!_isIE) { + _s.oMC.appendChild(oMovie); + } + oTarget.appendChild(_s.oMC); + if (_isIE) { + oEl = _s.oMC.appendChild(_doc.createElement('div')); + oEl.className = _s.swfCSS.swfBox; + oEl.innerHTML = movieHTML; + } + _appendSuccess = true; + } catch(e) { + throw new Error(_str('appXHTML')); + } + } else { + // it's already in the document. + sClass = _s.oMC.className; + _s.oMC.className = (sClass?sClass+' ':_s.swfCSS.swfDefault) + (extraClass?' '+extraClass:''); + _s.oMC.appendChild(oMovie); + if (_isIE) { + oEl = _s.oMC.appendChild(_doc.createElement('div')); + oEl.className = _s.swfCSS.swfBox; + oEl.innerHTML = movieHTML; + } + _appendSuccess = true; + } + } + + if (specialCase) { + //_s._wD(specialCase); + } + + _initMsg(); + //_s._wD('soundManager::createMovie(): Trying to load ' + smURL + (!_s._overHTTP && _s.altURL?' (alternate URL)':''), 1); + + return true; + }; + + _idCheck = this.getSoundById; + + _initMovie = function() { + if (_html5Only) { + _createMovie(); + return false; + } + // attempt to get, or create, movie + if (_s.o) { + return false; // may already exist + } + _s.o = _s.getMovie(_s.id); // inline markup + if (!_s.o) { + if (!_oRemoved) { + // try to create + _createMovie(_s.id, _s.url); + } else { + // try to re-append removed movie after reboot() + if (!_isIE) { + _s.oMC.appendChild(_oRemoved); + } else { + _s.oMC.innerHTML = _oRemovedHTML; + } + _oRemoved = null; + _didAppend = true; + } + _s.o = _s.getMovie(_s.id); + } + if (_s.o) { + //_s._wD('soundManager::initMovie(): Got '+_s.o.nodeName+' element ('+(_didAppend?'created via JS':'static HTML')+')'); + //_wDS('waitEI'); + } + if (_s.oninitmovie instanceof Function) { + setTimeout(_s.oninitmovie, 1); + } + return true; + }; + + _go = function(sURL) { + // where it all begins. + if (sURL) { + _s.url = sURL; + } + _initMovie(); + }; + + _delayWaitForEI = function() { + setTimeout(_waitForEI, 500); + }; + + _waitForEI = function() { + if (_waitingForEI) { + return false; + } + _waitingForEI = true; + _event.remove(_win, 'load', _delayWaitForEI); + if (_tryInitOnFocus && !_isFocused) { + //_wDS('waitFocus'); + return false; + } + var p; + if (!_didInit) { + p = _s.getMoviePercent(); + //_s._wD(_str('waitImpatient', (p === 100?' (SWF loaded)':(p > 0?' (SWF ' + p + '% loaded)':'')))); + } + setTimeout(function() { + p = _s.getMoviePercent(); + if (!_didInit) { + //_s._wD(_sm + ': No Flash response within expected time.\nLikely causes: ' + (p === 0?'Loading ' + _s.movieURL + ' may have failed (and/or Flash ' + _fV + '+ not present?), ':'') + 'Flash blocked or JS-Flash security error.' + (_s.debugFlash?' ' + _str('checkSWF'):''), 2); + if (!_s._overHTTP && p) { + //_wDS('localFail', 2); + if (!_s.debugFlash) { + //_wDS('tryDebug', 2); + } + } + if (p === 0) { + // if 0 (not null), probably a 404. + //_s._wD(_str('swf404', _s.url)); + } + //_debugTS('flashtojs', false, ': Timed out' + _s._overHTTP?' (Check flash security or flash blockers)':' (No plugin/missing SWF?)'); + } + // give up / time-out, depending + if (!_didInit && _okToDisable) { + if (p === null) { + // SWF failed. Maybe blocked. + if (_s.useFlashBlock || _s.flashLoadTimeout === 0) { + if (_s.useFlashBlock) { + _flashBlockHandler(); + } + //_wDS('waitForever'); + } else { + // old SM2 behaviour, simply fail + _failSafely(true); + } + } else { + // flash loaded? Shouldn't be a blocking issue, then. + if (_s.flashLoadTimeout === 0) { + //_wDS('waitForever'); + } else { + _failSafely(true); + } + } + } + }, _s.flashLoadTimeout); + }; + + _go = function(sURL) { + // where it all begins. + if (sURL) { + _s.url = sURL; + } + _initMovie(); + }; + + /* + _wDS = function(o, errorLevel) { + if (!o) { + return ''; + } else { + return //_s._wD(_str(o), errorLevel); + } + }; + + if (_wl.indexOf('debug=alert') + 1 && _s.debugMode) { + _s._wD = function(sText) {alert(sText);}; + } + + _toggleDebug = function() { + var o = _id(_s.debugID), + oT = _id(_s.debugID + '-toggle'); + if (!o) { + return false; + } + if (_debugOpen) { + // minimize + oT.innerHTML = '+'; + o.style.display = 'none'; + } else { + oT.innerHTML = '-'; + o.style.display = 'block'; + } + _debugOpen = !_debugOpen; + }; + + _debugTS = function(sEventType, bSuccess, sMessage) { + // troubleshooter debug hooks + if (typeof sm2Debugger !== 'undefined') { + try { + sm2Debugger.handleEvent(sEventType, bSuccess, sMessage); + } catch(e) { + // oh well + } + } + return true; + }; + */ + + _getSWFCSS = function() { + var css = []; + if (_s.debugMode) { + css.push(_s.swfCSS.sm2Debug); + } + if (_s.debugFlash) { + css.push(_s.swfCSS.flashDebug); + } + if (_s.useHighPerformance) { + css.push(_s.swfCSS.highPerf); + } + return css.join(' '); + }; + + _flashBlockHandler = function() { + // *possible* flash block situation. + var name = _str('fbHandler'), p = _s.getMoviePercent(); + if (!_s.ok()) { + if (_needsFlash) { + // make the movie more visible, so user can fix + _s.oMC.className = _getSWFCSS() + ' ' + _s.swfCSS.swfDefault + ' ' + (p === null?_s.swfCSS.swfTimedout:_s.swfCSS.swfError); + //_s._wD(name+': '+_str('fbTimeout')+(p?' ('+_str('fbLoaded')+')':'')); + } + _s.didFlashBlock = true; + _processOnEvents({type:'ontimeout',ignoreInit:true}); // fire onready(), complain lightly + if (_s.onerror instanceof Function) { + _s.onerror.apply(_win); + } + } else { + // SM2 loaded OK (or recovered) + if (_s.didFlashBlock) { + //_s._wD(name+': Unblocked'); + } + if (_s.oMC) { + _s.oMC.className = _getSWFCSS() + ' ' + _s.swfCSS.swfDefault + (' '+_s.swfCSS.swfUnblocked); + } + } + }; + + _handleFocus = function() { + function cleanup() { + _event.remove(_win, 'focus', _handleFocus); + _event.remove(_win, 'load', _handleFocus); + } + if (_isFocused || !_tryInitOnFocus) { + cleanup(); + return true; + } + _okToDisable = true; + _isFocused = true; + //_s._wD('soundManager::handleFocus()'); + if (_isSafari && _tryInitOnFocus) { + // giant Safari 3.1 hack - assume mousemove = focus given lack of focus event + _event.remove(_win, 'mousemove', _handleFocus); + } + // allow init to restart + _waitingForEI = false; + cleanup(); + return true; + }; + + _initComplete = function(bNoDisable) { + if (_didInit) { + return false; + } + if (_html5Only) { + // all good. + //_s._wD('-- SoundManager 2: loaded --'); + _didInit = true; + _processOnEvents(); + _initUserOnload(); + return true; + } + var sClass = _s.oMC.className, + wasTimeout = (_s.useFlashBlock && _s.flashLoadTimeout && !_s.getMoviePercent()); + if (!wasTimeout) { + _didInit = true; + } + //_s._wD('-- SoundManager 2 ' + (_disabled?'failed to load':'loaded') + ' (' + (_disabled?'security/load error':'OK') + ') --', 1); + if (_disabled || bNoDisable) { + if (_s.useFlashBlock) { + _s.oMC.className = _getSWFCSS() + ' ' + (_s.getMoviePercent() === null?_s.swfCSS.swfTimedout:_s.swfCSS.swfError); + } + _processOnEvents({type:'ontimeout'}); + //_debugTS('onload', false); + if (_s.onerror instanceof Function) { + _s.onerror.apply(_win); + } + return false; + } else { + //_debugTS('onload', true); + } + _event.add(window, 'unload', _doNothing); // prevent browser from showing cached state via back button, because flash will be dead + if (_s.waitForWindowLoad && !_windowLoaded) { + //_wDS('waitOnload'); + _event.add(_win, 'load', _initUserOnload); + return false; + } else { + if (_s.waitForWindowLoad && _windowLoaded) { + //_wDS('docLoaded'); + } + _initUserOnload(); + } + return true; + }; + + _addOnEvent = function(sType, oMethod, oScope) { + if (typeof _on_queue[sType] === 'undefined') { + _on_queue[sType] = []; + } + _on_queue[sType].push({ + 'method': oMethod, + 'scope': (oScope || null), + 'fired': false + }); + }; + + _processOnEvents = function(oOptions) { + if (!oOptions) { // assume onready, if unspecified + oOptions = { + type: 'onready' + }; + } + if (!_didInit && oOptions && !oOptions.ignoreInit) { + // not ready yet. + return false; + } + var status = { + success: (oOptions && oOptions.ignoreInit?_s.ok():!_disabled) + }, + srcQueue = (oOptions && oOptions.type?_on_queue[oOptions.type]||[]:[]), // queue specified by type, or none + queue = [], i, j, + canRetry = (_needsFlash && _s.useFlashBlock && !_s.ok()); + for (i = 0; i < srcQueue.length; i++) { + if (srcQueue[i].fired !== true) { + queue.push(srcQueue[i]); + } + } + if (queue.length) { + //_s._wD(_sm + ': Firing ' + queue.length + ' '+oOptions.type+'() item' + (queue.length === 1?'':'s')); + for (i = 0, j = queue.length; i < j; i++) { + if (queue[i].scope) { + queue[i].method.apply(queue[i].scope, [status]); + } else { + queue[i].method(status); + } + if (!canRetry) { // flashblock case doesn't count here + queue[i].fired = true; + } + } + } + return true; + }; + + _initUserOnload = function() { + _win.setTimeout(function() { + if (_s.useFlashBlock) { + _flashBlockHandler(); + } + _processOnEvents(); + // call user-defined "onload", scoped to window + if (_s.onload instanceof Function) { + //_wDS('onload', 1); + _s.onload.apply(_win); + //_wDS('onloadOK', 1); + } + if (_s.waitForWindowLoad) { + _event.add(_win, 'load', _initUserOnload); + } + },1); + }; + + _featureCheck = function() { + var needsFlash, item, + isBadSafari = (!_wl.match(/usehtml5audio/i) && !_wl.match(/sm2\-ignorebadua/i) && _isSafari && _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 + isSpecial = (_ua.match(/iphone os (1|2|3_0|3_1)/i)?true:false); // iPhone <= 3.1 has broken HTML5 audio(), but firmware 3.2 (iPad) + iOS4 works. + if (isSpecial) { + _s.hasHTML5 = false; // has Audio(), but is broken; let it load links directly. + _html5Only = true; // ignore flash case, however + if (_s.oMC) { + _s.oMC.style.display = 'none'; + } + return false; + } + if (_s.useHTML5Audio) { + if (!_s.html5 || !_s.html5.canPlayType) { + //_s._wD('SoundManager: No HTML5 Audio() support detected.'); + _s.hasHTML5 = false; + return true; + } else { + _s.hasHTML5 = true; + } + if (isBadSafari) { + //_s._wD('SoundManager::Note: Buggy HTML5 Audio in Safari on OS X 10.6.[3|4|5], see https://bugs.webkit.org/show_bug.cgi?id=32159 - disabling HTML5 audio',1); + _s.useHTML5Audio = false; + _s.hasHTML5 = false; + return true; + } + } else { + // flash required. + return true; + } + for (item in _s.audioFormats) { + if (_s.audioFormats.hasOwnProperty(item) && _s.audioFormats[item].required && !_s.html5.canPlayType(_s.audioFormats[item].type)) { + // may need flash for this format? + needsFlash = true; + } + } + // sanity check.. + if (_s.ignoreFlash) { + needsFlash = false; + } + _html5Only = (_s.useHTML5Audio && _s.hasHTML5 && !needsFlash); + return needsFlash; + }; + + _init = function() { + var item, tests = []; + //_wDS('init'); + + // called after onload() + if (_didInit) { + //_wDS('didInit'); + return false; + } + + function _cleanup() { + _event.remove(_win, 'load', _s.beginDelayedInit); + } + + if (_s.hasHTML5) { + for (item in _s.audioFormats) { + if (_s.audioFormats.hasOwnProperty(item)) { + tests.push(item+': '+_s.html5[item]); + } + } + //_s._wD('-- SoundManager 2: HTML5 support tests ('+_s.html5Test+'): '+tests.join(', ')+' --',1); + } + + if (_html5Only) { + if (!_didInit) { + // we don't need no steenking flash! + _cleanup(); + _s.enabled = true; + _initComplete(); + } + return true; + } + + // flash path + _initMovie(); + try { + //_wDS('flashJS'); + _s.o._externalInterfaceTest(false); // attempt to talk to Flash + if (!_s.allowPolling) { + //_wDS('noPolling', 1); + } else { + _setPolling(true, _s.flashPollingInterval ? _s.flashPollingInterval : (_s.useFastPolling ? 10 : 50)); + } + if (!_s.debugMode) { + _s.o._disableDebug(); + } + _s.enabled = true; + //_debugTS('jstoflash', true); + } catch(e) { + //_s._wD('js/flash exception: ' + e.toString()); + //_debugTS('jstoflash', false); + _failSafely(true); // don't disable, for reboot() + _initComplete(); + return false; + } + _initComplete(); + // event cleanup + _cleanup(); + return true; + }; + + _beginInit = function() { + if (_initPending) { + return false; + } + _createMovie(); + _initMovie(); + _initPending = true; + return true; + }; + + _dcLoaded = function() { + if (_didDCLoaded) { + return false; + } + _didDCLoaded = true; + _initDebug(); + _testHTML5(); + _s.html5.usingFlash = _featureCheck(); + _needsFlash = _s.html5.usingFlash; + _didDCLoaded = true; + if (_doc.removeEventListener) { + _doc.removeEventListener('DOMContentLoaded', _dcLoaded, false); + } + _go(); + return true; + }; + + _startTimer = function(oSound) { + if (!oSound._hasTimer) { + oSound._hasTimer = true; + } + }; + + _stopTimer = function(oSound) { + if (oSound._hasTimer) { + oSound._hasTimer = false; + } + }; + + _die = function() { + if (_s.onerror instanceof Function) { + _s.onerror(); + } + _s.disable(); + }; + + // pseudo-private methods called by Flash + + this._setSandboxType = function(sandboxType) { + /* + var sb = _s.sandbox; + sb.type = sandboxType; + sb.description = sb.types[(typeof sb.types[sandboxType] !== 'undefined'?sandboxType:'unknown')]; + //_s._wD('Flash security sandbox type: ' + sb.type); + if (sb.type === 'localWithFile') { + sb.noRemote = true; + sb.noLocal = false; + //_wDS('secNote', 2); + } else if (sb.type === 'localWithNetwork') { + sb.noRemote = false; + sb.noLocal = true; + } else if (sb.type === 'localTrusted') { + sb.noRemote = false; + sb.noLocal = false; + } + */ + }; + + this._externalInterfaceOK = function(flashDate) { + // flash callback confirming flash loaded, EI working etc. + // flashDate = approx. timing/delay info for JS/flash bridge + if (_s.swfLoaded) { + return false; + } + var eiTime = new Date().getTime(); + //_s._wD('soundManager::externalInterfaceOK()' + (flashDate?' (~' + (eiTime - flashDate) + ' ms)':'')); + //_debugTS('swf', true); + //_debugTS('flashtojs', true); + _s.swfLoaded = true; + _tryInitOnFocus = false; + if (_isIE) { + // IE needs a timeout OR delay until window.onload - may need TODO: investigating + setTimeout(_init, 100); + } else { + _init(); + } + }; + + _dcIE = function() { + if (_doc.readyState === 'complete') { + _dcLoaded(); + _doc.detachEvent('onreadystatechange', _dcIE); + } + return true; + }; + + // focus and window load, init + if (!_s.hasHTML5 || _needsFlash) { + // only applies to Flash mode + _event.add(_win, 'focus', _handleFocus); + _event.add(_win, 'load', _handleFocus); + _event.add(_win, 'load', _delayWaitForEI); + if (_isSafari && _tryInitOnFocus) { + _event.add(_win, 'mousemove', _handleFocus); // massive Safari focus hack + } + } + + if (_doc.addEventListener) { + _doc.addEventListener('DOMContentLoaded', _dcLoaded, false); + } else if (_doc.attachEvent) { + _doc.attachEvent('onreadystatechange', _dcIE); + } else { + // no add/attachevent support - safe to assume no JS -> Flash either + //_debugTS('onload', false); + _die(); + } + + if (_doc.readyState === 'complete') { + setTimeout(_dcLoaded,100); + } + +} // SoundManager() + +// SM2_DEFER details: http://www.schillmania.com/projects/soundmanager2/doc/getstarted/#lazy-loading +if (typeof SM2_DEFER === 'undefined' || !SM2_DEFER) { + soundManager = new SoundManager(); +} + +// public interfaces +window.SoundManager = SoundManager; // constructor +window.soundManager = soundManager; // public API, flash callbacks etc + +}(window)); diff --git a/js/libs/soundmanager/script/soundmanager2.js b/js/libs/soundmanager/script/soundmanager2.js new file mode 100644 index 0000000..b4c6ef1 --- /dev/null +++ b/js/libs/soundmanager/script/soundmanager2.js @@ -0,0 +1,2862 @@ +/** @license + * SoundManager 2: Javascript Sound for the Web + * -------------------------------------------- + * http://schillmania.com/projects/soundmanager2/ + * + * Copyright (c) 2007, Scott Schiller. All rights reserved. + * Code provided under the BSD License: + * http://schillmania.com/projects/soundmanager2/license.txt + * + * V2.97a.20110101 + */ + +/*jslint white: false, onevar: true, undef: true, nomen: false, eqeqeq: true, plusplus: false, bitwise: true, regexp: false, newcap: true, immed: true */ +/*global window, SM2_DEFER, sm2Debugger, alert, console, document, navigator, setTimeout, setInterval, clearInterval, Audio */ + +(function(window) { + +var soundManager = null; + +function SoundManager(smURL, smID) { + + this.flashVersion = 8; // version of flash to require, either 8 or 9. Some API features require Flash 9. + this.debugMode = true; // enable debugging output (div#soundmanager-debug, OR console if available+configured) + this.debugFlash = false; // enable debugging output inside SWF, troubleshoot Flash/browser issues + this.useConsole = true; // use firebug/safari console.log()-type debug console if available + this.consoleOnly = false; // if console is being used, do not create/write to #soundmanager-debug + this.waitForWindowLoad = false; // force SM2 to wait for window.onload() before trying to call soundManager.onload() + this.nullURL = 'about:blank'; // path to "null" (empty) MP3 file, used to unload sounds (Flash 8 only) + this.allowPolling = true; // allow flash to poll for status update (required for whileplaying() events, peak, sound spectrum functions to work.) + this.useFastPolling = false; // uses lower flash timer interval for higher callback frequency, best combined with useHighPerformance + this.useMovieStar = true; // enable support for Flash 9.0r115+ (codename "MovieStar") MPEG4 audio formats (AAC, M4V, FLV, MOV etc.) + this.bgColor = '#ffffff'; // movie (.swf) background color, eg. '#000000' + this.useHighPerformance = false; // position:fixed flash movie can help increase js/flash speed, minimize lag + this.flashPollingInterval = null; // msec for polling interval. Defaults to 50 unless useFastPolling = true. + this.flashLoadTimeout = 1000; // msec to wait for flash movie to load before failing (0 = infinity) + this.wmode = null; // string: flash rendering mode - null, transparent, opaque (last two allow layering of HTML on top) + this.allowScriptAccess = 'always'; // for scripting the SWF (object/embed property), either 'always' or 'sameDomain' + this.useFlashBlock = false; // *requires flashblock.css, see demos* - allow recovery from flash blockers. Wait indefinitely and apply timeout CSS to SWF, if applicable. + this.useHTML5Audio = false; // Beta feature: Use HTML5 Audio() where API is supported (most Safari, Chrome versions), Firefox (no MP3/MP4.) Ideally, transparent vs. Flash API where possible. + this.html5Test = /^probably$/i; // HTML5 Audio().canPlayType() test. /^(probably|maybe)$/i if you want to be more liberal/risky. + this.ondebuglog = false; // callback made with each log message, regardless of debugMode + + this.audioFormats = { + // determines HTML5 support, flash requirements + // eg. if MP3 or MP4 required, Flash fallback is used if HTML5 can't play it + // shotgun approach to MIME testing due to browser variance + 'mp3': { + 'type': ['audio/mpeg; codecs="mp3"','audio/mpeg','audio/mp3','audio/MPA','audio/mpa-robust'], + 'required': true + }, + 'mp4': { + 'related': ['aac','m4a'], // additional formats under the MP4 container + 'type': ['audio/mp4; codecs="mp4a.40.2"','audio/aac','audio/x-m4a','audio/MP4A-LATM','audio/mpeg4-generic'], + 'required': true + }, + 'ogg': { + 'type': ['audio/ogg; codecs=vorbis'], + 'required': false + }, + 'wav': { + 'type': ['audio/wav; codecs="1"','audio/wav','audio/wave','audio/x-wav'], + 'required': false + } + }; + + this.defaultOptions = { + 'autoLoad': false, // enable automatic loading (otherwise .load() will be called on demand with .play(), the latter being nicer on bandwidth - if you want to .load yourself, you also can) + 'stream': true, // allows playing before entire file has loaded (recommended) + 'autoPlay': false, // enable playing of file as soon as possible (much faster if "stream" is true) + 'loops': 1, // how many times to repeat the sound (position will wrap around to 0, setPosition() will break out of loop when >0) + 'onid3': null, // callback function for "ID3 data is added/available" + 'onload': null, // callback function for "load finished" + 'whileloading': null, // callback function for "download progress update" (X of Y bytes received) + 'onplay': null, // callback for "play" start + 'onpause': null, // callback for "pause" + 'onresume': null, // callback for "resume" (pause toggle) + 'whileplaying': null, // callback during play (position update) + 'onstop': null, // callback for "user stop" + 'onfailure': null, // callback function for when playing fails + 'onfinish': null, // callback function for "sound finished playing" + 'onbeforefinish': null, // callback for "before sound finished playing (at [time])" + 'onbeforefinishtime': 5000, // offset (milliseconds) before end of sound to trigger beforefinish (eg. 1000 msec = 1 second) + 'onbeforefinishcomplete': null,// function to call when said sound finishes playing + 'onjustbeforefinish': null, // callback for [n] msec before end of current sound + 'onjustbeforefinishtime': 200, // [n] - if not using, set to 0 (or null handler) and event will not fire. + 'multiShot': true, // let sounds "restart" or layer on top of each other when played multiple times, rather than one-shot/one at a time + 'multiShotEvents': false, // fire multiple sound events (currently onfinish() only) when multiShot is enabled + 'position': null, // offset (milliseconds) to seek to within loaded sound data. + 'pan': 0, // "pan" settings, left-to-right, -100 to 100 + 'type': null, // MIME-like hint for file pattern / canPlay() tests, eg. audio/mp3 + 'usePolicyFile': true, // enable crossdomain.xml request for audio on remote domains (for ID3/waveform access) + 'volume': 100 // self-explanatory. 0-100, the latter being the max. + }; + + this.flash9Options = { // flash 9-only options, merged into defaultOptions if flash 9 is being used + 'isMovieStar': null, // "MovieStar" MPEG4 audio mode. Null (default) = auto detect MP4, AAC etc. based on URL. true = force on, ignore URL + 'usePeakData': false, // enable left/right channel peak (level) data + 'useWaveformData': false, // enable sound spectrum (raw waveform data) - WARNING: CPU-INTENSIVE: may set CPUs on fire. + 'useEQData': false, // enable sound EQ (frequency spectrum data) - WARNING: Also CPU-intensive. + 'onbufferchange': null, // callback for "isBuffering" property change + 'ondataerror': null, // callback for waveform/eq data access error (flash playing audio in other tabs/domains) + 'onstats': null // callback for when connection & play times have been measured + }; + + this.movieStarOptions = { // flash 9.0r115+ MPEG4 audio options, merged into defaultOptions if flash 9+movieStar mode is enabled + 'bufferTime': 3, // seconds of data to buffer before playback begins (null = flash default of 0.1 seconds - if AAC playback is gappy, try increasing.) + 'serverURL': null, // rtmp: FMS or FMIS server to connect to, required when requesting media via RTMP or one of its variants + 'onconnect': null, // rtmp: callback for connection to flash media server + 'bufferTimes': null, // array of buffer sizes to use. Size increases as buffer fills up. + 'duration': null // rtmp: song duration (msec) + }; + + this.version = null; + this.versionNumber = 'V2.97a.20110101'; + this.movieURL = null; + this.url = (smURL || null); + this.altURL = null; + this.swfLoaded = false; + this.enabled = false; + this.o = null; + this.movieID = 'sm2-container'; + this.id = (smID || 'sm2movie'); + this.swfCSS = { + 'swfBox': 'sm2-object-box', + 'swfDefault': 'movieContainer', + 'swfError': 'swf_error', // SWF loaded, but SM2 couldn't start (other error) + 'swfTimedout': 'swf_timedout', + 'swfUnblocked': 'swf_unblocked', // or loaded OK + 'sm2Debug': 'sm2_debug', + 'highPerf': 'high_performance', + 'flashDebug': 'flash_debug' + }; + this.oMC = null; + this.sounds = {}; + this.soundIDs = []; + this.muted = false; + this.debugID = 'soundmanager-debug'; + this.debugURLParam = /([#?&])debug=1/i; + this.specialWmodeCase = false; + this.didFlashBlock = false; + + this.filePattern = null; + this.filePatterns = { + 'flash8': /\.mp3(\?.*)?$/i, + 'flash9': /\.mp3(\?.*)?$/i + }; + + this.baseMimeTypes = /^\s*audio\/(?:x-)?(?:mp(?:eg|3))\s*(?:$|;)/i; // mp3 + this.netStreamMimeTypes = /^\s*audio\/(?:x-)?(?:mp(?:eg|3))\s*(?:$|;)/i; // mp3, mp4, aac etc. + this.netStreamTypes = ['aac', 'flv', 'mov', 'mp4', 'm4v', 'f4v', 'm4a', 'mp4v', '3gp', '3g2']; // Flash v9.0r115+ "moviestar" formats + this.netStreamPattern = new RegExp('\\.(' + this.netStreamTypes.join('|') + ')(\\?.*)?$', 'i'); + this.mimePattern = this.baseMimeTypes; + + this.features = { + 'buffering': false, + 'peakData': false, + 'waveformData': false, + 'eqData': false, + 'movieStar': false + }; + + this.sandbox = { + // + 'type': null, + 'types': { + 'remote': 'remote (domain-based) rules', + 'localWithFile': 'local with file access (no internet access)', + 'localWithNetwork': 'local with network (internet access only, no local access)', + 'localTrusted': 'local, trusted (local+internet access)' + }, + 'description': null, + 'noRemote': null, + 'noLocal': null + // + }; + + this.hasHTML5 = null; // switch for handling logic + this.html5 = { // stores canPlayType() results, etc. treat as read-only. + // mp3: boolean + // mp4: boolean + 'usingFlash': null // set if/when flash fallback is needed + }; + this.ignoreFlash = false; // used for special cases (eg. iPad/iPhone/palm OS?) + + // --- private SM2 internals --- + + var SMSound, + _s = this, _sm = 'soundManager', _id, _ua = navigator.userAgent, _wl = window.location.href.toString(), _fV = this.flashVersion, _doc = document, _win = window, _doNothing, _init, _on_queue = [], _debugOpen = true, _debugTS, _didAppend = false, _appendSuccess = false, _didInit = false, _disabled = false, _windowLoaded = false, _wDS, _wdCount = 0, _initComplete, _mixin, _addOnEvent, _processOnEvents, _initUserOnload, _go, _delayWaitForEI, _waitForEI, _setVersionInfo, _handleFocus, _beginInit, _strings, _initMovie, _dcLoaded, _didDCLoaded, _getDocument, _createMovie, _die, _setPolling, _debugLevels = ['log', 'info', 'warn', 'error'], _defaultFlashVersion = 8, _disableObject, _failSafely, _normalizeMovieURL, _oRemoved = null, _oRemovedHTML = null, _str, _flashBlockHandler, _getSWFCSS, _toggleDebug, _loopFix, _policyFix, _complain, _idCheck, _waitingForEI = false, _initPending = false, _smTimer, _onTimer, _startTimer, _stopTimer, _needsFlash = null, _featureCheck, _html5OK, _html5Only = false, _html5CanPlay, _html5Ext, _dcIE, _testHTML5, _event, _slice = Array.prototype.slice, + _is_pre = _ua.match(/pre\//i), _is_iDevice = _ua.match(/(ipad|iphone|ipod)/i), _isMobile = (_ua.match(/mobile/i) || _is_pre || _is_iDevice), _isIE = _ua.match(/MSIE/i), _isWebkit = _ua.match(/webkit/i), _isSafari = (_ua.match(/safari/i) && !_ua.match(/chrome/i)), _hasConsole = (typeof console !== 'undefined' && typeof console.log !== 'undefined'), _isFocused = (typeof _doc.hasFocus !== 'undefined'?_doc.hasFocus():null), _tryInitOnFocus = (typeof _doc.hasFocus === 'undefined' && _isSafari), _okToDisable = !_tryInitOnFocus; + + this._use_maybe = (_wl.match(/sm2\-useHTML5Maybe\=1/i)); // temporary feature: #sm2-useHTML5Maybe=1 forces loose canPlay() check + this._overHTTP = (_doc.location?_doc.location.protocol.match(/http/i):null); + this.useAltURL = !this._overHTTP; // use altURL if not "online" + + if (_is_iDevice || _is_pre) { + // during HTML5 beta period (off by default), may as well force it on Apple + Palm, flash support unlikely + _s.useHTML5Audio = true; + _s.ignoreFlash = true; + } + + if (_is_pre || this._use_maybe) { + // less-strict canPlayType() checking option + _s.html5Test = /^(probably|maybe)$/i; + } + + // Temporary feature: allow force of HTML5 via URL: #sm2-usehtml5audio=0 or 1 + // + (function(){ + var a = '#sm2-usehtml5audio=', l = _wl, b = null; + if (l.indexOf(a) !== -1) { + b = (l.substr(l.indexOf(a)+a.length) === '1'); + if (typeof console !== 'undefined' && typeof console.log !== 'undefined') { + console.log((b?'Enabling ':'Disabling ')+'useHTML5Audio via URL parameter'); + } + _s.useHTML5Audio = b; + } + }()); + // + + // --- public API methods --- + + this.ok = function() { + return (_needsFlash?(_didInit && !_disabled):(_s.useHTML5Audio && _s.hasHTML5)); + }; + + this.supported = this.ok; // legacy + + this.getMovie = function(smID) { + return _isIE?_win[smID]:(_isSafari?_id(smID) || _doc[smID]:_id(smID)); + }; + + this.createSound = function(oOptions) { + var _cs = 'soundManager.createSound(): ', + thisOptions = null, oSound = null, _tO = null; + if (!_didInit || !_s.ok()) { + _complain(_cs + _str(!_didInit?'notReady':'notOK')); + return false; + } + if (arguments.length === 2) { + // function overloading in JS! :) ..assume simple createSound(id,url) use case + oOptions = { + 'id': arguments[0], + 'url': arguments[1] + }; + } + thisOptions = _mixin(oOptions); // inherit from defaultOptions + _tO = thisOptions; // alias + // + if (_tO.id.toString().charAt(0).match(/^[0-9]$/)) { + _s._wD(_cs + _str('badID', _tO.id), 2); + } + _s._wD(_cs + _tO.id + ' (' + _tO.url + ')', 1); + // + if (_idCheck(_tO.id, true)) { + _s._wD(_cs + _tO.id + ' exists', 1); + return _s.sounds[_tO.id]; + } + + function make() { + thisOptions = _loopFix(thisOptions); + _s.sounds[_tO.id] = new SMSound(_tO); + _s.soundIDs.push(_tO.id); + return _s.sounds[_tO.id]; + } + + if (_html5OK(_tO)) { + oSound = make(); + _s._wD('Loading sound '+_tO.id+' via HTML5'); + oSound._setup_html5(_tO); + } else { + if (_fV > 8 && _s.useMovieStar) { + if (_tO.isMovieStar === null) { + _tO.isMovieStar = ((_tO.serverURL || (_tO.type?_tO.type.match(_s.netStreamPattern):false)||_tO.url.match(_s.netStreamPattern))?true:false); + } + if (_tO.isMovieStar) { + _s._wD(_cs + 'using MovieStar handling'); + } + if (_tO.isMovieStar) { + if (_tO.usePeakData) { + _wDS('noPeak'); + _tO.usePeakData = false; + } + if (_tO.loops > 1) { + _wDS('noNSLoop'); + } + } + } + _tO = _policyFix(_tO, _cs); + oSound = make(); + if (_fV === 8) { + _s.o._createSound(_tO.id, _tO.onjustbeforefinishtime, _tO.loops||1, _tO.usePolicyFile); + } else { + _s.o._createSound(_tO.id, _tO.url, _tO.onjustbeforefinishtime, _tO.usePeakData, _tO.useWaveformData, _tO.useEQData, _tO.isMovieStar, (_tO.isMovieStar?_tO.bufferTime:false), _tO.loops||1, _tO.serverURL, _tO.duration||null, _tO.autoPlay, true, _tO.bufferTimes, _tO.onstats ? true : false, _tO.autoLoad, _tO.usePolicyFile); + if (!_tO.serverURL) { + // We are connected immediately + oSound.connected = true; + if (_tO.onconnect) { + _tO.onconnect.apply(oSound); + } + } + } + } + if (_tO.autoLoad || _tO.autoPlay) { + if (oSound) { + if (_s.isHTML5) { + oSound.autobuffer = 'auto'; // early HTML5 implementation (non-standard) + oSound.preload = 'auto'; // standard + } else { + oSound.load(_tO); + } + } + } + if (_tO.autoPlay) { + oSound.play(); + } + return oSound; + }; + + this.destroySound = function(sID, _bFromSound) { + // explicitly destroy a sound before normal page unload, etc. + if (!_idCheck(sID)) { + return false; + } + var oS = _s.sounds[sID], i; + oS._iO = {}; // Disable all callbacks while the sound is being destroyed + oS.stop(); + oS.unload(); + for (i = 0; i < _s.soundIDs.length; i++) { + if (_s.soundIDs[i] === sID) { + _s.soundIDs.splice(i, 1); + break; + } + } + if (!_bFromSound) { + // ignore if being called from SMSound instance + oS.destruct(true); + } + oS = null; + delete _s.sounds[sID]; + return true; + }; + + this.load = function(sID, oOptions) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].load(oOptions); + }; + + this.unload = function(sID) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].unload(); + }; + + this.play = function(sID, oOptions) { + var fN = 'soundManager.play(): '; + if (!_didInit || !_s.ok()) { + _complain(fN + _str(!_didInit?'notReady':'notOK')); + return false; + } + if (!_idCheck(sID)) { + if (!(oOptions instanceof Object)) { + oOptions = { + url: oOptions + }; // overloading use case: play('mySound','/path/to/some.mp3'); + } + if (oOptions && oOptions.url) { + // overloading use case, create+play: .play('someID',{url:'/path/to.mp3'}); + _s._wD(fN + 'attempting to create "' + sID + '"', 1); + oOptions.id = sID; + return _s.createSound(oOptions).play(); + } else { + return false; + } + } + return _s.sounds[sID].play(oOptions); + }; + + this.start = this.play; // just for convenience + + this.setPosition = function(sID, nMsecOffset) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].setPosition(nMsecOffset); + }; + + this.stop = function(sID) { + if (!_idCheck(sID)) { + return false; + } + _s._wD('soundManager.stop(' + sID + ')', 1); + return _s.sounds[sID].stop(); + }; + + this.stopAll = function() { + _s._wD('soundManager.stopAll()', 1); + for (var oSound in _s.sounds) { + if (_s.sounds[oSound] instanceof SMSound) { + _s.sounds[oSound].stop(); // apply only to sound objects + } + } + }; + + this.pause = function(sID) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].pause(); + }; + + this.pauseAll = function() { + for (var i = _s.soundIDs.length; i--;) { + _s.sounds[_s.soundIDs[i]].pause(); + } + }; + + this.resume = function(sID) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].resume(); + }; + + this.resumeAll = function() { + for (var i = _s.soundIDs.length; i--;) { + _s.sounds[_s.soundIDs[i]].resume(); + } + }; + + this.togglePause = function(sID) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].togglePause(); + }; + + this.setPan = function(sID, nPan) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].setPan(nPan); + }; + + this.setVolume = function(sID, nVol) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].setVolume(nVol); + }; + + this.mute = function(sID) { + var fN = 'soundManager.mute(): ', + i = 0; + if (typeof sID !== 'string') { + sID = null; + } + if (!sID) { + _s._wD(fN + 'Muting all sounds'); + for (i = _s.soundIDs.length; i--;) { + _s.sounds[_s.soundIDs[i]].mute(); + } + _s.muted = true; + } else { + if (!_idCheck(sID)) { + return false; + } + _s._wD(fN + 'Muting "' + sID + '"'); + return _s.sounds[sID].mute(); + } + return true; + }; + + this.muteAll = function() { + _s.mute(); + }; + + this.unmute = function(sID) { + var fN = 'soundManager.unmute(): ', i; + if (typeof sID !== 'string') { + sID = null; + } + if (!sID) { + _s._wD(fN + 'Unmuting all sounds'); + for (i = _s.soundIDs.length; i--;) { + _s.sounds[_s.soundIDs[i]].unmute(); + } + _s.muted = false; + } else { + if (!_idCheck(sID)) { + return false; + } + _s._wD(fN + 'Unmuting "' + sID + '"'); + return _s.sounds[sID].unmute(); + } + return true; + }; + + this.unmuteAll = function() { + _s.unmute(); + }; + + this.toggleMute = function(sID) { + if (!_idCheck(sID)) { + return false; + } + return _s.sounds[sID].toggleMute(); + }; + + this.getMemoryUse = function() { + if (_fV === 8) { + return 0; + } + if (_s.o) { + return parseInt(_s.o._getMemoryUse(), 10); + } + }; + + this.disable = function(bNoDisable) { + // destroy all functions + if (typeof bNoDisable === 'undefined') { + bNoDisable = false; + } + if (_disabled) { + return false; + } + _disabled = true; + _wDS('shutdown', 1); + for (var i = _s.soundIDs.length; i--;) { + _disableObject(_s.sounds[_s.soundIDs[i]]); + } + _initComplete(bNoDisable); // fire "complete", despite fail + _event.remove(_win, 'load', _initUserOnload); + return true; + }; + + this.canPlayMIME = function(sMIME) { + var result; + if (_s.hasHTML5) { + result = _html5CanPlay({type:sMIME}); + } + if (!_needsFlash || result) { + // no flash, or OK + return result; + } else { + return (sMIME?(sMIME.match(_s.mimePattern)?true:false):null); + } + }; + + this.canPlayURL = function(sURL) { + var result; + if (_s.hasHTML5) { + result = _html5CanPlay(sURL); + } + if (!_needsFlash || result) { + // no flash, or OK + return result; + } else { + return (sURL?(sURL.match(_s.filePattern)?true:false):null); + } + }; + + this.canPlayLink = function(oLink) { + if (typeof oLink.type !== 'undefined' && oLink.type) { + if (_s.canPlayMIME(oLink.type)) { + return true; + } + } + return _s.canPlayURL(oLink.href); + }; + + this.getSoundById = function(sID, suppressDebug) { + if (!sID) { + throw new Error('SoundManager.getSoundById(): sID is null/undefined'); + } + var result = _s.sounds[sID]; + if (!result && !suppressDebug) { + _s._wD('"' + sID + '" is an invalid sound ID.', 2); + } + return result; + }; + + this.onready = function(oMethod, oScope) { + var sType = 'onready'; + if (oMethod && oMethod instanceof Function) { + if (_didInit) { + _wDS('queue', sType); + } + if (!oScope) { + oScope = _win; + } + _addOnEvent(sType, oMethod, oScope); + _processOnEvents(); + return true; + } else { + throw _str('needFunction', sType); + } + }; + + this.ontimeout = function(oMethod, oScope) { + var sType = 'ontimeout'; + if (oMethod && oMethod instanceof Function) { + if (_didInit) { + _wDS('queue'); + } + if (!oScope) { + oScope = _win; + } + _addOnEvent(sType, oMethod, oScope); + _processOnEvents({type:sType}); + return true; + } else { + throw _str('needFunction', sType); + } + }; + + this.getMoviePercent = function() { + return (_s.o && typeof _s.o.PercentLoaded !== 'undefined'?_s.o.PercentLoaded():null); + }; + + this._writeDebug = function(sText, sType, bTimestamp) { + // If the debug log callback is set, always call it, regardless of debugMode + if (_s.ondebuglog) { + _s.ondebuglog(sText, sType, bTimestamp); + } + // pseudo-private console.log()-style output + // + var sDID = 'soundmanager-debug', o, oItem, sMethod; + if (!_s.debugMode) { + return false; + } + if (typeof bTimestamp !== 'undefined' && bTimestamp) { + sText = sText + ' | ' + new Date().getTime(); + } + if (_hasConsole && _s.useConsole) { + sMethod = _debugLevels[sType]; + if (typeof console[sMethod] !== 'undefined') { + console[sMethod](sText); + } else { + console.log(sText); + } + if (_s.useConsoleOnly) { + return true; + } + } + try { + o = _id(sDID); + if (!o) { + return false; + } + oItem = _doc.createElement('div'); + if (++_wdCount % 2 === 0) { + oItem.className = 'sm2-alt'; + } + if (typeof sType === 'undefined') { + sType = 0; + } else { + sType = parseInt(sType, 10); + } + oItem.appendChild(_doc.createTextNode(sText)); + if (sType) { + if (sType >= 2) { + oItem.style.fontWeight = 'bold'; + } + if (sType === 3) { + oItem.style.color = '#ff3333'; + } + } + // o.appendChild(oItem); // top-to-bottom + o.insertBefore(oItem, o.firstChild); // bottom-to-top + } catch(e) { + // oh well + } + o = null; + // + return true; + }; + this._wD = this._writeDebug; // alias + + this._debug = function() { + // + _wDS('currentObj', 1); + for (var i = 0, j = _s.soundIDs.length; i < j; i++) { + _s.sounds[_s.soundIDs[i]]._debug(); + } + // + }; + + this.reboot = function() { + // attempt to reset and init SM2 + _s._wD('soundManager.reboot()'); + if (_s.soundIDs.length) { + _s._wD('Destroying ' + _s.soundIDs.length + ' SMSound objects...'); + } + var i, j; + for (i = _s.soundIDs.length; i--;) { + _s.sounds[_s.soundIDs[i]].destruct(); + } + // trash ze flash + try { + if (_isIE) { + _oRemovedHTML = _s.o.innerHTML; + } + _oRemoved = _s.o.parentNode.removeChild(_s.o); + _s._wD('Flash movie removed.'); + } catch(e) { + // uh-oh. + _wDS('badRemove', 2); + } + // actually, force recreate of movie. + _oRemovedHTML = _oRemoved = null; + _s.enabled = _didInit = _waitingForEI = _initPending = _didAppend = _appendSuccess = _disabled = _s.swfLoaded = false; + _s.soundIDs = _s.sounds = []; + _s.o = null; + for (i in _on_queue) { + if (_on_queue.hasOwnProperty(i)) { + for (j = _on_queue[i].length; j--;) { + _on_queue[i][j].fired = false; + } + } + } + _s._wD(_sm + ': Rebooting...'); + _win.setTimeout(function() { + _s.beginDelayedInit(); + }, 20); + }; + + this.destruct = function() { + _s._wD('soundManager.destruct()'); + _s.disable(true); + }; + + this.beginDelayedInit = function() { + // _s._wD('soundManager.beginDelayedInit()'); + _windowLoaded = true; + _dcLoaded(); + setTimeout(_beginInit, 20); + _delayWaitForEI(); + }; + + // --- SMSound (sound object) instance --- + + SMSound = function(oOptions) { + var _t = this, _resetProperties, _add_html5_events, _html5_events, _stop_html5_timer, _start_html5_timer, _get_html5_duration, _a; + this.sID = oOptions.id; + this.url = oOptions.url; + this.options = _mixin(oOptions); + this.instanceOptions = this.options; // per-play-instance-specific options + this._iO = this.instanceOptions; // short alias + // assign property defaults + this.pan = this.options.pan; + this.volume = this.options.volume; + this._lastURL = null; + this.isHTML5 = false; + + // --- public methods --- + + this.id3 = {}; + + this._debug = function() { + // + // pseudo-private console.log()-style output + if (_s.debugMode) { + var stuff = null, msg = [], sF, sfBracket, maxLength = 64; + for (stuff in _t.options) { + if (_t.options[stuff] !== null) { + if (_t.options[stuff] instanceof Function) { + // handle functions specially + sF = _t.options[stuff].toString(); + sF = sF.replace(/\s\s+/g, ' '); // normalize spaces + sfBracket = sF.indexOf('{'); + msg.push(' ' + stuff + ': {' + sF.substr(sfBracket + 1, (Math.min(Math.max(sF.indexOf('\n') - 1, maxLength), maxLength))).replace(/\n/g, '') + '... }'); + } else { + msg.push(' ' + stuff + ': ' + _t.options[stuff]); + } + } + } + _s._wD('SMSound() merged options: {\n' + msg.join(', \n') + '\n}'); + } + // + }; + + this._debug(); + + this.load = function(oOptions) { + var oS = null; + if (typeof oOptions !== 'undefined') { + _t._iO = _mixin(oOptions); + _t.instanceOptions = _t._iO; + } else { + oOptions = _t.options; + _t._iO = oOptions; + _t.instanceOptions = _t._iO; + if (_t._lastURL && _t._lastURL !== _t.url) { + _wDS('manURL'); + _t._iO.url = _t.url; + _t.url = null; + } + } + _s._wD('soundManager.load(): ' + _t._iO.url, 1); + if (_t._iO.url === _t.url && _t.readyState !== 0 && _t.readyState !== 2) { + _wDS('onURL', 1); + return _t; + } + _t._lastURL = _t.url; + _t.loaded = false; + _t.readyState = 1; + _t.playState = 0; + if (_html5OK(_t._iO)) { + _s._wD('HTML5 load: '+_t._iO.url); + oS = _t._setup_html5(_t._iO); + oS.load(); + if (_t._iO.autoPlay) { + _t.play(); + } + } else { + try { + _t.isHTML5 = false; + _t._iO = _policyFix(_loopFix(_t._iO)); + if (_fV === 8) { + _s.o._load(_t.sID, _t._iO.url, _t._iO.stream, _t._iO.autoPlay, (_t._iO.whileloading?1:0), _t._iO.loops||1, _t._iO.usePolicyFile); + } else { + _s.o._load(_t.sID, _t._iO.url, _t._iO.stream?true:false, _t._iO.autoPlay?true:false, _t._iO.loops||1, _t._iO.autoLoad?true:false, _t._iO.usePolicyFile); + } + } catch(e) { + _wDS('smError', 2); + _debugTS('onload', false); + _die(); + } + } + return _t; + }; + + this.unload = function() { + // Flash 8/AS2 can't "close" a stream - fake it by loading an empty MP3 + // Flash 9/AS3: Close stream, preventing further load + if (_t.readyState !== 0) { + _s._wD('SMSound.unload(): "' + _t.sID + '"'); + if (!_t.isHTML5) { + if (_fV === 8) { + _s.o._unload(_t.sID, _s.nullURL); + } else { + _s.o._unload(_t.sID); + } + } else { + _stop_html5_timer(); + if (_a) { + // abort()-style method here, stop loading? (doesn't exist?) + _a.pause(); + _a.src = ''; // https://developer.mozilla.org/En/Using_audio_and_video_in_Firefox#Stopping_the_download_of_media + /* + _t._audio = null; + _a = null; + // delete _t._audio; + */ + } + } + // reset load/status flags + _resetProperties(); + } + return _t; + }; + + this.destruct = function(_bFromSM) { + _s._wD('SMSound.destruct(): "' + _t.sID + '"'); + if (!_t.isHTML5) { + // kill sound within Flash + // Disable the onfailure handler + _t._iO.onfailure = null; + _s.o._destroySound(_t.sID); + } else { + _stop_html5_timer(); + if (_a) { + _a.pause(); + _a.src = 'about:blank'; + _a.load(); + _t._audio = null; + _a = null; + // delete _t._audio; + } + } + if (!_bFromSM) { + _s.destroySound(_t.sID, true); // ensure deletion from controller + } + }; + + this.play = function(oOptions, _updatePlayState) { + var fN = 'SMSound.play(): ', allowMulti; + _updatePlayState = (typeof _updatePlayState === 'undefined' ? true : _updatePlayState); + if (!oOptions) { + oOptions = {}; + } + _t._iO = _mixin(oOptions, _t._iO); + _t._iO = _mixin(_t._iO, _t.options); + _t.instanceOptions = _t._iO; + if (_t._iO.serverURL) { + if (!_t.connected) { + if (!_t.getAutoPlay()) { + _s._wD(fN+' Netstream not connected yet - setting autoPlay'); + _t.setAutoPlay(true); + } + return _t; + } + } + if (_html5OK(_t._iO)) { + _t._setup_html5(_t._iO); + _start_html5_timer(); + } + // KJV paused sounds have playState 1. We want these sounds to play. + if (_t.playState === 1 && !_t.paused) { + allowMulti = _t._iO.multiShot; + if (!allowMulti) { + _s._wD(fN + '"' + _t.sID + '" already playing (one-shot)', 1); + return _t; + } else { + _s._wD(fN + '"' + _t.sID + '" already playing (multi-shot)', 1); + if (_t.isHTML5) { + // TODO: BUG? + _t.setPosition(_t._iO.position); + } + } + } + if (!_t.loaded) { + if (_t.readyState === 0) { + _s._wD(fN + 'Attempting to load "' + _t.sID + '"', 1); + // try to get this sound playing ASAP + if (!_t.isHTML5) { + if (!_t._iO.serverURL) { + _t._iO.autoPlay = true; + _t.load(_t._iO); + } + } else { + _t.load(_t._iO); + _t.readyState = 1; + } + } else if (_t.readyState === 2) { + _s._wD(fN + 'Could not load "' + _t.sID + '" - exiting', 2); + return _t; + } else { + _s._wD(fN + '"' + _t.sID + '" is loading - attempting to play..', 1); + } + } else { + _s._wD(fN + '"' + _t.sID + '"'); + } + // Streams will pause when their buffer is full if they are not auto-playing. + // In this case paused is true, but the song hasn't started playing yet. If + // we just call resume() the onplay() callback will never be called. + + // Also, if we just call resume() in this case and the sound has been muted + // (volume is 0), it will never have its volume set so sound will be heard + // when it shouldn't. + if (_t.paused && _t.position && _t.position > 0) { // https://gist.github.com/37b17df75cc4d7a90bf6 + _s._wD(fN + '"' + _t.sID + '" is resuming from paused state',1); + _t.resume(); + } else { + _s._wD(fN+'"'+ _t.sID+'" is starting to play'); + _t.playState = 1; + _t.paused = false; + if (!_t.instanceCount || _t._iO.multiShotEvents || (_fV > 8 && !_t.isHTML5 && !_t.getAutoPlay())) { + _t.instanceCount++; + } + _t.position = (typeof _t._iO.position !== 'undefined' && !isNaN(_t._iO.position)?_t._iO.position:0); + if (!_t.isHTML5) { + _t._iO = _policyFix(_loopFix(_t._iO)); + } + if (_t._iO.onplay && _updatePlayState) { + _t._iO.onplay.apply(_t); + _t._onplay_called = true; + } + _t.setVolume(_t._iO.volume, true); + _t.setPan(_t._iO.pan, true); + if (!_t.isHTML5) { + _s.o._start(_t.sID, _t._iO.loops || 1, (_fV === 9?_t.position:_t.position / 1000)); + } else { + _start_html5_timer(); + _t._setup_html5().play(); + } + } + return _t; + }; + + this.start = this.play; // just for convenience + + this.stop = function(bAll) { + if (_t.playState === 1) { + _t._onbufferchange(0); + _t.resetOnPosition(0); + if (!_t.isHTML5) { + _t.playState = 0; + } + _t.paused = false; + if (_t._iO.onstop) { + _t._iO.onstop.apply(_t); + } + if (!_t.isHTML5) { + _s.o._stop(_t.sID, bAll); + // hack for netStream: just unload + if (_t._iO.serverURL) { + _t.unload(); + } + } else { + if (_a) { + _t.setPosition(0); // act like Flash, though + _a.pause(); // html5 has no stop() + _t.playState = 0; + _t._onTimer(); // and update UI + _stop_html5_timer(); + _t.unload(); + } + } + _t.instanceCount = 0; + _t._iO = {}; + } + return _t; + }; + + this.setAutoPlay = function(autoPlay) { + _s._wD('sound '+_t.sID+' turned autoplay ' + (autoPlay ? 'on' : 'off')); + _t._iO.autoPlay = autoPlay; + _s.o._setAutoPlay(_t.sID, autoPlay); + if (autoPlay) { + // KJV Only increment the instanceCount if the sound isn't loaded (TODO: verify RTMP) + if (!_t.instanceCount && _t.readyState === 1) { + _t.instanceCount++; + _s._wD('sound '+_t.sID+' incremented instance count to '+_t.instanceCount); + } + } + }; + + this.getAutoPlay = function() { + return _t._iO.autoPlay; + }; + + this.setPosition = function(nMsecOffset, bNoDebug) { + if (nMsecOffset === undefined) { + nMsecOffset = 0; + } + // KJV Use the duration from the instance options, if we don't have a track duration yet. + // Auto-loading streams with a starting position in their options will start playing + // as soon as they connect. In the start() call we set the position on the stream, + // but because the stream hasn't played _t.duration won't have been set (that is + // done in whileloading()). So if we don't have a duration yet, use the duration + // from the instance options, if available. + var position, offset = (_t.isHTML5 ? Math.max(nMsecOffset,0) : Math.min(_t.duration || _t._iO.duration, Math.max(nMsecOffset, 0))); // position >= 0 and <= current available (loaded) duration + _t.position = offset; + _t.resetOnPosition(_t.position); + _t._iO.position = offset; + if (!_t.isHTML5) { + position = _fV === 9 ? _t.position : _t.position / 1000; + // KJV We want our sounds to play on seek. A progressive download that + // is loaded has paused = false so resume() does nothing and the sound + // doesn't play. Handle that case here. + if (_t.serverURL && _t.playState === 0) { + _t.play({ position: position }); + } else { + _s.o._setPosition(_t.sID, position, (_t.paused || !_t.playState)); // if paused or not playing, will not resume (by playing) + // if (_t.paused) { + // _t.resume(); + // } + } + } else if (_a) { + _s._wD('setPosition(): setting position to '+(_t.position / 1000)); + if (_t.playState) { + // DOM/JS errors/exceptions to watch out for: + // if seek is beyond (loaded?) position, "DOM exception 11" + // "INDEX_SIZE_ERR": DOM exception 1 + try { + _a.currentTime = _t.position / 1000; + } catch(e) { + _s._wD('setPosition('+_t.position+'): WARN: Caught exception: '+e.message, 2); + } + } else { + _s._wD('HTML5 warning: cannot set position while playState == 0 (not playing)',2); + } + if (_t.paused) { // if paused, refresh UI right away + _t._onTimer(true); // force update + if (_t._iO.useMovieStar) { + _t.resume(); + } + } + } + return _t; + }; + + this.pause = function(bCallFlash) { + if (_t.paused || (_t.playState === 0 && _t.readyState !== 1)) { + return _t; + } + _s._wD('SMSound.pause()'); + _t.paused = true; + if (!_t.isHTML5) { + if (bCallFlash || bCallFlash === undefined) { + _s.o._pause(_t.sID); + } + } else { + _t._setup_html5().pause(); + _stop_html5_timer(); + } + if (_t._iO.onpause) { + _t._iO.onpause.apply(_t); + } + return _t; + }; + + // When auto-loaded streams pause on buffer full they have a playState of 0. + // We need to make sure that the playState is set to 1 when these streams "resume". + // + // When a paused stream is resumed, we need to trigger the onplay() callback if it + // hasn't been called already. In this case since the sound is being played for the + // first time, I think it's more appropriate to call onplay() rather than onresume(). + + this.resume = function() { + if (!_t.paused) { + return _t; + } + _s._wD('SMSound.resume()'); + _t.paused = false; + _t.playState = 1; + if (!_t.isHTML5) { + _s.o._pause(_t.sID); // flash method is toggle-based (pause/resume) + if (_t._iO.isMovieStar && _isWebkit) { + // Bizarre Webkit bug (Chrome reported via 8tracks.com dudes): AAC content paused for 30+ seconds(?) will not resume without a reposition. + _t.setPosition(_t.position); + } + } else { + _t._setup_html5().play(); + _start_html5_timer(); + } + if (!_t._onplay_called && _t._iO.onplay) { + _t._iO.onplay.apply(_t); + _t._onplay_called = true; + } else if (_t._iO.onresume) { + _t._iO.onresume.apply(_t); + } + return _t; + }; + + this.togglePause = function() { + _s._wD('SMSound.togglePause()'); + if (_t.playState === 0) { + _t.play({ + position: (_fV === 9 && !_t.isHTML5 ? _t.position:_t.position / 1000) + }); + return _t; + } + if (_t.paused) { + _t.resume(); + } else { + _t.pause(); + } + return _t; + }; + + this.setPan = function(nPan, bInstanceOnly) { + if (typeof nPan === 'undefined') { + nPan = 0; + } + if (typeof bInstanceOnly === 'undefined') { + bInstanceOnly = false; + } + if (!_t.isHTML5) { + _s.o._setPan(_t.sID, nPan); + } // else { no HTML5 pan? } + _t._iO.pan = nPan; + if (!bInstanceOnly) { + _t.pan = nPan; + } + return _t; + }; + + this.setVolume = function(nVol, bInstanceOnly) { + if (typeof nVol === 'undefined') { + nVol = 100; + } + if (typeof bInstanceOnly === 'undefined') { + bInstanceOnly = false; + } + if (!_t.isHTML5) { + _s.o._setVolume(_t.sID, (_s.muted && !_t.muted) || _t.muted?0:nVol); + } else if (_a) { + _a.volume = nVol/100; + } + _t._iO.volume = nVol; + if (!bInstanceOnly) { + _t.volume = nVol; + } + return _t; + }; + + this.mute = function() { + _t.muted = true; + if (!_t.isHTML5) { + _s.o._setVolume(_t.sID, 0); + } else if (_a) { + _a.muted = true; + } + return _t; + }; + + this.unmute = function() { + _t.muted = false; + var hasIO = typeof _t._iO.volume !== 'undefined'; + if (!_t.isHTML5) { + _s.o._setVolume(_t.sID, hasIO?_t._iO.volume:_t.options.volume); + } else if (_a) { + _a.muted = false; + } + return _t; + }; + + this.toggleMute = function() { + return (_t.muted?_t.unmute():_t.mute()); + }; + + this.onposition = function(nPosition, oMethod, oScope) { + // TODO: allow for ranges, too? eg. (nPosition instanceof Array) + _t._onPositionItems.push({ + position: nPosition, + method: oMethod, + scope: (typeof oScope !== 'undefined'?oScope:_t), + fired: false + }); + return _t; + }; + + this.processOnPosition = function() { + var i, item, j = _t._onPositionItems.length; + if (!j || !_t.playState || _t._onPositionFired >= j) { + return false; + } + for (i=j; i--;) { + item = _t._onPositionItems[i]; + if (!item.fired && _t.position >= item.position) { + item.method.apply(item.scope,[item.position]); + item.fired = true; + _s._onPositionFired++; + } + } + return true; + }; + + this.resetOnPosition = function(nPosition) { + // reset "fired" for items interested in this position + var i, item, j = _t._onPositionItems.length; + if (!j) { + return false; + } + for (i=j; i--;) { + item = _t._onPositionItems[i]; + if (item.fired && nPosition <= item.position) { + item.fired = false; + _s._onPositionFired--; + } + } + return true; + }; + + // pseudo-private soundManager reference + + this._onTimer = function(bForce) { + // HTML5-only _whileplaying() etc. + var time, x = {}; + if (_t._hasTimer || bForce) { + if (_a && (bForce || ((_t.playState > 0 || _t.readyState === 1) && !_t.paused))) { // TODO: May not need to track readyState (1 = loading) + _t.duration = _get_html5_duration(); + _t.durationEstimate = _t.duration; + time = _a.currentTime?_a.currentTime*1000:0; + _t._whileplaying(time,x,x,x,x); + return true; + } else { + _s._wD('_onTimer: Warn for "'+_t.sID+'": '+(!_a?'Could not find element. ':'')+(_t.playState === 0?'playState bad, 0?':'playState = '+_t.playState+', OK')); + return false; + } + } + }; + + // --- private internals --- + + _get_html5_duration = function() { + var d = (_a?_a.duration*1000:undefined); + return (d && !isNaN(d)?d:null); + }; + + _start_html5_timer = function() { + if (_t.isHTML5) { + _startTimer(_t); + } + }; + + _stop_html5_timer = function() { + if (_t.isHTML5) { + _stopTimer(_t); + } + }; + + _resetProperties = function(bLoaded) { + _t._onPositionItems = []; + _t._onPositionFired = 0; + _t._hasTimer = null; + _t._added_events = null; + _t._onplay_called = false; + _t._audio = null; + _a = null; + _t.bytesLoaded = null; + _t.bytesTotal = null; + _t.position = null; + _t.duration = (_t._iO && _t._iO.duration?_t._iO.duration:null); + _t.durationEstimate = null; + _t.failures = 0; + _t.loaded = false; + _t.playState = 0; + _t.paused = false; + _t.readyState = 0; // 0 = uninitialised, 1 = loading, 2 = failed/error, 3 = loaded/success + _t.muted = false; + _t.didBeforeFinish = false; + _t.didJustBeforeFinish = false; + _t.isBuffering = false; + _t.instanceOptions = {}; + _t.instanceCount = 0; + _t.peakData = { + left: 0, + right: 0 + }; + _t.waveformData = { + left: [], + right: [] + }; + _t.eqData = []; // legacy: 1D array + _t.eqData.left = []; + _t.eqData.right = []; + }; + + _resetProperties(); + + // pseudo-private methods used by soundManager + + this._setup_html5 = function(oOptions) { + var _iO = _mixin(_t._iO, oOptions); + if (_a) { + if (_t.url !== _iO.url) { + _s._wD('setting new URL on existing object: '+_iO.url); + _a.src = _iO.url; + } + } else { + _s._wD('creating HTML5 Audio() element with URL: '+_iO.url); + _t._audio = new Audio(_iO.url); + _a = _t._audio; + _t.isHTML5 = true; + _add_html5_events(); + } + _a.loop = (_iO.loops>1?'loop':''); // boolean instead of "loop", for webkit? - spec says string. http://www.w3.org/TR/html-markup/audio.html#audio.attrs.loop + return _t._audio; + }; + + // related private methods + + _html5_events = { + + // HTML5 event-name-to-handler map + + canplay: function(e) { + _s._wD('HTML5::canplay: '+_t.sID); + // enough has loaded to play + _t._onbufferchange(0); + }, + + load: function(e) { + if (_a && !_t.loaded) { + _t._onbufferchange(0); + // should be 1, and the same + _t._whileloading(_t.bytesTotal, _t.bytesTotal, _get_html5_duration()); + _t._onload(true); + } + }, + + ended: function(e) { + _s._wD('HTML5::ended: '+_t.sID); + _t._onfinish(); + }, + + error: function(e) { + if (_a) { + _s._wD('HTML5::error: '+_a.error.code); + // call load with error state? + _t._onload(false); + } + }, + + loadstart: function(e) { + _s._wD('HTML5::loadstart: '+_t.sID); + // assume buffering at first + _t._onbufferchange(1); + }, + + play: function(e) { + _s._wD('HTML5::play: '+_t.sID); + // once play starts, no buffering + _t._onbufferchange(0); + }, + + // TODO: verify if this is actually implemented anywhere yet. + playing: function(e) { + _s._wD('HTML5::playing: '+_t.sID); + // once play starts, no buffering + _t._onbufferchange(0); + }, + + progress: function(e) { + + if (!_a || _t.loaded) { + return false; + } + + var i, j, str, loadSum = 0, buffered = 0, + isProgress = (e.type === 'progress'), + ranges = e.target.buffered, + loaded = (e.loaded||0), // firefox 3.6 implements e.loaded/total (bytes) + total = (e.total||1); + + if (ranges && ranges.length) { + + // if loaded is 0, try TimeRanges implementation as % of load + // https://developer.mozilla.org/en/DOM/TimeRanges + for (i=ranges.length; i--;) { + buffered = (ranges.end(i) - ranges.start(i)); + } + + // linear case, buffer sum; does not account for seeking and HTTP partials / byte ranges + loaded = buffered/e.target.duration; + + // + if (isProgress && ranges.length > 1) { + str = []; + j = ranges.length; + for (i=0; i + + if (isProgress) { + _s._wD('HTML5::progress: '+_t.sID+': ' + Math.floor(loaded*100)+'% loaded'); + } + + } + + _t._onbufferchange(0); // if progress, likely not buffering + _t._whileloading(loaded, total, _get_html5_duration()); + + if (loaded && total && loaded === total) { + // in case "onload" doesn't fire (eg. gecko 1.9.2) + _html5_events.load(); + } + + }, + + suspend: function(e) { + // download paused/stopped, may have finished (eg. onload) + _s._wD('HTML5::suspend: '+_t.sID); + _html5_events.progress(e); + }, + + timeupdate: function(e) { + _t._onTimer(); + }, + + waiting: function(e) { // see also: seeking + _s._wD('HTML5::waiting: '+_t.sID); + // playback faster than download rate, etc. + _t._onbufferchange(1); + } + + }; + + _add_html5_events = function() { + + if (_t._added_events) { + return false; + } + + var f; + + function add(oEvt, oFn, bCapture) { + return (_a ? _a.addEventListener(oEvt, oFn, bCapture||false) : null); + } + + _t._added_events = true; + + for (f in _html5_events) { + if (_html5_events.hasOwnProperty(f)) { + add(f, _html5_events[f]); + } + /* + if (_isSafari && f === 'ended') { + // Safari prematurely fires "ended" right away otherwise? + setTimeout(function(){ + if (_t && _a) { + _add('ended', _ended); + } + }, 250); + } else { + add(f, _html5_events[f]); + } + */ + } + + return true; + + }; + + // --- "private" methods called by Flash --- + + this._whileloading = function(nBytesLoaded, nBytesTotal, nDuration, nBufferLength) { + _t.bytesLoaded = nBytesLoaded; + _t.bytesTotal = nBytesTotal; + _t.duration = Math.floor(nDuration); + _t.bufferLength = nBufferLength; + if (!_t._iO.isMovieStar) { + if (_t._iO.duration) { + // use options, if specified and larger + _t.durationEstimate = (_t.duration > _t._iO.duration) ? _t.duration : _t._iO.duration; + } else { + _t.durationEstimate = parseInt((_t.bytesTotal / _t.bytesLoaded) * _t.duration, 10); + } + if (_t.durationEstimate === undefined) { + _t.durationEstimate = _t.duration; + } + if (_t.readyState !== 3 && _t._iO.whileloading) { + _t._iO.whileloading.apply(_t); + } + } else { + _t.durationEstimate = _t.duration; + if (_t.readyState !== 3 && _t._iO.whileloading) { + _t._iO.whileloading.apply(_t); + } + } + }; + + this._onid3 = function(oID3PropNames, oID3Data) { + // oID3PropNames: string array (names) + // ID3Data: string array (data) + _s._wD('SMSound._onid3(): "' + this.sID + '" ID3 data received.'); + var oData = [], i, j; + for (i = 0, j = oID3PropNames.length; i < j; i++) { + oData[oID3PropNames[i]] = oID3Data[i]; + } + _t.id3 = _mixin(_t.id3, oData); + if (_t._iO.onid3) { + _t._iO.onid3.apply(_t); + } + }; + + this._whileplaying = function(nPosition, oPeakData, oWaveformDataLeft, oWaveformDataRight, oEQData) { + if (isNaN(nPosition) || nPosition === null) { + return false; // flash safety net + } + if (_t.playState === 0 && nPosition > 0) { + // invalid position edge case for end/stop + nPosition = 0; + } + _t.position = nPosition; + _t.processOnPosition(); + if (_fV > 8 && !_t.isHTML5) { + if (_t._iO.usePeakData && typeof oPeakData !== 'undefined' && oPeakData) { + _t.peakData = { + left: oPeakData.leftPeak, + right: oPeakData.rightPeak + }; + } + if (_t._iO.useWaveformData && typeof oWaveformDataLeft !== 'undefined' && oWaveformDataLeft) { + _t.waveformData = { + left: oWaveformDataLeft.split(','), + right: oWaveformDataRight.split(',') + }; + } + if (_t._iO.useEQData) { + if (typeof oEQData !== 'undefined' && oEQData && oEQData.leftEQ) { + var eqLeft = oEQData.leftEQ.split(','); + _t.eqData = eqLeft; + _t.eqData.left = eqLeft; + if (typeof oEQData.rightEQ !== 'undefined' && oEQData.rightEQ) { + _t.eqData.right = oEQData.rightEQ.split(','); + } + } + } + } + if (_t.playState === 1) { + // special case/hack: ensure buffering is false if loading from cache (and not yet started) + if (!_t.isHTML5 && _s.flashVersion === 8 && !_t.position && _t.isBuffering) { + _t._onbufferchange(0); + } + if (_t._iO.whileplaying) { + _t._iO.whileplaying.apply(_t); // flash may call after actual finish + } + if ((_t.loaded || (!_t.loaded && _t._iO.isMovieStar)) && _t._iO.onbeforefinish && _t._iO.onbeforefinishtime && !_t.didBeforeFinish && _t.duration - _t.position <= _t._iO.onbeforefinishtime) { + _t._onbeforefinish(); + } + } + return true; + }; + + this._onconnect = function(bSuccess) { + var fN = 'SMSound._onconnect(): '; + bSuccess = (bSuccess === 1); + _s._wD(fN+'"'+_t.sID+'"'+(bSuccess?' connected.':' failed to connect? - '+_t.url), (bSuccess?1:2)); + _t.connected = bSuccess; + if (bSuccess) { + _t.failures = 0; + if (_t._iO.onconnect) { + _t._iO.onconnect.apply(_t,[bSuccess]); + } + // don't play if the sound is being destroyed + if (_idCheck(_t.sID) && (_t.options.autoLoad || _t.getAutoPlay())) { + _t.play(undefined, _t.getAutoPlay()); // only update the play state if auto playing + } + } + }; + + this._onload = function(nSuccess) { + var fN = 'SMSound._onload(): ', loadOK = (nSuccess?true:false); + _s._wD(fN + '"' + _t.sID + '"' + (loadOK?' loaded.':' failed to load? - ' + _t.url), (loadOK?1:2)); + // + if (!loadOK && !_t.isHTML5) { + if (_s.sandbox.noRemote === true) { + _s._wD(fN + _str('noNet'), 1); + } + if (_s.sandbox.noLocal === true) { + _s._wD(fN + _str('noLocal'), 1); + } + } + // + _t.loaded = loadOK; + _t.readyState = loadOK?3:2; + _t._onbufferchange(0); + if (_t._iO.onload) { + _t._iO.onload.apply(_t, [loadOK]); + } + return true; + }; + + // fire onfailure() only once at most + // at this point we just recreate failed sounds rather than trying to reconnect. + this._onfailure = function(msg, level, code) { + _t.failures++; + _s._wD('SMSound._onfailure(): "'+_t.sID+'" count '+_t.failures); + if (_t._iO.onfailure && _t.failures === 1) { + _t._iO.onfailure(_t, msg, level, code); + } else { + _s._wD('SMSound._onfailure(): ignoring'); + } + }; + + this._onbeforefinish = function() { + if (!_t.didBeforeFinish) { + _t.didBeforeFinish = true; + if (_t._iO.onbeforefinish) { + _s._wD('SMSound._onbeforefinish(): "' + _t.sID + '"'); + _t._iO.onbeforefinish.apply(_t); + } + } + }; + + this._onjustbeforefinish = function(msOffset) { + if (!_t.didJustBeforeFinish) { + _t.didJustBeforeFinish = true; + if (_t._iO.onjustbeforefinish) { + _s._wD('SMSound._onjustbeforefinish(): "' + _t.sID + '"'); + _t._iO.onjustbeforefinish.apply(_t); + } + } + }; + + // KJV - connect & play time callback from Flash + this._onstats = function(stats) { + if (_t._iO.onstats) { + _t._iO.onstats(_t, stats); + } + }; + + this._onfinish = function() { + // _s._wD('SMSound._onfinish(): "' + _t.sID + '" got instanceCount '+_t.instanceCount); + _t._onbufferchange(0); + _t.resetOnPosition(0); + if (_t._iO.onbeforefinishcomplete) { + _t._iO.onbeforefinishcomplete.apply(_t); + } + // reset some state items + _t.didBeforeFinish = false; + _t.didJustBeforeFinish = false; + if (_t.instanceCount) { + _t.instanceCount--; + if (!_t.instanceCount) { + // reset instance options + _t.playState = 0; + _t.paused = false; + _t.instanceCount = 0; + _t.instanceOptions = {}; + _stop_html5_timer(); + } + if (!_t.instanceCount || _t._iO.multiShotEvents) { + // fire onfinish for last, or every instance + if (_t._iO.onfinish) { + _s._wD('SMSound._onfinish(): "' + _t.sID + '"'); + _t._iO.onfinish.apply(_t); + } + } + } + }; + + this._onbufferchange = function(nIsBuffering) { + var fN = 'SMSound._onbufferchange()'; + if (_t.playState === 0) { + // ignore if not playing + return false; + } + if ((nIsBuffering && _t.isBuffering) || (!nIsBuffering && !_t.isBuffering)) { + return false; + } + _t.isBuffering = (nIsBuffering === 1); + if (_t._iO.onbufferchange) { + _s._wD(fN + ': ' + nIsBuffering); + _t._iO.onbufferchange.apply(_t); + } + return true; + }; + + this._ondataerror = function(sError) { + // flash 9 wave/eq data handler + if (_t.playState > 0) { // hack: called at start, and end from flash at/after onfinish() + _s._wD('SMSound._ondataerror(): ' + sError); + if (_t._iO.ondataerror) { + _t._iO.ondataerror.apply(_t); + } + } + }; + + }; // SMSound() + + // --- private SM2 internals --- + + _getDocument = function() { + return (_doc.body?_doc.body:(_doc._docElement?_doc.documentElement:_doc.getElementsByTagName('div')[0])); + }; + + _id = function(sID) { + return _doc.getElementById(sID); + }; + + _mixin = function(oMain, oAdd) { + // non-destructive merge + var o1 = {}, i, o2, o; + for (i in oMain) { // clone c1 + if (oMain.hasOwnProperty(i)) { + o1[i] = oMain[i]; + } + } + o2 = (typeof oAdd === 'undefined'?_s.defaultOptions:oAdd); + for (o in o2) { + if (o2.hasOwnProperty(o) && typeof o1[o] === 'undefined') { + o1[o] = o2[o]; + } + } + return o1; + }; + + _event = (function() { + + var old = (_win.attachEvent), + evt = { + add: (old?'attachEvent':'addEventListener'), + remove: (old?'detachEvent':'removeEventListener') + }; + + function getArgs(oArgs) { + var args = _slice.call(oArgs), len = args.length; + if (old) { + args[1] = 'on' + args[1]; // prefix + if (len > 3) { + args.pop(); // no capture + } + } else if (len === 3) { + args.push(false); + } + return args; + } + + function apply(args, sType) { + var element = args.shift(), + method = [evt[sType]]; + if (old) { + element[method](args[0], args[1]); + } else { + element[method].apply(element, args); + } + } + + function add() { + apply(getArgs(arguments), 'add'); + } + + function remove() { + apply(getArgs(arguments), 'remove'); + } + + return { + 'add': add, + 'remove': remove + }; + + }()); + + _html5OK = function(iO) { + return (iO.type?_html5CanPlay({type:iO.type}):_html5CanPlay(iO.url)||_html5Only); // Use type, if specified. If HTML5-only mode, no other options, so just give 'er + }; + + _html5CanPlay = function(sURL) { + // try to find MIME, test and return truthiness + if (!_s.useHTML5Audio || !_s.hasHTML5) { + return false; + } + var result, mime, fileExt, item, aF = _s.audioFormats; + if (!_html5Ext) { + _html5Ext = []; + for (item in aF) { + if (aF.hasOwnProperty(item)) { + _html5Ext.push(item); + if (aF[item].related) { + _html5Ext = _html5Ext.concat(aF[item].related); + } + } + } + _html5Ext = new RegExp('\\.('+_html5Ext.join('|')+')','i'); + } + mime = (typeof sURL.type !== 'undefined'?sURL.type:null); + fileExt = (typeof sURL === 'string'?sURL.toLowerCase().match(_html5Ext):null); // TODO: Strip URL queries, etc. + if (!fileExt || !fileExt.length) { + if (!mime) { + return false; + } + } else { + fileExt = fileExt[0].substr(1); // "mp3", for example + } + if (fileExt && typeof _s.html5[fileExt] !== 'undefined') { + // result known + return _s.html5[fileExt]; + } else { + if (!mime) { + if (fileExt && _s.html5[fileExt]) { + return _s.html5[fileExt]; + } else { + // best-case guess, audio/whatever-dot-filename-format-you're-playing + mime = 'audio/'+fileExt; + } + } + result = _s.html5.canPlayType(mime); + _s.html5[fileExt] = result; + // _s._wD('canPlayType, found result: '+result); + return result; + } + }; + + _testHTML5 = function() { + if (!_s.useHTML5Audio || typeof Audio === 'undefined') { + return false; + } + var a = (typeof Audio !== 'undefined' ? new Audio():null), item, support = {}, aF, i; + function _cp(m) { + var canPlay, i, j, isOK = false; + if (!a || typeof a.canPlayType !== 'function') { + return false; + } + if (m instanceof Array) { + // iterate through all mime types, return any successes + for (i=0, j=m.length; i + notReady: 'Not loaded yet - wait for soundManager.onload()/onready()', + notOK: 'Audio support is not available.', + appXHTML: _sm + '::createMovie(): appendChild/innerHTML set failed. May be app/xhtml+xml DOM-related.', + spcWmode: _sm + '::createMovie(): Removing wmode, preventing win32 below-the-fold SWF loading issue', + swf404: _sm + ': Verify that %s is a valid path.', + tryDebug: 'Try ' + _sm + '.debugFlash = true for more security details (output goes to SWF.)', + checkSWF: 'See SWF output for more debug info.', + localFail: _sm + ': Non-HTTP page (' + _doc.location.protocol + ' URL?) Review Flash player security settings for this special case:\nhttp://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html\nMay need to add/allow path, eg. c:/sm2/ or /users/me/sm2/', + waitFocus: _sm + ': Special case: Waiting for focus-related event..', + waitImpatient: _sm + ': Getting impatient, still waiting for Flash%s...', + waitForever: _sm + ': Waiting indefinitely for Flash (will recover if unblocked)...', + needFunction: _sm + ': Function object expected for %s', + badID: 'Warning: Sound ID "%s" should be a string, starting with a non-numeric character', + noMS: 'MovieStar mode not enabled. Exiting.', + currentObj: '--- ' + _sm + '._debug(): Current sound objects ---', + waitEI: _sm + '::initMovie(): Waiting for ExternalInterface call from Flash..', + waitOnload: _sm + ': Waiting for window.onload()', + docLoaded: _sm + ': Document already loaded', + onload: _sm + '::initComplete(): calling soundManager.onload()', + onloadOK: _sm + '.onload() complete', + init: '-- ' + _sm + '::init() --', + didInit: _sm + '::init(): Already called?', + flashJS: _sm + ': Attempting to call Flash from JS..', + noPolling: _sm + ': Polling (whileloading()/whileplaying() support) is disabled.', + secNote: 'Flash security note: Network/internet URLs will not load due to security restrictions. Access can be configured via Flash Player Global Security Settings Page: http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html', + badRemove: 'Warning: Failed to remove flash movie.', + noPeak: 'Warning: peakData features unsupported for movieStar formats', + shutdown: _sm + '.disable(): Shutting down', + queue: _sm + ': Queueing %s handler', + smFail: _sm + ': Failed to initialise.', + smError: 'SMSound.load(): Exception: JS-Flash communication failed, or JS error.', + fbTimeout: 'No flash response, applying .'+_s.swfCSS.swfTimedout+' CSS..', + fbLoaded: 'Flash loaded', + fbHandler: 'soundManager::flashBlockHandler()', + manURL: 'SMSound.load(): Using manually-assigned URL', + onURL: _sm + '.load(): current URL already assigned.', + badFV: 'soundManager.flashVersion must be 8 or 9. "%s" is invalid. Reverting to %s.', + as2loop: 'Note: Setting stream:false so looping can work (flash 8 limitation)', + noNSLoop: 'Note: Looping not implemented for MovieStar formats', + needfl9: 'Note: Switching to flash 9, required for MP4 formats.', + mfTimeout: 'Setting flashLoadTimeout = 0 (infinite) for off-screen, mobile flash case', + mfOn: 'mobileFlash::enabling on-screen flash repositioning', + policy: 'Enabling usePolicyFile for data access' + // + }; + + _str = function() { // o [,items to replace] + // + var args = _slice.call(arguments), // real array, please + o = args.shift(), // first arg + str = (_strings && _strings[o]?_strings[o]:''), i, j; + if (str && args && args.length) { + for (i = 0, j = args.length; i < j; i++) { + str = str.replace('%s', args[i]); + } + } + return str; + // + }; + + _loopFix = function(sOpt) { + // flash 8 requires stream = false for looping to work + if (_fV === 8 && sOpt.loops > 1 && sOpt.stream) { + _wDS('as2loop'); + sOpt.stream = false; + } + return sOpt; + }; + + _policyFix = function(sOpt, sPre) { + if (sOpt && !sOpt.usePolicyFile && (sOpt.onid3 || sOpt.usePeakData || sOpt.useWaveformData || sOpt.useEQData)) { + _s._wD((sPre?sPre+':':'') + _str('policy')); + sOpt.usePolicyFile = true; + } + return sOpt; + }; + + _complain = function(sMsg) { + if (typeof console !== 'undefined' && typeof console.warn !== 'undefined') { + console.warn(sMsg); + } else { + _s._wD(sMsg); + } + }; + + _doNothing = function() { + return false; + }; + + _disableObject = function(o) { + for (var oProp in o) { + if (o.hasOwnProperty(oProp) && typeof o[oProp] === 'function') { + o[oProp] = _doNothing; + } + } + oProp = null; + }; + + _failSafely = function(bNoDisable) { + // general failure exception handler + if (typeof bNoDisable === 'undefined') { + bNoDisable = false; + } + if (_disabled || bNoDisable) { + _wDS('smFail', 2); + _s.disable(bNoDisable); + } + }; + + _normalizeMovieURL = function(smURL) { + var urlParams = null; + if (smURL) { + if (smURL.match(/\.swf(\?.*)?$/i)) { + urlParams = smURL.substr(smURL.toLowerCase().lastIndexOf('.swf?') + 4); + if (urlParams) { + return smURL; // assume user knows what they're doing + } + } else if (smURL.lastIndexOf('/') !== smURL.length - 1) { + smURL = smURL + '/'; + } + } + return (smURL && smURL.lastIndexOf('/') !== - 1?smURL.substr(0, smURL.lastIndexOf('/') + 1):'./') + _s.movieURL; + }; + + _setVersionInfo = function() { + if (_fV !== 8 && _fV !== 9) { + _s._wD(_str('badFV', _fV, _defaultFlashVersion)); + _s.flashVersion = _defaultFlashVersion; + } + var isDebug = (_s.debugMode || _s.debugFlash?'_debug.swf':'.swf'); // debug flash movie, if applicable + if (_s.useHTML5Audio && !_html5Only && _s.audioFormats.mp4.required && _s.flashVersion < 9) { + _s._wD(_str('needfl9')); + _s.flashVersion = 9; + } + _fV = _s.flashVersion; // short-hand for internal use + _s.version = _s.versionNumber + (_html5Only?' (HTML5-only mode)':(_fV === 9?' (AS3/Flash 9)':' (AS2/Flash 8)')); + // set up default options + if (_fV > 8) { + _s.defaultOptions = _mixin(_s.defaultOptions, _s.flash9Options); + _s.features.buffering = true; + } + if (_fV > 8 && _s.useMovieStar) { + // flash 9+ support for movieStar formats as well as MP3 + _s.defaultOptions = _mixin(_s.defaultOptions, _s.movieStarOptions); + _s.filePatterns.flash9 = new RegExp('\\.(mp3|' + _s.netStreamTypes.join('|') + ')(\\?.*)?$', 'i'); + _s.mimePattern = _s.netStreamMimeTypes; + _s.features.movieStar = true; + } else { + _s.useMovieStar = false; + _s.features.movieStar = false; + } + _s.filePattern = _s.filePatterns[(_fV !== 8?'flash9':'flash8')]; + _s.movieURL = (_fV === 8?'soundmanager2.swf':'soundmanager2_flash9.swf').replace('.swf',isDebug); + _s.features.peakData = _s.features.waveformData = _s.features.eqData = (_fV > 8); + }; + + _setPolling = function(bPolling, bHighPerformance) { + if (!_s.o || !_s.allowPolling) { + return false; + } + _s.o._setPolling(bPolling, bHighPerformance); + }; + + function _initDebug() { + if (_s.debugURLParam.test(_wl)) { + _s.debugMode = true; // allow force of debug mode via URL + } + // + if (_id(_s.debugID)) { + return false; + } + var oD, oDebug, oTarget, oToggle, tmp; + if (_s.debugMode && !_id(_s.debugID) && ((!_hasConsole || !_s.useConsole) || (_s.useConsole && _hasConsole && !_s.consoleOnly))) { + oD = _doc.createElement('div'); + oD.id = _s.debugID + '-toggle'; + oToggle = { + 'position': 'fixed', + 'bottom': '0px', + 'right': '0px', + 'width': '1.2em', + 'height': '1.2em', + 'lineHeight': '1.2em', + 'margin': '2px', + 'textAlign': 'center', + 'border': '1px solid #999', + 'cursor': 'pointer', + 'background': '#fff', + 'color': '#333', + 'zIndex': 10001 + }; + oD.appendChild(_doc.createTextNode('-')); + oD.onclick = _toggleDebug; + oD.title = 'Toggle SM2 debug console'; + if (_ua.match(/msie 6/i)) { + oD.style.position = 'absolute'; + oD.style.cursor = 'hand'; + } + for (tmp in oToggle) { + if (oToggle.hasOwnProperty(tmp)) { + oD.style[tmp] = oToggle[tmp]; + } + } + oDebug = _doc.createElement('div'); + oDebug.id = _s.debugID; + oDebug.style.display = (_s.debugMode?'block':'none'); + if (_s.debugMode && !_id(oD.id)) { + try { + oTarget = _getDocument(); + oTarget.appendChild(oD); + } catch(e2) { + throw new Error(_str('appXHTML')); + } + oTarget.appendChild(oDebug); + } + } + oTarget = null; + // + } + + _createMovie = function(smID, smURL) { + + var specialCase = null, + remoteURL = (smURL?smURL:_s.url), + localURL = (_s.altURL?_s.altURL:remoteURL), + oEmbed, oMovie, oTarget = _getDocument(), tmp, movieHTML, oEl, extraClass = _getSWFCSS(), s, x, sClass, side = '100%', isRTL = null, html = _doc.getElementsByTagName('html')[0]; + isRTL = (html && html.dir && html.dir.match(/rtl/i)); + smID = (typeof smID === 'undefined'?_s.id:smID); + + if (_didAppend && _appendSuccess) { + return false; // ignore if already succeeded + } + + function _initMsg() { + _s._wD('-- SoundManager 2 ' + _s.version + (!_html5Only && _s.useHTML5Audio?(_s.hasHTML5?' + HTML5 audio':', no HTML5 audio support'):'') + (!_html5Only ? (_s.useMovieStar?', MovieStar mode':'') + (_s.useHighPerformance?', high performance mode, ':', ') + (( _s.flashPollingInterval ? 'custom (' + _s.flashPollingInterval + 'ms)' : (_s.useFastPolling?'fast':'normal')) + ' polling') + (_s.wmode?', wmode: ' + _s.wmode:'') + (_s.debugFlash?', flash debug mode':'') + (_s.useFlashBlock?', flashBlock mode':'') : '') + ' --', 1); + } + + if (_html5Only) { + _setVersionInfo(); + _initMsg(); + _s.oMC = _id(_s.movieID); + _init(); + // prevent multiple init attempts + _didAppend = true; + _appendSuccess = true; + return false; + } + + _didAppend = true; + + // safety check for legacy (change to Flash 9 URL) + _setVersionInfo(); + _s.url = _normalizeMovieURL(_s._overHTTP?remoteURL:localURL); + smURL = _s.url; + + _s.wmode = (!_s.wmode && _s.useHighPerformance && !_s.useMovieStar?'transparent':_s.wmode); + + if (_s.wmode !== null && !_isIE && !_s.useHighPerformance && navigator.platform.match(/win32/i)) { + _s.specialWmodeCase = true; + // extra-special case: movie doesn't load until scrolled into view when using wmode = anything but 'window' here + // does not apply when using high performance (position:fixed means on-screen), OR infinite flash load timeout + _wDS('spcWmode'); + _s.wmode = null; + } + + oEmbed = { + 'name': smID, + 'id': smID, + 'src': smURL, + 'width': side, + 'height': side, + 'quality': 'high', + 'allowScriptAccess': _s.allowScriptAccess, + 'bgcolor': _s.bgColor, + 'pluginspage': 'http://www.macromedia.com/go/getflashplayer', + 'type': 'application/x-shockwave-flash', + 'wmode': _s.wmode + }; + + if (_s.debugFlash) { + oEmbed.FlashVars = 'debug=1'; + } + + if (!_s.wmode) { + delete oEmbed.wmode; // don't write empty attribute + } + + if (_isIE) { + // IE is "special". + oMovie = _doc.createElement('div'); + movieHTML = '' + (_s.wmode?' ':'') + '' + (_s.debugFlash?'':'') + ''; + } else { + oMovie = _doc.createElement('embed'); + for (tmp in oEmbed) { + if (oEmbed.hasOwnProperty(tmp)) { + oMovie.setAttribute(tmp, oEmbed[tmp]); + } + } + } + + _initDebug(); + extraClass = _getSWFCSS(); + oTarget = _getDocument(); + + if (oTarget) { + _s.oMC = _id(_s.movieID)?_id(_s.movieID):_doc.createElement('div'); + if (!_s.oMC.id) { + _s.oMC.id = _s.movieID; + _s.oMC.className = _s.swfCSS.swfDefault + ' ' + extraClass; + // "hide" flash movie + s = null; + oEl = null; + if (!_s.useFlashBlock) { + if (_s.useHighPerformance) { + s = { + 'position': 'fixed', + 'width': '8px', + 'height': '8px', + // >= 6px for flash to run fast, >= 8px to start up under Firefox/win32 in some cases. odd? yes. + 'bottom': '0px', + 'left': '0px', + 'overflow': 'hidden', + 'hasPriority': 'true' // http://help.adobe.com/en_US/as3/mobile/WS4bebcd66a74275c36cfb8137124318eebc6-7ffd.html + }; + } else { + s = { + 'position': 'absolute', + 'width': '6px', + 'height': '6px', + 'top': '-9999px', + 'left': '-9999px', + 'hasPriority': 'true' + }; + if (isRTL) { + s.left = Math.abs(parseInt(s.left,10))+'px'; + } + } + } + if (_isWebkit) { + _s.oMC.style.zIndex = 10000; // soundcloud-reported render/crash fix, safari 5 + } + if (!_s.debugFlash) { + for (x in s) { + if (s.hasOwnProperty(x)) { + _s.oMC.style[x] = s[x]; + } + } + } + try { + if (!_isIE) { + _s.oMC.appendChild(oMovie); + } + oTarget.appendChild(_s.oMC); + if (_isIE) { + oEl = _s.oMC.appendChild(_doc.createElement('div')); + oEl.className = _s.swfCSS.swfBox; + oEl.innerHTML = movieHTML; + } + _appendSuccess = true; + } catch(e) { + throw new Error(_str('appXHTML')); + } + } else { + // it's already in the document. + sClass = _s.oMC.className; + _s.oMC.className = (sClass?sClass+' ':_s.swfCSS.swfDefault) + (extraClass?' '+extraClass:''); + _s.oMC.appendChild(oMovie); + if (_isIE) { + oEl = _s.oMC.appendChild(_doc.createElement('div')); + oEl.className = _s.swfCSS.swfBox; + oEl.innerHTML = movieHTML; + } + _appendSuccess = true; + } + } + + if (specialCase) { + _s._wD(specialCase); + } + + _initMsg(); + _s._wD('soundManager::createMovie(): Trying to load ' + smURL + (!_s._overHTTP && _s.altURL?' (alternate URL)':''), 1); + + return true; + }; + + _idCheck = this.getSoundById; + + _initMovie = function() { + if (_html5Only) { + _createMovie(); + return false; + } + // attempt to get, or create, movie + if (_s.o) { + return false; // may already exist + } + _s.o = _s.getMovie(_s.id); // inline markup + if (!_s.o) { + if (!_oRemoved) { + // try to create + _createMovie(_s.id, _s.url); + } else { + // try to re-append removed movie after reboot() + if (!_isIE) { + _s.oMC.appendChild(_oRemoved); + } else { + _s.oMC.innerHTML = _oRemovedHTML; + } + _oRemoved = null; + _didAppend = true; + } + _s.o = _s.getMovie(_s.id); + } + if (_s.o) { + try { + _s._wD('soundManager::initMovie(): Got '+_s.o.nodeName+' element ('+(_didAppend?'created via JS':'static HTML')+')'); + } catch(e) {}; + _wDS('waitEI'); + } + if (_s.oninitmovie instanceof Function) { + setTimeout(_s.oninitmovie, 1); + } + return true; + }; + + _go = function(sURL) { + // where it all begins. + if (sURL) { + _s.url = sURL; + } + _initMovie(); + }; + + _delayWaitForEI = function() { + setTimeout(_waitForEI, 500); + }; + + _waitForEI = function() { + if (_waitingForEI) { + return false; + } + _waitingForEI = true; + _event.remove(_win, 'load', _delayWaitForEI); + if (_tryInitOnFocus && !_isFocused) { + _wDS('waitFocus'); + return false; + } + var p; + if (!_didInit) { + p = _s.getMoviePercent(); + _s._wD(_str('waitImpatient', (p === 100?' (SWF loaded)':(p > 0?' (SWF ' + p + '% loaded)':'')))); + } + setTimeout(function() { + p = _s.getMoviePercent(); + if (!_didInit) { + _s._wD(_sm + ': No Flash response within expected time.\nLikely causes: ' + (p === 0?'Loading ' + _s.movieURL + ' may have failed (and/or Flash ' + _fV + '+ not present?), ':'') + 'Flash blocked or JS-Flash security error.' + (_s.debugFlash?' ' + _str('checkSWF'):''), 2); + if (!_s._overHTTP && p) { + _wDS('localFail', 2); + if (!_s.debugFlash) { + _wDS('tryDebug', 2); + } + } + if (p === 0) { + // if 0 (not null), probably a 404. + _s._wD(_str('swf404', _s.url)); + } + _debugTS('flashtojs', false, ': Timed out' + _s._overHTTP?' (Check flash security or flash blockers)':' (No plugin/missing SWF?)'); + } + // give up / time-out, depending + if (!_didInit && _okToDisable) { + if (p === null) { + // SWF failed. Maybe blocked. + if (_s.useFlashBlock || _s.flashLoadTimeout === 0) { + if (_s.useFlashBlock) { + _flashBlockHandler(); + } + _wDS('waitForever'); + } else { + // old SM2 behaviour, simply fail + _failSafely(true); + } + } else { + // flash loaded? Shouldn't be a blocking issue, then. + if (_s.flashLoadTimeout === 0) { + _wDS('waitForever'); + } else { + _failSafely(true); + } + } + } + }, _s.flashLoadTimeout); + }; + + _go = function(sURL) { + // where it all begins. + if (sURL) { + _s.url = sURL; + } + _initMovie(); + }; + + // + _wDS = function(o, errorLevel) { + if (!o) { + return ''; + } else { + return _s._wD(_str(o), errorLevel); + } + }; + + if (_wl.indexOf('debug=alert') + 1 && _s.debugMode) { + _s._wD = function(sText) {alert(sText);}; + } + + _toggleDebug = function() { + var o = _id(_s.debugID), + oT = _id(_s.debugID + '-toggle'); + if (!o) { + return false; + } + if (_debugOpen) { + // minimize + oT.innerHTML = '+'; + o.style.display = 'none'; + } else { + oT.innerHTML = '-'; + o.style.display = 'block'; + } + _debugOpen = !_debugOpen; + }; + + _debugTS = function(sEventType, bSuccess, sMessage) { + // troubleshooter debug hooks + if (typeof sm2Debugger !== 'undefined') { + try { + sm2Debugger.handleEvent(sEventType, bSuccess, sMessage); + } catch(e) { + // oh well + } + } + return true; + }; + // + + _getSWFCSS = function() { + var css = []; + if (_s.debugMode) { + css.push(_s.swfCSS.sm2Debug); + } + if (_s.debugFlash) { + css.push(_s.swfCSS.flashDebug); + } + if (_s.useHighPerformance) { + css.push(_s.swfCSS.highPerf); + } + return css.join(' '); + }; + + _flashBlockHandler = function() { + // *possible* flash block situation. + var name = _str('fbHandler'), p = _s.getMoviePercent(); + if (!_s.ok()) { + if (_needsFlash) { + // make the movie more visible, so user can fix + _s.oMC.className = _getSWFCSS() + ' ' + _s.swfCSS.swfDefault + ' ' + (p === null?_s.swfCSS.swfTimedout:_s.swfCSS.swfError); + _s._wD(name+': '+_str('fbTimeout')+(p?' ('+_str('fbLoaded')+')':'')); + } + _s.didFlashBlock = true; + _processOnEvents({type:'ontimeout',ignoreInit:true}); // fire onready(), complain lightly + if (_s.onerror instanceof Function) { + _s.onerror.apply(_win); + } + } else { + // SM2 loaded OK (or recovered) + if (_s.didFlashBlock) { + _s._wD(name+': Unblocked'); + } + if (_s.oMC) { + _s.oMC.className = _getSWFCSS() + ' ' + _s.swfCSS.swfDefault + (' '+_s.swfCSS.swfUnblocked); + } + } + }; + + _handleFocus = function() { + function cleanup() { + _event.remove(_win, 'focus', _handleFocus); + _event.remove(_win, 'load', _handleFocus); + } + if (_isFocused || !_tryInitOnFocus) { + cleanup(); + return true; + } + _okToDisable = true; + _isFocused = true; + _s._wD('soundManager::handleFocus()'); + if (_isSafari && _tryInitOnFocus) { + // giant Safari 3.1 hack - assume mousemove = focus given lack of focus event + _event.remove(_win, 'mousemove', _handleFocus); + } + // allow init to restart + _waitingForEI = false; + cleanup(); + return true; + }; + + _initComplete = function(bNoDisable) { + if (_didInit) { + return false; + } + if (_html5Only) { + // all good. + _s._wD('-- SoundManager 2: loaded --'); + _didInit = true; + _processOnEvents(); + _initUserOnload(); + return true; + } + var sClass = _s.oMC.className, + wasTimeout = (_s.useFlashBlock && _s.flashLoadTimeout && !_s.getMoviePercent()); + if (!wasTimeout) { + _didInit = true; + } + _s._wD('-- SoundManager 2 ' + (_disabled?'failed to load':'loaded') + ' (' + (_disabled?'security/load error':'OK') + ') --', 1); + if (_disabled || bNoDisable) { + if (_s.useFlashBlock) { + _s.oMC.className = _getSWFCSS() + ' ' + (_s.getMoviePercent() === null?_s.swfCSS.swfTimedout:_s.swfCSS.swfError); + } + _processOnEvents({type:'ontimeout'}); + _debugTS('onload', false); + if (_s.onerror instanceof Function) { + _s.onerror.apply(_win); + } + return false; + } else { + _debugTS('onload', true); + } + _event.add(window, 'unload', _doNothing); // prevent browser from showing cached state via back button, because flash will be dead + if (_s.waitForWindowLoad && !_windowLoaded) { + _wDS('waitOnload'); + _event.add(_win, 'load', _initUserOnload); + return false; + } else { + if (_s.waitForWindowLoad && _windowLoaded) { + _wDS('docLoaded'); + } + _initUserOnload(); + } + return true; + }; + + _addOnEvent = function(sType, oMethod, oScope) { + if (typeof _on_queue[sType] === 'undefined') { + _on_queue[sType] = []; + } + _on_queue[sType].push({ + 'method': oMethod, + 'scope': (oScope || null), + 'fired': false + }); + }; + + _processOnEvents = function(oOptions) { + if (!oOptions) { // assume onready, if unspecified + oOptions = { + type: 'onready' + }; + } + if (!_didInit && oOptions && !oOptions.ignoreInit) { + // not ready yet. + return false; + } + var status = { + success: (oOptions && oOptions.ignoreInit?_s.ok():!_disabled) + }, + srcQueue = (oOptions && oOptions.type?_on_queue[oOptions.type]||[]:[]), // queue specified by type, or none + queue = [], i, j, + canRetry = (_needsFlash && _s.useFlashBlock && !_s.ok()); + for (i = 0; i < srcQueue.length; i++) { + if (srcQueue[i].fired !== true) { + queue.push(srcQueue[i]); + } + } + if (queue.length) { + _s._wD(_sm + ': Firing ' + queue.length + ' '+oOptions.type+'() item' + (queue.length === 1?'':'s')); + for (i = 0, j = queue.length; i < j; i++) { + if (queue[i].scope) { + queue[i].method.apply(queue[i].scope, [status]); + } else { + queue[i].method(status); + } + if (!canRetry) { // flashblock case doesn't count here + queue[i].fired = true; + } + } + } + return true; + }; + + _initUserOnload = function() { + _win.setTimeout(function() { + if (_s.useFlashBlock) { + _flashBlockHandler(); + } + _processOnEvents(); + // call user-defined "onload", scoped to window + if (_s.onload instanceof Function) { + _wDS('onload', 1); + _s.onload.apply(_win); + _wDS('onloadOK', 1); + } + if (_s.waitForWindowLoad) { + _event.add(_win, 'load', _initUserOnload); + } + },1); + }; + + _featureCheck = function() { + var needsFlash, item, + isBadSafari = (!_wl.match(/usehtml5audio/i) && !_wl.match(/sm2\-ignorebadua/i) && _isSafari && _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 + isSpecial = (_ua.match(/iphone os (1|2|3_0|3_1)/i)?true:false); // iPhone <= 3.1 has broken HTML5 audio(), but firmware 3.2 (iPad) + iOS4 works. + if (isSpecial) { + _s.hasHTML5 = false; // has Audio(), but is broken; let it load links directly. + _html5Only = true; // ignore flash case, however + if (_s.oMC) { + _s.oMC.style.display = 'none'; + } + return false; + } + if (_s.useHTML5Audio) { + if (!_s.html5 || !_s.html5.canPlayType) { + _s._wD('SoundManager: No HTML5 Audio() support detected.'); + _s.hasHTML5 = false; + return true; + } else { + _s.hasHTML5 = true; + } + if (isBadSafari) { + _s._wD('SoundManager::Note: Buggy HTML5 Audio in Safari on OS X 10.6.[3|4|5], see https://bugs.webkit.org/show_bug.cgi?id=32159 - disabling HTML5 audio',1); + _s.useHTML5Audio = false; + _s.hasHTML5 = false; + return true; + } + } else { + // flash required. + return true; + } + for (item in _s.audioFormats) { + if (_s.audioFormats.hasOwnProperty(item) && _s.audioFormats[item].required && !_s.html5.canPlayType(_s.audioFormats[item].type)) { + // may need flash for this format? + needsFlash = true; + } + } + // sanity check.. + if (_s.ignoreFlash) { + needsFlash = false; + } + _html5Only = (_s.useHTML5Audio && _s.hasHTML5 && !needsFlash); + return needsFlash; + }; + + _init = function() { + var item, tests = []; + _wDS('init'); + + // called after onload() + if (_didInit) { + _wDS('didInit'); + return false; + } + + function _cleanup() { + _event.remove(_win, 'load', _s.beginDelayedInit); + } + + if (_s.hasHTML5) { + for (item in _s.audioFormats) { + if (_s.audioFormats.hasOwnProperty(item)) { + tests.push(item+': '+_s.html5[item]); + } + } + _s._wD('-- SoundManager 2: HTML5 support tests ('+_s.html5Test+'): '+tests.join(', ')+' --',1); + } + + if (_html5Only) { + if (!_didInit) { + // we don't need no steenking flash! + _cleanup(); + _s.enabled = true; + _initComplete(); + } + return true; + } + + // flash path + _initMovie(); + try { + _wDS('flashJS'); + _s.o._externalInterfaceTest(false); // attempt to talk to Flash + if (!_s.allowPolling) { + _wDS('noPolling', 1); + } else { + _setPolling(true, _s.flashPollingInterval ? _s.flashPollingInterval : (_s.useFastPolling ? 10 : 50)); + } + if (!_s.debugMode) { + _s.o._disableDebug(); + } + _s.enabled = true; + _debugTS('jstoflash', true); + } catch(e) { + _s._wD('js/flash exception: ' + e.toString()); + _debugTS('jstoflash', false); + _failSafely(true); // don't disable, for reboot() + _initComplete(); + return false; + } + _initComplete(); + // event cleanup + _cleanup(); + return true; + }; + + _beginInit = function() { + if (_initPending) { + return false; + } + _createMovie(); + _initMovie(); + _initPending = true; + return true; + }; + + _dcLoaded = function() { + if (_didDCLoaded) { + return false; + } + _didDCLoaded = true; + _initDebug(); + _testHTML5(); + _s.html5.usingFlash = _featureCheck(); + _needsFlash = _s.html5.usingFlash; + _didDCLoaded = true; + if (_doc.removeEventListener) { + _doc.removeEventListener('DOMContentLoaded', _dcLoaded, false); + } + _go(); + return true; + }; + + _startTimer = function(oSound) { + if (!oSound._hasTimer) { + oSound._hasTimer = true; + } + }; + + _stopTimer = function(oSound) { + if (oSound._hasTimer) { + oSound._hasTimer = false; + } + }; + + _die = function() { + if (_s.onerror instanceof Function) { + _s.onerror(); + } + _s.disable(); + }; + + // pseudo-private methods called by Flash + + this._setSandboxType = function(sandboxType) { + // + var sb = _s.sandbox; + sb.type = sandboxType; + sb.description = sb.types[(typeof sb.types[sandboxType] !== 'undefined'?sandboxType:'unknown')]; + _s._wD('Flash security sandbox type: ' + sb.type); + if (sb.type === 'localWithFile') { + sb.noRemote = true; + sb.noLocal = false; + _wDS('secNote', 2); + } else if (sb.type === 'localWithNetwork') { + sb.noRemote = false; + sb.noLocal = true; + } else if (sb.type === 'localTrusted') { + sb.noRemote = false; + sb.noLocal = false; + } + // + }; + + this._externalInterfaceOK = function(flashDate) { + // flash callback confirming flash loaded, EI working etc. + // flashDate = approx. timing/delay info for JS/flash bridge + if (_s.swfLoaded) { + return false; + } + var eiTime = new Date().getTime(); + _s._wD('soundManager::externalInterfaceOK()' + (flashDate?' (~' + (eiTime - flashDate) + ' ms)':'')); + _debugTS('swf', true); + _debugTS('flashtojs', true); + _s.swfLoaded = true; + _tryInitOnFocus = false; + if (_isIE) { + // IE needs a timeout OR delay until window.onload - may need TODO: investigating + setTimeout(_init, 100); + } else { + _init(); + } + }; + + _dcIE = function() { + if (_doc.readyState === 'complete') { + _dcLoaded(); + _doc.detachEvent('onreadystatechange', _dcIE); + } + return true; + }; + + // focus and window load, init + if (!_s.hasHTML5 || _needsFlash) { + // only applies to Flash mode + _event.add(_win, 'focus', _handleFocus); + _event.add(_win, 'load', _handleFocus); + _event.add(_win, 'load', _delayWaitForEI); + if (_isSafari && _tryInitOnFocus) { + _event.add(_win, 'mousemove', _handleFocus); // massive Safari focus hack + } + } + + if (_doc.addEventListener) { + _doc.addEventListener('DOMContentLoaded', _dcLoaded, false); + } else if (_doc.attachEvent) { + _doc.attachEvent('onreadystatechange', _dcIE); + } else { + // no add/attachevent support - safe to assume no JS -> Flash either + _debugTS('onload', false); + _die(); + } + + if (_doc.readyState === 'complete') { + setTimeout(_dcLoaded,100); + } + +} // SoundManager() + +// SM2_DEFER details: http://www.schillmania.com/projects/soundmanager2/doc/getstarted/#lazy-loading +if (typeof SM2_DEFER === 'undefined' || !SM2_DEFER) { + soundManager = new SoundManager(); +} + +// public interfaces +window.SoundManager = SoundManager; // constructor +window.soundManager = soundManager; // public API, flash callbacks etc + +}(window)); diff --git a/js/libs/soundmanager/src/SoundManager2.as b/js/libs/soundmanager/src/SoundManager2.as new file mode 100644 index 0000000..26aa4a9 --- /dev/null +++ b/js/libs/soundmanager/src/SoundManager2.as @@ -0,0 +1 @@ +/* SoundManager 2: Javascript Sound for the Web ---------------------------------------------- http://schillmania.com/projects/soundmanager2/ Copyright (c) 2007, Scott Schiller. All rights reserved. Code licensed under the BSD License: http://www.schillmania.com/projects/soundmanager2/license.txt Flash 8 / ActionScript 2 version Compiling AS to Flash 8 SWF using MTASC (free compiler - http://www.mtasc.org/): mtasc -swf soundmanager2.swf -main -header 16:16:30 SoundManager2.as -version 8 ActionScript Sound class reference (Macromedia), documentation download: http://livedocs.macromedia.com/flash/8/ Previously-live URL: http://livedocs.macromedia.com/flash/8/main/wwhelp/wwhimpl/common/html/wwhelp.htm?context=LiveDocs_Parts&file=00002668.html *** NOTE ON LOCAL FILE SYSTEM ACCESS *** Flash security allows local OR network access, but not both unless explicitly whitelisted/allowed by the flash player's security settings. To enable in-flash messaging for troubleshooting, pass debug=1 in FlashVars (within object/embed code) SM2 will do this by default when soundManager.debugFlash = true. */ import flash.external.ExternalInterface; // woo class SoundManager2 { static var app: SoundManager2; function SoundManager2() { var version = "V2.97a.20110101"; var version_as = "(AS2/Flash 8)"; /* * Cross-domain security options * HTML on foo.com loading .swf hosted on bar.com? Define your "HTML domain" here to allow JS+Flash communication to work. * // allow_xdomain_scripting = true; * // xdomain = "foo.com"; * For all domains (possible security risk?), use xdomain = "*"; which ends up as System.security.allowDomain("*"); * When loading from HTTPS, use System.security.allowInsecureDomain(); * See "allowDomain (security.allowDomain method)" in Flash 8/AS2 liveDocs documentation (AS2 reference -> classes -> security) * download from http://livedocs.macromedia.com/flash/8/ * Related AS3 documentation: http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/system/Security.html#allowDomain%28%29 */ var allow_xdomain_scripting = true; var xdomain = "facebook.com"; if (allow_xdomain_scripting && xdomain) { System.security.allowDomain(xdomain); version_as += ' - cross-domain enabled'; } // externalInterface references (for Javascript callbacks) var baseJSController = "soundManager"; var baseJSObject = baseJSController + ".sounds"; // internal objects var sounds = []; // indexed string array var soundObjects = []; // associative Sound() object array var timer = null; var pollingEnabled = false; // polling (timer) flag - disabled by default, enabled by JS->Flash call var debugEnabled = true; // Flash debug output enabled by default, disabled by JS call var flashDebugEnabled = false; // debug output to flash movie, off by default var didSandboxMessage = false; var caughtFatal = false; // for flash text output, debugging etc. var _messages = []; var _messageObj = null; flashDebugEnabled = (_root.debug == 1); // display stuffs Stage.scaleMode = 'noScale'; Stage.align = 'TL'; // context menu item with version info var doNothing = function() {} var sm2Menu:ContextMenu = new ContextMenu(); var sm2MenuItem:ContextMenuItem = new ContextMenuItem('SoundManager ' + version + ' ' + version_as, doNothing); sm2MenuItem.enabled = false; sm2Menu.customItems.push(sm2MenuItem); _root.menu = sm2Menu; var writeDebug = function(s) { // if (!debugEnabled) return false; ExternalInterface.call(baseJSController + "['_writeDebug']", "(Flash): " + s); // } var flashDebug = function(messageText) { // _messages.push(messageText); if (!flashDebugEnabled) { return false; } var sans = new TextFormat(); sans.size = 12; sans.font = "Arial"; // 320x240 if no stage dimensions (happens in IE, apparently 0 before stage resize event fires.) var w = Stage.width?Stage.width:320; var h = Stage.height?Stage.height:240; if (!_messageObj) { _messageObj = _root.createTextField("_messageObj", 0, 0, 0, w, h); _messageObj.x = 0; _messageObj.y = 0; _messageObj.multiline = true; _messageObj.html = true; _messageObj.wordWrap = true; _messageObj.align = 'left'; _messageObj.autoSize = false; } _messageObj.htmlText = _messages.join('\n'); _messageObj.setTextFormat(sans); _messageObj.width = w; _messageObj.height = h; // } var _externalInterfaceTest = function(isFirstCall) { var sandboxType = System.security['sandboxType']; try { if (isFirstCall) { flashDebug('Testing Flash -> JS...') if (!didSandboxMessage && sandboxType != 'remote' && sandboxType != 'localTrusted') { didSandboxMessage = true; flashDebug('
    Fatal: Security sandbox error: Got "' + sandboxType + '", expected "remote" or "localTrusted".
    Additional security permissions need to be granted.
    See flash security settings panel for non-HTTP, eg. file:// use.

    http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html'); } var d = new Date(); ExternalInterface.call(baseJSController + "._externalInterfaceOK", d.getTime()); if (!didSandboxMessage) { flashDebug('Flash -> JS OK'); } } else { writeDebug('SM2 SWF ' + version + ' ' + version_as); flashDebug('JS -> Flash OK'); writeDebug('JS to/from Flash OK'); ExternalInterface.call(baseJSController + "._setSandboxType", sandboxType); } } catch(e) { flashDebug(e.toString()); if (!caughtFatal) { caughtFatal = true; } return false; } return true; // to verify that a call from JS to here, works. (eg. JS receives "true", thus OK.) } var _disableDebug = function() { // prevent future debug calls from Flash going to client (maybe improve performance) writeDebug('_disableDebug()'); debugEnabled = false; } var checkProgress = function() { var bL = 0; var bT = 0; var nD = 0; var nP = 0; var oSound = null; for (var i = 0, j = sounds.length; i < j; i++) { oSound = soundObjects[sounds[i]]; bL = oSound.getBytesLoaded(); bT = oSound.getBytesTotal(); nD = oSound.duration || 0; // can sometimes be null with short MP3s? Wack. nP = oSound.position; if (bL && bT && bL != oSound.lastValues.bytes) { oSound.lastValues.bytes = bL; ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._whileloading", bL, bT, nD); } if (typeof nP != 'undefined' && nP != oSound.lastValues.position) { oSound.lastValues.position = nP; ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._whileplaying", nP); // if position changed, check for near-end if (oSound.didJustBeforeFinish != true && oSound.loaded == true && oSound.justBeforeFinishOffset > 0 && nD - nP <= oSound.justBeforeFinishOffset) { // fully-loaded, near end and haven't done this yet.. ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._onjustbeforefinish", (nD - nP)); oSound.didJustBeforeFinish = true; } } } } var onLoad = function(bSuccess) { checkProgress(); // ensure progress stats are up-to-date // force duration update (doesn't seem to be always accurate) ExternalInterface.call(baseJSObject + "['" + this.sID + "']._whileloading", this.getBytesLoaded(), this.getBytesTotal(), this.duration); ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onload", this.duration > 0 ? 1 : 0); // bSuccess doesn't always seem to work, so check MP3 duration instead. } var onID3 = function() { // --- NOTE: BUGGY? --- // -------------------- // TODO: Investigate holes in ID3 parsing - for some reason, Album will be populated with Date if empty and date is provided. (?) // ID3V1 seem to parse OK, but "holes" / blanks in ID3V2 data seem to get messed up (eg. missing album gets filled with date.) // iTunes issues: onID3 was not called with a test MP3 encoded with iTunes 7.01, and what appeared to be valid ID3V2 data. // May be related to thumbnails for album art included in MP3 file by iTunes. See http://mabblog.com/blog/?p=33 var id3Data = []; var id3Props = []; for (var prop in this.id3) { id3Props.push(prop); id3Data.push(this.id3[prop]); // writeDebug('id3['+prop+']: '+this.id3[prop]); } ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onid3", id3Props, id3Data); // unhook own event handler, prevent second call (can fire twice as data is received - ID3V2 at beginning, ID3V1 at end.) // Therefore if ID3V2 data is received, ID3V1 is ignored. soundObjects[this.sID].onID3 = null; } var registerOnComplete = function(sID) { soundObjects[sID].onSoundComplete = function() { checkProgress(); this.didJustBeforeFinish = false; // reset ExternalInterface.call(baseJSObject + "['" + sID + "']._onfinish"); } } var _setPosition = function(sID, nSecOffset, isPaused) { var s = soundObjects[sID]; // writeDebug('_setPosition()'); s.lastValues.position = s.position; if (s.lastValues.loops > 1 && nSecOffset != 0) { writeDebug('Warning: Looping functionality being disabled due to Flash limitation.'); s.lastValues.loops = 1; } s.start(nSecOffset, s.lastValues.nLoops || 1); // start playing at new position if (isPaused) s.stop(); } var _load = function(sID, sURL, bStream, bAutoPlay, bCheckPolicyFile) { // writeDebug('_load(): '+sID+', '+sURL+', '+bStream+', '+bAutoPlay); if (typeof bAutoPlay == 'undefined') bAutoPlay = false; if (typeof bStream == 'undefined') bStream = true; if (typeof bCheckPolicyFile == 'undefined') bCheckPolicyFile = false; // writeDebug('bStream: '+bStream); // writeDebug('bAutoPlay: '+bAutoPlay); // checkProgress(); var s = soundObjects[sID]; s.onID3 = onID3; s.onLoad = onLoad; s.loaded = true; s.checkPolicyFile = bCheckPolicyFile; s.loadSound(sURL, bStream); s.didJustBeforeFinish = false; if (bAutoPlay != true) { s.stop(); // prevent default auto-play behaviour } else { writeDebug('auto-play allowed'); } registerOnComplete(sID); } var _unload = function(sID, sURL) { // effectively "stop" loading by loading a tiny MP3 var s = soundObjects[sID]; s.onID3 = null; s.onLoad = null; s.loaded = false; // ensure position is reset, if unload fails s.start(0,1); s.stop(); s.loadSound(sURL, true); s.stop(); // prevent auto-play s.didJustBeforeFinish = false; } var _createSound = function(sID, justBeforeFinishOffset, loops, checkPolicyFile) { var s = new Sound(); if (!soundObjects[sID]) { sounds.push(sID); } soundObjects[sID] = s; s.setVolume(100); s.didJustBeforeFinish = false; s.sID = sID; s.paused = false; s.loaded = false; s.justBeforeFinishOffset = justBeforeFinishOffset || 0; s.checkPolicyFile = checkPolicyFile; s.lastValues = { bytes: 0, position: 0, nLoops: loops||1 }; } var _destroySound = function(sID) { // for the power of garbage collection! .. er, Greyskull! var s = (soundObjects[sID] || null); if (!s) return false; for (var i = 0; i < sounds.length; i++) { if (sounds[i] == sID) { sounds.splice(i, 1); break; } } s = null; delete soundObjects[sID]; } var _stop = function(sID, bStopAll) { // stop this particular instance (or "all", based on parameter) if (bStopAll) { _root.stop(); } else { soundObjects[sID].stop(); soundObjects[sID].paused = false; soundObjects[sID].didJustBeforeFinish = false; } } var _start = function(sID, nLoops, nMsecOffset) { // writeDebug('_start: ' + sID + ', loops: ' + nLoops + ', nMsecOffset: ' + nMsecOffset); registerOnComplete(); var s = soundObjects[sID]; s.lastValues.paused = false; // reset pause if applicable s.lastValues.nLoops = (nLoops || 1); s.start(nMsecOffset, nLoops); } var _pause = function(sID) { // writeDebug('_pause()'); var s = soundObjects[sID]; if (!s.paused) { // reference current position, stop sound s.paused = true; s.lastValues.position = s.position; // writeDebug('_pause(): position: '+s.lastValues.position); s.stop(); } else { // resume playing from last position // writeDebug('resuming - playing at '+s.lastValues.position+', '+s.lastValues.nLoops+' times'); s.paused = false; s.start(s.lastValues.position / 1000, s.lastValues.nLoops); } } var _setPan = function(sID, nPan) { soundObjects[sID].setPan(nPan); } var _setVolume = function(sID, nVol) { soundObjects[sID].setVolume(nVol); } var _setPolling = function(bPolling, timerInterval) { if (typeof timerInterval === 'undefined') { timerInterval = 50; } pollingEnabled = bPolling; if (timer == null && pollingEnabled) { writeDebug('Enabling polling, ' + timerInterval + ' ms interval'); timer = setInterval(checkProgress, timerInterval); } else if (timer && !pollingEnabled) { writeDebug('Disabling polling'); clearInterval(timer); timer = null; } } var _init = function() { // OK now stuff should be available try { flashDebug('Adding ExternalInterface callbacks...'); ExternalInterface.addCallback('_load', this, _load); ExternalInterface.addCallback('_unload', this, _unload); ExternalInterface.addCallback('_stop', this, _stop); ExternalInterface.addCallback('_start', this, _start); ExternalInterface.addCallback('_pause', this, _pause); ExternalInterface.addCallback('_setPosition', this, _setPosition); ExternalInterface.addCallback('_setPan', this, _setPan); ExternalInterface.addCallback('_setVolume', this, _setVolume); ExternalInterface.addCallback('_setPolling', this, _setPolling); ExternalInterface.addCallback('_externalInterfaceTest', this, _externalInterfaceTest); ExternalInterface.addCallback('_disableDebug', this, _disableDebug); ExternalInterface.addCallback('_createSound', this, _createSound); ExternalInterface.addCallback('_destroySound', this, _destroySound); } catch(e) { flashDebug('Fatal: ExternalInterface error: ' + e.toString()); } // try to talk to JS, do init etc. _externalInterfaceTest(true); // flashDebug('Init OK'); } flashDebug('SM2 SWF ' + version + ' ' + version_as); if (ExternalInterface.available) { flashDebug('ExternalInterface available'); _init(); } else { // d'oh! - may be from a corrupt install, ancient (pre-Netscape 6?) browser etc. flashDebug('Fatal: ExternalInterface (Flash <-> JS) not available'); } } // SoundManager2() // entry point static function main(mc) { app = new SoundManager2(); } } \ No newline at end of file diff --git a/js/libs/soundmanager/src/SoundManager2_AS3.as b/js/libs/soundmanager/src/SoundManager2_AS3.as new file mode 100644 index 0000000..98cb387 --- /dev/null +++ b/js/libs/soundmanager/src/SoundManager2_AS3.as @@ -0,0 +1,921 @@ +/* + SoundManager 2: Javascript Sound for the Web + ---------------------------------------------- + http://schillmania.com/projects/soundmanager2/ + + Copyright (c) 2007, Scott Schiller. All rights reserved. + Code licensed under the BSD License: + http://www.schillmania.com/projects/soundmanager2/license.txt + + Flash 9 / ActionScript 3 version +*/ + +package { + + import flash.display.Sprite; + import flash.events.Event; + import flash.events.IOErrorEvent; + import flash.events.MouseEvent; + import flash.events.SecurityErrorEvent; + import flash.events.AsyncErrorEvent; + import flash.events.NetStatusEvent; + import flash.events.TimerEvent; + import flash.external.ExternalInterface; // woo + import flash.media.Sound; + import flash.media.SoundChannel; + import flash.media.SoundMixer; + import flash.net.URLLoader; + import flash.net.URLRequest; + import flash.system.Security; + import flash.system.System; + import flash.text.TextField; + import flash.text.TextFormat; + import flash.text.TextFieldAutoSize; + import flash.ui.ContextMenu; + import flash.ui.ContextMenuItem; + import flash.utils.setInterval; + import flash.utils.clearInterval; + import flash.utils.Dictionary; + import flash.utils.Timer; + + public class SoundManager2_AS3 extends Sprite { + + public var version:String = "V2.97a.20110101"; + public var version_as:String = "(AS3/Flash 9)"; + + /* + * Cross-domain security options + * HTML on foo.com loading .swf hosted on bar.com? Define your "HTML domain" here to allow JS+Flash communication to work. + * // allow_xdomain_scripting = true; + * // xdomain = "foo.com"; + * For all domains (possible security risk?), use xdomain = "*"; which ends up as System.security.allowDomain("*"); + * When loading from HTTPS, use System.security.allowInsecureDomain(); + * See http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/system/Security.html#allowDomain() + */ + public var allow_xdomain_scripting:Boolean = false; + public var xdomain:String = "*"; + + // externalInterface references (for Javascript callbacks) + public var baseJSController:String = "soundManager"; + public var baseJSObject:String = baseJSController + ".sounds"; + + // internal objects + public var sounds:Array = []; // indexed string array + public var soundObjects: Dictionary = new Dictionary(); // associative Sound() object Dictionary type + public var timer: Timer = null; + public var pollingEnabled: Boolean = false; // polling (timer) flag - disabled by default, enabled by JS->Flash call + public var debugEnabled: Boolean = true; // Flash debug output enabled by default, disabled by JS call + public var flashDebugEnabled: Boolean = false; // Flash internal debug output (write to visible SWF in browser) + public var loaded: Boolean = false; + public var currentObject: SoundManager2_SMSound_AS3 = null; + public var paramList:Object = null; + public var messages:Array = []; + public var textField: TextField = null; + public var textStyle: TextFormat = new TextFormat(); + public var didSandboxMessage: Boolean = false; + public var caughtFatal: Boolean = false; + + public function SoundManager2_AS3() { + + if (allow_xdomain_scripting && xdomain) { + Security.allowDomain(xdomain); + version_as += ' - cross-domain enabled'; + } + + this.paramList = this.root.loaderInfo.parameters; + + // + if (this.paramList['debug'] == 1) { + this.flashDebugEnabled = true; + } + + if (this.flashDebugEnabled) { + var canvas: Sprite = new Sprite(); + canvas.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight); + addChild(canvas); + } + // + + flashDebug('SM2 SWF ' + version + ' ' + version_as); + + // context menu item with version info + + var sm2Menu:ContextMenu = new ContextMenu(); + var sm2MenuItem:ContextMenuItem = new ContextMenuItem('SoundManager ' + version + ' ' + version_as); + sm2MenuItem.enabled = false; + sm2Menu.customItems.push(sm2MenuItem); + contextMenu = sm2Menu; + + if (ExternalInterface.available) { + flashDebug('ExternalInterface available'); + try { + flashDebug('Adding ExternalInterface callbacks...'); + ExternalInterface.addCallback('_load', _load); + ExternalInterface.addCallback('_unload', _unload); + ExternalInterface.addCallback('_stop', _stop); + ExternalInterface.addCallback('_start', _start); + ExternalInterface.addCallback('_pause', _pause); + ExternalInterface.addCallback('_setPosition', _setPosition); + ExternalInterface.addCallback('_setPan', _setPan); + ExternalInterface.addCallback('_setVolume', _setVolume); + ExternalInterface.addCallback('_setPolling', _setPolling); + ExternalInterface.addCallback('_externalInterfaceTest', _externalInterfaceTest); + ExternalInterface.addCallback('_disableDebug', _disableDebug); + ExternalInterface.addCallback('_getMemoryUse', _getMemoryUse); + ExternalInterface.addCallback('_createSound', _createSound); + ExternalInterface.addCallback('_destroySound', _destroySound); + ExternalInterface.addCallback('_setAutoPlay', _setAutoPlay); + } catch(e: Error) { + flashDebug('Fatal: ExternalInterface error: ' + e.toString()); + } + } else { + flashDebug('Fatal: ExternalInterface (Flash <-> JS) not available'); + }; + + // call after delay, to be safe (ensure callbacks are registered by the time JS is called below) + var timer: Timer = new Timer(20, 0); + timer.addEventListener(TimerEvent.TIMER, function() : void { + timer.reset(); + _externalInterfaceTest(true); + // timer.reset(); + // flashDebug('Init OK'); + }); + timer.start(); + // delayed, see above + // _externalInterfaceTest(true); + } // SoundManager2() + + public function flashDebug (txt:String) : void { + // + messages.push(txt); + if (this.flashDebugEnabled) { + var didCreate: Boolean = false; + textStyle.font = 'Arial'; + textStyle.size = 12; + // 320x240 if no stage dimensions (happens in IE, apparently 0 before stage resize event fires.) + var w:Number = this.stage.width?this.stage.width:320; + var h:Number = this.stage.height?this.stage.height:240; + if (textField == null) { + didCreate = true; + textField = new TextField(); + textField.autoSize = TextFieldAutoSize.LEFT; + textField.x = 0; + textField.y = 0; + textField.multiline = true; + textField.textColor = 0; + textField.wordWrap = true; + } + textField.htmlText = messages.join('\n'); + textField.setTextFormat(textStyle); + textField.width = w; + textField.height = h; + if (didCreate) { + this.addChild(textField); + } + } + // + } + + public function _setAutoPlay(sID:String, autoPlay:Boolean) : void { + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (s) { + s.setAutoPlay(autoPlay); + } + } + + // methods + // ----------------------------------- + + public function writeDebug (s:String, bTimestamp: Boolean = false) : Boolean { + if (!debugEnabled) return false; + // + ExternalInterface.call(baseJSController + "['_writeDebug']", "(Flash): " + s, null, bTimestamp); + // + return true; + } + + public function _externalInterfaceTest(isFirstCall: Boolean) : Boolean { + var sandboxType:String = flash.system.Security['sandboxType']; + if (!didSandboxMessage && sandboxType != 'localTrusted' && sandboxType != 'remote') { + didSandboxMessage = true; + flashDebug('
    Fatal: Security sandbox error: Got "' + sandboxType + '", expected "remote" or "localTrusted".
    Additional security permissions need to be granted.
    See flash security settings panel for non-HTTP, eg., file:// use.

    http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager04.html'); + } + try { + if (isFirstCall == true) { + flashDebug('Testing Flash -> JS...'); + var d: Date = new Date(); + ExternalInterface.call(baseJSController + "._externalInterfaceOK", d.getTime()); + flashDebug('Flash -> JS OK'); + } else { + writeDebug('SM2 SWF ' + version + ' ' + version_as); + flashDebug('JS -> Flash OK'); + ExternalInterface.call(baseJSController + "._setSandboxType", sandboxType); + writeDebug('JS to/from Flash OK'); + } + } catch(e: Error) { + flashDebug('Fatal: Flash <-> JS error: ' + e.toString()); + writeDebug('_externalInterfaceTest: Error: ' + e.toString()); + if (!caughtFatal) { + caughtFatal = true; + } + return false; + } + return true; // to verify that a call from JS to here, works. (eg. JS receives "true", thus OK.) + } + + public function _disableDebug() : void { + // prevent future debug calls from Flash going to client (maybe improve performance) + writeDebug('_disableDebug()'); + debugEnabled = false; + } + + public function checkLoadProgress(e: Event) : void { + try { + var oSound:Object = e.target; + var bL: int = oSound.bytesLoaded; + var bT: int = oSound.bytesTotal; + var nD: int = oSound.length || oSound.duration || 0; + var sMethod:String = baseJSObject + "['" + oSound.sID + "']._whileloading"; + ExternalInterface.call(sMethod, bL, bT, nD); + if (bL && bT && bL != oSound.lastValues.bytes) { + oSound.lastValues.bytes = bL; + ExternalInterface.call(sMethod, bL, bT, nD); + } + } catch(e: Error) { + writeDebug('checkLoadProgress(): ' + e.toString()); + } + } + + public function checkProgress() : void { + var bL: int = 0; + var bT: int = 0; + var nD: int = 0; + var nP: int = 0; + var bufferLength: int = 0; + var lP:Number = 0; + var rP:Number = 0; + var isBuffering:Object = null; + var oSound: SoundManager2_SMSound_AS3 = null; + var oSoundChannel: flash.media.SoundChannel = null; + var sMethod:String = null; + var newPeakData: Boolean = false; + var newWaveformData: Boolean = false; + var newEQData: Boolean = false; + var areSoundsInaccessible: Boolean = SoundMixer.areSoundsInaccessible(); + var isPlaying: Boolean = true; // special case for NetStream when ending + var hasNew:Boolean = false; + var hasNewLoaded:Boolean = false; + + for (var i: int = 0, j: int = sounds.length; i < j; i++) { + oSound = soundObjects[sounds[i]]; + sMethod = baseJSObject + "['" + sounds[i] + "']._whileloading"; + + if (!oSound || !oSound.useEvents || oSound.failed || !oSound.connected) { + // various cases for ignoring + continue; // if sounds are destructed within event handlers while this loop is running, may be null + } + + if (oSound.useNetstream) { + + // Don't do anything if there is no NetStream object yet + if (!oSound.ns) { + continue; + } + + // stream + bufferLength = oSound.ns.bufferLength; + bL = oSound.ns.bytesLoaded; + bT = oSound.ns.bytesTotal; + nD = int(oSound.duration || 0); // can sometimes be null with short MP3s? Wack. + nP = oSound.ns.time * 1000; + + if (nP != oSound.lastValues.position) { + oSound.lastValues.position = nP; + hasNew = true; + } + if (nD > oSound.lastValues.duration) { + oSound.lastValues.duration = nD; + hasNew = true; + } + if (bL > oSound.lastValues.bytesLoaded) { + oSound.lastValues.bytesLoaded = bL; + hasNew = true; + } + if (bT > oSound.lastValues.bytes) { + oSound.lastValues.bytes = bT; + hasNew = true; + } + if (bufferLength != oSound.lastValues.bufferLength) { + oSound.lastValues.bufferLength = bufferLength; + hasNew = true; + } + + // Don't set loaded for streams because bytesLoaded and bytesTotal are always 0 + // writeDebug('ns: time/duration, bytesloaded/total: '+nP+'/'+nD+', '+bL+'/'+bT); + if (oSound.loaded != true && nD > 0 && bL == bT && bL != 0 && bT != 0) { + // non-MP3 has loaded + oSound.loaded = true; + try { + ExternalInterface.call(sMethod, bL, bT, nD, bufferLength); + ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._onload", oSound.duration > 0 ? 1 : 0); + } catch(e: Error) { + writeDebug('_whileLoading/_onload error: ' + e.toString()); + } + } else if (oSound.loaded != true && hasNew) { + ExternalInterface.call(sMethod, bL, bT, nD, bufferLength); + } + + } else { + + // MP3 sound + oSoundChannel = oSound.soundChannel; + bL = oSound.bytesLoaded; + bT = oSound.bytesTotal; + nD = int(oSound.length || 0); // can sometimes be null with short MP3s? Wack. + isBuffering = oSound.isBuffering; + + if (oSoundChannel) { + nP = (oSoundChannel.position || 0); + if (oSound.lastValues.loops > 1 && nP > oSound.length) { + // round down to nearest loop + var playedLoops:Number = Math.floor(nP/oSound.length); + nP = nP - (oSound.length*playedLoops); + } + if (oSound.usePeakData) { + lP = int((oSoundChannel.leftPeak) * 1000) / 1000; + rP = int((oSoundChannel.rightPeak) * 1000) / 1000; + } else { + lP = 0; + rP = 0; + } + } else { + // stopped, not loaded or feature not used + nP = 0; + } + + if (nP != oSound.lastValues.position) { + oSound.lastValues.position = nP; + hasNew = true; + } + + if (nD > oSound.lastValues.duration) { // original sound duration * number of sound loops + oSound.lastValues.duration = nD; + hasNew = true; + } + if (bL > oSound.lastValues.bytesLoaded) { + oSound.lastValues.bytesLoaded = bL; + hasNew = true; + } + if (bT > oSound.lastValues.bytes) { + oSound.lastValues.bytes = bT; + hasNew = true; + hasNewLoaded = true; + } + + // loading progress + if (hasNewLoaded) { + oSound.lastValues.bytes = bL; + ExternalInterface.call(sMethod, bL, bT, nD); + } + + } + + // peak data + if (oSoundChannel && oSound.usePeakData) { + if (lP != oSound.lastValues.leftPeak) { + oSound.lastValues.leftPeak = lP; + newPeakData = true; + } + if (rP != oSound.lastValues.rightPeak) { + oSound.lastValues.rightPeak = rP; + newPeakData = true; + } + } + + var newDataError:Boolean = false; + var dataError:String; + + // special case: Netstream may try to fire whileplaying() after finishing. check that stop hasn't fired. + isPlaying = (oSound.didLoad && !oSound.paused && (!oSound.useNetstream || (oSound.useNetstream && oSound.lastNetStatus != "NetStream.Play.Stop"))); // don't update if stream has ended + + // raw waveform + EQ spectrum data + if (isPlaying && oSoundChannel) { // || oSound.useNetstream)) { + + if (oSound.useWaveformData) { + if (!areSoundsInaccessible && !oSound.handledDataError && !oSound.ignoreDataError) { + try { + oSound.getWaveformData(); + } catch(e: Error) { + if (!oSound.handledDataError) { + writeDebug('getWaveformData() (waveform data) '+e.toString()); + } + // oSound.useWaveformData = false; + newDataError = true; + dataError = e.toString(); + } + } + } + + if (oSound.useEQData) { + if (!areSoundsInaccessible && !oSound.handledDataError && !oSound.ignoreDataError) { + try { + oSound.getEQData(); + } catch(e: Error) { + if (!oSound.handledDataError) { + writeDebug('computeSpectrum() (EQ data) '+e.toString()); + } + // oSound.useEQData = false; + newDataError = true; + dataError = e.toString(); + } + } + } + + if (oSound.waveformDataArray != oSound.lastValues.waveformDataArray) { + oSound.lastValues.waveformDataArray = oSound.waveformDataArray; + newWaveformData = true; + } + + if (oSound.eqDataArray != oSound.lastValues.eqDataArray) { + oSound.lastValues.eqDataArray = oSound.eqDataArray; + newEQData = true; + } + + if (newDataError && !oSound.handledDataError) { + sMethod = baseJSObject + "['" + sounds[i] + "']._ondataerror"; + ExternalInterface.call(sMethod, 'data unavailable: ' + dataError); + oSound.handledDataError = true; + } + + } + + if (typeof nP != 'undefined' && hasNew) { // && isPlaying - removed to allow updates while paused, eg. from setPosition() calls + + // oSound.lastValues.position = nP; + sMethod = baseJSObject + "['" + sounds[i] + "']._whileplaying"; + var waveDataLeft:String = (newWaveformData ? oSound.waveformDataArray.slice(0, 256).join(',') : null); + var waveDataRight:String = (newWaveformData ? oSound.waveformDataArray.slice(256).join(',') : null); + var eqDataLeft:String = (newEQData ? oSound.eqDataArray.slice(0, 256).join(',') : null); + var eqDataRight:String = (newEQData ? oSound.eqDataArray.slice(256).join(',') : null); + ExternalInterface.call(sMethod, nP, (newPeakData ? { + leftPeak: lP, + rightPeak: rP + } : null), waveDataLeft, waveDataRight, (newEQData ? { + leftEQ: eqDataLeft, + rightEQ: eqDataRight + } : null)); + // if position changed, check for near-end + if (oSound.didJustBeforeFinish != true && oSound.loaded == true && oSound.justBeforeFinishOffset > 0 && nD - nP <= oSound.justBeforeFinishOffset) { + // fully-loaded, near end and haven't done this yet.. + sMethod = baseJSObject + "['" + sounds[i] + "']._onjustbeforefinish"; + ExternalInterface.call(sMethod, (nD - nP)); + oSound.didJustBeforeFinish = true; + } + } + + // check isBuffering + if (!oSound.useNetstream && oSound.isBuffering != oSound.lastValues.isBuffering) { + // property has changed + oSound.lastValues.isBuffering = oSound.isBuffering; + sMethod = baseJSObject + "['" + sounds[i] + "']._onbufferchange"; + ExternalInterface.call(sMethod, oSound.isBuffering ? 1 : 0); + } + + } + + } + + public function onLoadError(oSound:Object) : void { + // something went wrong. 404, bad format etc. + ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._onload", 0); + } + + public function onLoad(e: Event) : void { + checkProgress(); // ensure progress stats are up-to-date + var oSound:Object = e.target; + if (!oSound.useNetstream) { // FLV must also have metadata + oSound.loaded = true; + // force duration update (doesn't seem to be always accurate) + ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._whileloading", oSound.bytesLoaded, oSound.bytesTotal, oSound.length || oSound.duration); + // TODO: Determine if loaded or failed - bSuccess? + // ExternalInterface.call(baseJSObject+"['"+oSound.sID+"']._onload",bSuccess?1:0); + ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._onload", 1); + } + } + + public function onID3(e: Event) : void { + + // --- NOTE: BUGGY (Flash 8 only? Haven't really checked 9 + 10.) --- + // TODO: Investigate holes in ID3 parsing - for some reason, Album will be populated with Date if empty and date is provided. (?) + // ID3V1 seem to parse OK, but "holes" / blanks in ID3V2 data seem to get messed up (eg. missing album gets filled with date.) + // iTunes issues: onID3 was not called with a test MP3 encoded with iTunes 7.01, and what appeared to be valid ID3V2 data. + // May be related to thumbnails for album art included in MP3 file by iTunes. See http://mabblog.com/blog/?p=33 + try { + var oSound:Object = e.target; + + var id3Data:Array = []; + var id3Props:Array = []; + for (var prop:String in oSound.id3) { + id3Props.push(prop); + id3Data.push(oSound.id3[prop]); + // writeDebug('id3['+prop+']: '+oSound.id3[prop]); + } + ExternalInterface.call(baseJSObject + "['" + oSound.sID + "']._onid3", id3Props, id3Data); + // unhook own event handler, prevent second call (can fire twice as data is received - ID3V2 at beginning, ID3V1 at end.) + // Therefore if ID3V2 data is received, ID3V1 is ignored. + // soundObjects[oSound.sID].onID3 = null; + } catch(e: Error) { + writeDebug('onID3(): Unable to get ID3 info for ' + oSound.sID + '.'); + } + oSound.removeEventListener(Event.ID3, onID3); + } + + public function registerOnComplete(sID:String) : void { + var oSound: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (oSound && oSound.soundChannel) { + oSound.soundChannel.addEventListener(Event.SOUND_COMPLETE, function() : void { + if (oSound) { + oSound.didJustBeforeFinish = false; // reset + checkProgress(); + try { + oSound.ignoreDataError = true; // workaround: avoid data error handling for this manual step.. + oSound.start(0, 1); // go back to 0 + oSound.soundChannel.stop(); + } catch(e: Error) { + writeDebug('Could not set position on ' + sID + ': ' + e.toString()); + } + oSound.ignoreDataError = false; // ..and reset + oSound.handledDataError = false; // reset this flag + } + // checkProgress(); + ExternalInterface.call(baseJSObject + "['" + sID + "']._onfinish"); + }); + } + } + + public function doSecurityError(oSound: SoundManager2_SMSound_AS3, e: SecurityErrorEvent) : void { + writeDebug('securityError: ' + e.text); + // when this happens, you don't have security rights on the server containing the FLV file + // a crossdomain.xml file would fix the problem easily + } + + public function _setPosition(sID:String, nSecOffset:Number, isPaused: Boolean) : void { + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (!s) return void; + // writeDebug('_setPosition()'); + + // stop current channel, start new one. + if (s.lastValues) { + s.lastValues.position = nSecOffset; // s.soundChannel.position; + } + if (s.useNetstream) { + // Minimize the buffer so playback starts ASAP + s.setBuffer(s.getStartBuffer()); + writeDebug('setPosition: setting buffer to '+s.ns.bufferTime+' secs'); + + nSecOffset = nSecOffset > 0 ? nSecOffset / 1000 : 0; + writeDebug('setPosition: ' + nSecOffset); + s.ns.seek(nSecOffset); + checkProgress(); // force UI update + } else { + if (s.soundChannel) { + s.soundChannel.stop(); + } + writeDebug('setPosition: ' + nSecOffset); // +', '+(s.lastValues.loops?s.lastValues.loops:1)); + if (s.lastValues.loops > 1 && nSecOffset != 0) { + writeDebug('Warning: Looping functionality being disabled due to Flash limitation.'); + s.lastValues.loops = 1; + } + try { + s.start(nSecOffset, s.lastValues.loops || 1); // start playing at new position + } catch(e: Error) { + writeDebug('Warning: Could not set position on ' + sID + ': ' + e.toString()); + } + checkProgress(); // force UI update + try { + registerOnComplete(sID); + } catch(e: Error) { + writeDebug('_setPosition(): Could not register onComplete'); + } + if (isPaused && s.soundChannel) { + // writeDebug('_setPosition: stopping (paused) sound'); + // writeDebug('last position: '+s.lastValues.position+' vs '+s.soundChannel.position); + s.soundChannel.stop(); + } + } + } + + public function _load(sID:String, sURL:String, bStream: Boolean, bAutoPlay: Boolean, nLoops: Number, bAutoLoad: Boolean, bCheckPolicyFile: Boolean) : void { + // writeDebug('_load()'); + if (typeof bAutoPlay == 'undefined') bAutoPlay = false; + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (!s) return void; + var didRecreate: Boolean = false; + if (s.didLoad == true) { + // need to recreate sound + didRecreate = true; + writeDebug('recreating sound ' + sID + ' in order to load ' + sURL); + var ns:Object = new Object(); + ns.sID = s.sID; + ns.loops = nLoops||1; + ns.justBeforeFinishOffset = s.justBeforeFinishOffset; + ns.usePeakData = s.usePeakData; + ns.useWaveformData = s.useWaveformData; + ns.useEQData = s.useEQData; + ns.useNetstream = s.useNetstream; + ns.bufferTime = s.bufferTime; + ns.bufferTimes = s.bufferTimes; + ns.serverUrl = s.serverUrl; + ns.duration = s.duration; + ns.recordStats = s.recordStats; + ns.checkPolicyFile = s.checkPolicyFile; + ns.useEvents = true; + _destroySound(s.sID); + _createSound(ns.sID, sURL, ns.justBeforeFinishOffset, ns.usePeakData, ns.useWaveformData, ns.useEQData, ns.useNetstream, ns.bufferTime, ns.loops, ns.serverUrl, ns.duration, bAutoPlay, ns.useEvents, ns.bufferTimes, ns.recordStats, bAutoLoad, ns.checkPolicyFile); + s = soundObjects[sID]; + // writeDebug('Sound object replaced'); + } + checkProgress(); + + if (!s.didLoad) { + try { + s.addEventListener(Event.ID3, onID3); + s.addEventListener(Event.COMPLETE, onLoad); + } catch(e: Error) { + writeDebug('_load(): could not assign ID3/complete event handlers'); + } + } + + // don't try to load if same request already made + s.sURL = sURL; + + if (s.useNetstream) { + try { + s.useEvents = true; + } catch(e: Error) { + writeDebug('_load(): error: ' + e.toString()); + } + } else { + try { + s.addEventListener(IOErrorEvent.IO_ERROR, function(e: IOErrorEvent) : void { + s.doIOError(e); + }); + s.loadSound(sURL, bStream); + } catch(e: Error) { + // oh well + writeDebug('_load: Error loading ' + sURL + '. Flash error detail: ' + e.toString()); + } + } + + s.didJustBeforeFinish = false; + } + + public function _unload(sID:String) : void { + var s: SoundManager2_SMSound_AS3 = (soundObjects[sID] || null); + if (!s) return void; + var sURL:String = s.sURL; // save existing sound URL for object recreation + try { + removeEventListener(Event.ID3, onID3); + removeEventListener(Event.COMPLETE, onLoad); + } catch(e: Error) { + writeDebug('_unload() warn: Could not remove ID3/complete events'); + } + s.paused = false; + if (s.soundChannel) { + s.soundChannel.stop(); + } + try { + if (s.didLoad && !s.loaded && !s.useNetstream) { + s.close(); // close stream only if still loading? + } + } catch(e: Error) { + // stream may already have closed if sound loaded, etc. + writeDebug(sID + '._unload(): Note: Unable to close stream: ' + e.toString()); + // oh well + } + // destroy and recreate Flash sound object, try to reclaim memory + // writeDebug('sound._unload(): recreating sound '+sID+' to free memory'); + if (s.useNetstream) { + // writeDebug('_unload(): closing netStream stuff'); + try { + s.removeNetstreamEvents(); + s.ns.close(); + s.nc.close(); + // s.nc = null; + // s.ns = null; + } catch(e: Error) { + // oh well + writeDebug('_unload(): caught exception during netConnection/netStream close'); + } + } + var ns:Object = new Object(); + ns.sID = s.sID; + ns.loops = s.loops; + ns.justBeforeFinishOffset = s.justBeforeFinishOffset; + ns.usePeakData = s.usePeakData; + ns.useWaveformData = s.useWaveformData; + ns.useEQData = s.useEQData; + ns.useNetstream = s.useNetstream; + ns.bufferTime = s.bufferTime; + ns.bufferTimes = s.bufferTimes; + ns.serverUrl = s.serverUrl; + ns.duration = s.duration; + ns.autoPlay = s.autoPlay; + ns.recordStats = s.recordStats; + ns.autoLoad = s.autoLoad; + ns.checkPolicyFile = s.checkPolicyFile; + _destroySound(s.sID); + _createSound(ns.sID, sURL, ns.justBeforeFinishOffset, ns.usePeakData, ns.useWaveformData, ns.useEQData, ns.useNetstream, ns.bufferTime, ns.loops, ns.serverUrl, ns.duration, ns.autoPlay, false, ns.bufferTimes, ns.recordStats, ns.autoLoad, ns.checkPolicyFile); // false: don't allow events just yet + soundObjects[sID].connected = true; // fake it? + writeDebug(s.sID + '.unload(): ok'); + } + + public function _createSound(sID:String, sURL:String, justBeforeFinishOffset: int, usePeakData: Boolean, useWaveformData: Boolean, useEQData: Boolean, useNetstream: Boolean, bufferTime:Number, loops:Number, serverUrl:String, duration:Number, autoPlay:Boolean, useEvents:Boolean, bufferTimes:Array, recordStats:Boolean, autoLoad:Boolean, checkPolicyFile:Boolean) : void { + var s: SoundManager2_SMSound_AS3 = new SoundManager2_SMSound_AS3(this, sID, sURL, usePeakData, useWaveformData, useEQData, useNetstream, bufferTime, serverUrl, duration, autoPlay, useEvents, bufferTimes, recordStats, autoLoad, checkPolicyFile); + if (!soundObjects[sID]) { + sounds.push(sID); + } + soundObjects[sID] = s; + this.currentObject = s; + s.didJustBeforeFinish = false; + s.sID = sID; + s.sURL = sURL; + s.paused = false; + s.loaded = false; + s.justBeforeFinishOffset = justBeforeFinishOffset || 0; + s.checkPolicyFile = checkPolicyFile; + s.lastValues = { + bytes: 0, + position: 0, + loops: loops||1, + leftPeak: 0, + rightPeak: 0, + bufferLength: 0 + }; + } + + public function _destroySound(sID:String) : void { + // for the power of garbage collection! .. er, Greyskull! + var s: SoundManager2_SMSound_AS3 = (soundObjects[sID] || null); + if (!s) return void; + // try to unload the sound + for (var i: int = 0, j: int = sounds.length; i < j; i++) { + if (sounds[i] == sID) { + sounds.splice(i, 1); + break; + } + } + if (s.soundChannel) { + s.soundChannel.stop(); + } + // if is a movie, remove that as well. + if (s.useNetstream) { + // s.nc.client = null; + try { + s.removeNetstreamEvents(); + // s.nc.removeEventListener(NetStatusEvent.NET_STATUS, s.doNetStatus); + } catch(e: Error) { + writeDebug('_destroySound(): Events already removed from netStream/netConnection?'); + } + if (s.didLoad) { + // TODO: figure out if stream is still open first, can't close an already-closed stream. + try { + s.ns.close(); + s.nc.close(); + } catch(e: Error) { + // oh well + writeDebug('_destroySound(): caught exception: '+e.toString()); + } + } + } else if (s.didLoad) { + // non-netstream case + try { + s.close(); // close stream only if still loading? + } catch(e: Error) { + // oh well + } + } + s = null; + soundObjects[sID] = null; + delete soundObjects[sID]; + } + + public function _stop(sID:String, bStopAll: Boolean) : void { + // stop this particular instance (or "all", based on parameter) + if (bStopAll) { + SoundMixer.stopAll(); + } else { + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (!s) return void; + if (s.useNetstream && s.ns) { + s.ns.pause(); + } else if (s.soundChannel) { + s.soundChannel.stop(); + } + s.paused = false; + s.didJustBeforeFinish = false; + } + } + + public function _start(sID:String, nLoops: int, nMsecOffset: int) : void { + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (!s) return void; + writeDebug('start: ' + nMsecOffset+(nLoops?', loops: '+nLoops:'')); + s.lastValues.paused = false; // reset pause if applicable + s.lastValues.loops = (nLoops || 1); + if (!s.useNetstream) { + s.lastValues.position = nMsecOffset; + } + s.handledDataError = false; // reset this flag + try { + s.start(nMsecOffset, nLoops); + } catch(e: Error) { + writeDebug('Could not start ' + sID + ': ' + e.toString()); + } + try { + registerOnComplete(sID); + } catch(e: Error) { + writeDebug('_start(): registerOnComplete failed'); + } + } + + public function _pause(sID:String) : void { + // writeDebug('_pause()'); + var s: SoundManager2_SMSound_AS3 = soundObjects[sID]; + if (!s) return void; + // writeDebug('s.paused: '+s.paused); + if (!s.paused) { + // reference current position, stop sound + s.paused = true; + // writeDebug('_pause(): position: '+s.lastValues.position); + if (s.useNetstream) { + if (s.ns) { + s.lastValues.position = s.ns.time; + s.ns.pause(); + } else if (s.autoPlay) { + s.setAutoPlay(false); + } + } else { + if (s.soundChannel) { + s.lastValues.position = s.soundChannel.position; + s.soundChannel.stop(); + } + } + } else { + // resume playing from last position + // writeDebug('resuming - playing at '+s.lastValues.position+', '+s.lastValues.loops+' times'); + s.paused = false; + if (s.useNetstream) { + s.ns.resume(); + } else { + s.start(s.lastValues.position, s.lastValues.loops); + } + try { + registerOnComplete(sID); + } catch(e: Error) { + writeDebug('_pause(): registerOnComplete() failed'); + } + } + } + + public function _setPan(sID:String, nPan:Number) : void { + if (soundObjects[sID]) { + soundObjects[sID].setPan(nPan); + } + } + + public function _setVolume(sID:String, nVol:Number) : void { + // writeDebug('_setVolume: '+nVol); + if (soundObjects[sID]) { + soundObjects[sID].setVolume(nVol); + } + } + + public function _setPolling(bPolling: Boolean = false, nTimerInterval: uint = 50) : void { + pollingEnabled = bPolling; + if (timer == null && pollingEnabled) { + writeDebug('Enabling polling, ' + nTimerInterval + ' ms interval'); + timer = new Timer(nTimerInterval, 0); + timer.addEventListener(TimerEvent.TIMER, function() : void { + checkProgress(); + }); // direct reference eg. checkProgress doesn't work? .. odd. + timer.start(); + } else if (timer && !pollingEnabled) { + writeDebug('Disabling polling'); + // flash.utils.clearInterval(timer); + timer.reset(); + } + } + + public function _getMemoryUse() : String { + return System.totalMemory.toString(); + } + + // ----------------------------------- + // end methods + + } + + // package + +} \ No newline at end of file diff --git a/js/libs/soundmanager/src/SoundManager2_SMSound_AS3.as b/js/libs/soundmanager/src/SoundManager2_SMSound_AS3.as new file mode 100644 index 0000000..1e2dbc4 --- /dev/null +++ b/js/libs/soundmanager/src/SoundManager2_SMSound_AS3.as @@ -0,0 +1,598 @@ +/* + SoundManager 2: Javascript Sound for the Web + ---------------------------------------------- + http://schillmania.com/projects/soundmanager2/ + + Copyright (c) 2007, Scott Schiller. All rights reserved. + Code licensed under the BSD License: + http://www.schillmania.com/projects/soundmanager2/license.txt + + Flash 9 / ActionScript 3 version +*/ + +package { + + import flash.external.*; + import flash.events.*; + import flash.media.Sound; + import flash.media.SoundChannel; + import flash.media.SoundLoaderContext; + import flash.media.SoundTransform; + import flash.media.SoundMixer; + import flash.net.URLRequest; + import flash.utils.ByteArray; + import flash.utils.getTimer; + import flash.net.NetConnection; + import flash.net.NetStream; + + public class SoundManager2_SMSound_AS3 extends Sound { + + public var sm: SoundManager2_AS3 = null; + // externalInterface references (for Javascript callbacks) + public var baseJSController: String = "soundManager"; + public var baseJSObject: String = baseJSController + ".sounds"; + public var soundChannel: SoundChannel = new SoundChannel(); + public var urlRequest: URLRequest; + public var soundLoaderContext: SoundLoaderContext; + public var waveformData: ByteArray = new ByteArray(); + public var waveformDataArray: Array = []; + public var eqData: ByteArray = new ByteArray(); + public var eqDataArray: Array = []; + public var usePeakData: Boolean = false; + public var useWaveformData: Boolean = false; + public var useEQData: Boolean = false; + public var sID: String; + public var sURL: String; + public var justBeforeFinishOffset: int; + public var didJustBeforeFinish: Boolean; + public var didFinish: Boolean; + public var loaded: Boolean; + public var connected: Boolean; + public var failed: Boolean; + public var paused: Boolean; + public var finished: Boolean; + public var duration: Number; + public var handledDataError: Boolean = false; + public var ignoreDataError: Boolean = false; + public var autoPlay: Boolean = false; + public var autoLoad: Boolean = false; + public var pauseOnBufferFull: Boolean = true; + public var loops: Number = 1; + public var lastValues: Object = { + bytes: 0, + position: 0, + volume: 100, + pan: 0, + loops: 1, + leftPeak: 0, + rightPeak: 0, + waveformDataArray: null, + eqDataArray: null, + isBuffering: null, + bufferLength: 0 + }; + public var didLoad: Boolean = false; + public var useEvents: Boolean = false; + public var sound: Sound = new Sound(); + + public var cc: Object; + public var nc: NetConnection; + public var ns: NetStream = null; + public var st: SoundTransform; + public var useNetstream: Boolean; + public var bufferTime: Number = 3; // previously 0.1 + public var bufferTimes: Array; // an array of integers (for specifying multiple buffers) + public var lastNetStatus: String = null; + public var serverUrl: String = null; + + public var start_time: Number; + public var connect_time: Number; + public var play_time: Number; + public var recordStats: Boolean = false; + public var checkPolicyFile:Boolean = false; + + public function SoundManager2_SMSound_AS3(oSoundManager: SoundManager2_AS3, sIDArg: String = null, sURLArg: String = null, usePeakData: Boolean = false, useWaveformData: Boolean = false, useEQData: Boolean = false, useNetstreamArg: Boolean = false, netStreamBufferTime: Number = 1, serverUrl: String = null, duration: Number = 0, autoPlay: Boolean = false, useEvents: Boolean = false, bufferTimes: Array = null, recordStats: Boolean = false, autoLoad: Boolean = false, checkPolicyFile: Boolean = false) { + this.sm = oSoundManager; + this.sID = sIDArg; + this.sURL = sURLArg; + this.usePeakData = usePeakData; + this.useWaveformData = useWaveformData; + this.useEQData = useEQData; + this.urlRequest = new URLRequest(sURLArg); + this.justBeforeFinishOffset = 0; + this.didJustBeforeFinish = false; + this.didFinish = false; // non-MP3 formats only + this.loaded = false; + this.connected = false; + this.failed = false; + this.finished = false; + this.soundChannel = null; + this.lastNetStatus = null; + this.useNetstream = useNetstreamArg; + this.serverUrl = serverUrl; + this.duration = duration; + this.recordStats = recordStats; + this.useEvents = useEvents; + this.autoLoad = autoLoad; + if (netStreamBufferTime) { + this.bufferTime = netStreamBufferTime; + } + // Use bufferTimes instead of bufferTime + if (bufferTimes !== null) { + this.bufferTimes = bufferTimes; + } else { + this.bufferTimes = [this.bufferTime]; + } + setAutoPlay(autoPlay); + if (recordStats) { + this.start_time = getTimer(); + } + this.checkPolicyFile = checkPolicyFile; + + writeDebug('SoundManager2_SMSound_AS3: Got duration: '+duration+', autoPlay: '+autoPlay); + + if (this.useNetstream) { + + this.cc = new Object(); + this.nc = new NetConnection(); + + // Handle FMS bandwidth check callback. + // @see onBWDone + // @see http://www.adobe.com/devnet/flashmediaserver/articles/dynamic_stream_switching_04.html + // @see http://www.johncblandii.com/index.php/2007/12/fms-a-quick-fix-for-missing-onbwdone-onfcsubscribe-etc.html + this.nc.client = this; + + // TODO: security/IO error handling + // this.nc.addEventListener(SecurityErrorEvent.SECURITY_ERROR, doSecurityError); + nc.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler); + + if (this.serverUrl != null) { + writeDebug('SoundManager2_SMSound_AS3: NetConnection: connecting to server ' + this.serverUrl + '...'); + } + this.nc.connect(serverUrl); + } else { + this.connect_time = this.start_time; + this.connected = true; + } + + } + + public function netStatusHandler(event:NetStatusEvent):void { + + if (this.useEvents) { + writeDebug('netStatusHandler: '+event.info.code); + } + + switch (event.info.code) { + + case "NetConnection.Connect.Success": + writeDebug('NetConnection: connected'); + try { + this.ns = new NetStream(this.nc); + this.ns.checkPolicyFile = this.checkPolicyFile; + // bufferTime reference: http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/net/NetStream.html#bufferTime + this.ns.bufferTime = getStartBuffer(); // set to 0.1 or higher. 0 is reported to cause playback issues with static files. + this.st = new SoundTransform(); + this.cc.onMetaData = this.metaDataHandler; + this.ns.client = this.cc; + this.ns.receiveAudio(true); + this.addNetstreamEvents(); + + this.connected = true; + if (recordStats) { + this.recordConnectTime(); + } + if (this.useEvents) { + writeDebug('firing _onconnect for '+this.sID); + ExternalInterface.call(this.sm.baseJSObject + "['" + this.sID + "']._onconnect", 1); + } + } catch(e: Error) { + this.failed = true; + writeDebug('netStream error: ' + e.toString()); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", 'Connection failed!', event.info.level, event.info.code); + } + break; + + case "NetStream.Play.StreamNotFound": + this.failed = true; + writeDebug("NetConnection: Stream not found!"); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", 'Stream not found!', event.info.level, event.info.code); + break; + + // This is triggered when the sound loses the connection with the server. + // In some cases one could just try to reconnect to the server and resume playback. + // However for streams protected by expiring tokens, I don't think that will work. + // + // Flash says that this is not an error code, but a status code... + // should this call the onFailure handler? + case "NetConnection.Connect.Closed": + this.failed = true; + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", 'Connection closed!', event.info.level, event.info.code); + writeDebug("NetConnection: Connection closed!"); + break; + + // Couldn't establish a connection with the server. Attempts to connect to the server + // can also fail if the permissible number of socket connections on either the client + // or the server computer is at its limit. This also happens when the internet + // connection is lost. + case "NetConnection.Connect.Failed": + this.failed = true; + writeDebug("NetConnection: Connection failed! Lost internet connection? Try again... Description: " + event.info.description); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", 'Connection failed!', event.info.level, event.info.code); + break; + + // A change has occurred to the network status. This could mean that the network + // connection is back, or it could mean that it has been lost...just try to resume + // playback. + + // KJV: Can't use this yet because by the time you get your connection back the + // song has reached it's maximum retries, so it doesn't retry again. We need + // a new _ondisconnect handler. + //case "NetConnection.Connect.NetworkChange": + // this.failed = true; + // writeDebug("NetConnection: Network connection status changed"); + // ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", 'Reconnecting...'); + // break; + + // Consider everything else a failure... + default: + this.failed = true; + writeDebug("NetConnection: got unhandled code '" + event.info.code + "'! Description: " + event.info.description); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", '', event.info.level, event.info.code); + break; + } + + } + + // Set the buffer size on the current NetSream instance to buffer secs + // Only set the buffer if it's different to the current buffer. + public function setBuffer(buffer: int) : void { + if (buffer != this.ns.bufferTime) { + this.ns.bufferTime = buffer; + writeDebug('set buffer to '+this.ns.bufferTime+' secs'); + } + } + + // Return the size of the starting buffer. + public function getStartBuffer() : int { + return this.bufferTimes[0]; + } + + // Return the size of the next buffer, given the size of the current buffer. + // If there are no more buffers, returns the current buffer size. + public function getNextBuffer(current_buffer: int) : int { + var i: int = bufferTimes.indexOf(current_buffer); + if (i == -1) { + // Couldn't find the buffer, start from the start buffer size + return getStartBuffer(); + } else if (i + 1 >= bufferTimes.length) { + // Last (or only) buffer, keep the current buffer + return current_buffer; + } else { + return this.bufferTimes[i+1]; + } + } + + public function writeDebug (s: String, bTimestamp: Boolean = false) : Boolean { + return this.sm.writeDebug (s, bTimestamp); // defined in main SM object + } + + public function metaDataHandler(infoObject: Object) : void { + if (sm.debugEnabled) { + var data:String = new String(); + for (var prop:* in infoObject) { + data += prop+': '+infoObject[prop]+' \n'; + } + writeDebug('Metadata: '+data); + } + this.duration = infoObject.duration * 1000; + if (!this.loaded) { + // writeDebug('not loaded yet: '+this.ns.bytesLoaded+', '+this.ns.bytesTotal+', '+infoObject.duration*1000); + // TODO: investigate loaded/total values + // ExternalInterface.call(baseJSObject + "['" + this.sID + "']._whileloading", this.ns.bytesLoaded, this.ns.bytesTotal, infoObject.duration*1000); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._whileloading", this.bytesLoaded, this.bytesTotal, (infoObject.duration || this.duration)) + } + // null this out for the duration of this object's existence. + // it may be called multiple times. + this.cc.onMetaData = function(infoObject: Object) : void {} + + } + + public function getWaveformData() : void { + // http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/media/SoundMixer.html#computeSpectrum() + SoundMixer.computeSpectrum(this.waveformData, false, 0); // sample wave data at 44.1 KHz + this.waveformDataArray = []; + for (var i: int = 0, j: int = this.waveformData.length / 4; i < j; i++) { // get all 512 values (256 per channel) + this.waveformDataArray.push(int(this.waveformData.readFloat() * 1000) / 1000); + } + } + + public function getEQData() : void { + // http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/media/SoundMixer.html#computeSpectrum() + SoundMixer.computeSpectrum(this.eqData, true, 0); // sample EQ data at 44.1 KHz + this.eqDataArray = []; + for (var i: int = 0, j: int = this.eqData.length / 4; i < j; i++) { // get all 512 values (256 per channel) + this.eqDataArray.push(int(this.eqData.readFloat() * 1000) / 1000); + } + } + + public function start(nMsecOffset: int, nLoops: int) : void { + this.useEvents = true; + if (this.useNetstream) { + + writeDebug("SMSound::start nMsecOffset "+ nMsecOffset+ ' nLoops '+nLoops + ' current bufferTime '+this.ns.bufferTime+' current bufferLength '+this.ns.bufferLength+ ' this.lastValues.position '+this.lastValues.position); + + this.cc.onMetaData = this.metaDataHandler; + + // Don't seek if we don't have to because it destroys the buffer + var set_position:Boolean = this.lastValues.position != null && this.lastValues.position != nMsecOffset; + if (set_position) { + // Minimize the buffer so playback starts ASAP + this.setBuffer(this.getStartBuffer()); + } + + if (this.paused) { + writeDebug('start: resuming from paused state'); + this.ns.resume(); // get the sound going again + if (!this.didLoad) { + this.didLoad = true; + } + this.paused = false; + } else if (!this.didLoad) { + writeDebug('start: !didLoad - playing '+this.sURL); + this.ns.play(this.sURL); + this.pauseOnBufferFull = false; // SAS: playing behaviour overrides buffering behaviour + this.didLoad = true; + this.paused = false; + } else { + // previously loaded, perhaps stopped/finished. play again? + writeDebug('playing again (not paused, didLoad = true)'); + this.ns.play(this.sURL); + } + + // KJV seek after calling play otherwise some streams get a NetStream.Seek.Failed + // Should only apply to the !didLoad case, but do it for all for simplicity. + // nMsecOffset is in milliseconds for streams but in seconds for progressive + // download. + if (set_position) { + this.ns.seek(this.serverUrl ? nMsecOffset / 1000 : nMsecOffset); + this.lastValues.position = nMsecOffset; // https://gist.github.com/1de8a3113cf33d0cff67 + } + + // this.ns.addEventListener(Event.SOUND_COMPLETE, _onfinish); + this.applyTransform(); + + } else { + // writeDebug('start: seeking to '+nMsecOffset+', '+nLoops+(nLoops==1?' loop':' loops')); + this.soundChannel = this.play(nMsecOffset, nLoops); + this.addEventListener(Event.SOUND_COMPLETE, _onfinish); + this.applyTransform(); + } + + } + + private function _onfinish() : void { + this.removeEventListener(Event.SOUND_COMPLETE, _onfinish); + } + + public function loadSound(sURL: String, bStream: Boolean) : void { + if (this.useNetstream) { + this.useEvents = true; + if (this.didLoad != true) { + ExternalInterface.call('loadSound(): loading ' + this.sURL); + this.ns.play(this.sURL); + this.didLoad = true; + } + // this.addEventListener(Event.SOUND_COMPLETE, _onfinish); + this.applyTransform(); + } else { + try { + this.didLoad = true; + this.urlRequest = new URLRequest(sURL); + this.soundLoaderContext = new SoundLoaderContext(1000, this.checkPolicyFile); // check for policy (crossdomain.xml) file on remote domains - http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/flash/media/SoundLoaderContext.html + this.load(this.urlRequest, this.soundLoaderContext); + } catch(e: Error) { + writeDebug('error during loadSound(): ' + e.toString()); + } + } + } + + public function setAutoPlay(autoPlay: Boolean) : void { + if (!this.serverUrl) { + // don't apply to non-RTMP, netstream stuff. + this.autoPlay = true; + this.pauseOnBufferFull = false; + } else { + this.autoPlay = autoPlay; + if (this.autoPlay) { + this.pauseOnBufferFull = false; + // writeDebug('ignoring pauseOnBufferFull because autoPlay is on'); + } else if (!this.autoPlay) { + this.pauseOnBufferFull = true; + // writeDebug('pausing on buffer full because autoPlay is off'); + } + } + } + + public function setVolume(nVolume: Number) : void { + this.lastValues.volume = nVolume / 100; + this.applyTransform(); + } + + public function setPan(nPan: Number) : void { + this.lastValues.pan = nPan / 100; + this.applyTransform(); + } + + public function applyTransform() : void { + var st: SoundTransform = new SoundTransform(this.lastValues.volume, this.lastValues.pan); + if (this.useNetstream) { + if (this.ns) { + this.ns.soundTransform = st; + } else { + // writeDebug('applyTransform(): Note: No active netStream'); + } + } else if (this.soundChannel) { + this.soundChannel.soundTransform = st; // new SoundTransform(this.lastValues.volume, this.lastValues.pan); + } + } + + public function recordPlayTime() : void { + this.play_time = Math.round(getTimer() - (this.start_time + this.connect_time)); + writeDebug('Play took '+ this.play_time + ' ms'); + // We must now have both stats, call the onstats callback + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onstats", { + play_time: this.play_time, + connect_time: this.connect_time + }); + // Stop tracking any stats for this object + this.recordStats = false; + } + + public function recordConnectTime() : void { + this.connect_time = Math.round(getTimer() - this.start_time); + writeDebug('Connect took '+ this.connect_time + ' ms'); + } + + // Handle FMS bandwidth check callback. + // @see http://www.adobe.com/devnet/flashmediaserver/articles/dynamic_stream_switching_04.html + // @see http://www.johncblandii.com/index.php/2007/12/fms-a-quick-fix-for-missing-onbwdone-onfcsubscribe-etc.html + public function onBWDone() : void { + // writeDebug('onBWDone: called and ignored'); + } + + // NetStream client callback. Invoked when the song is complete. + public function onPlayStatus(info:Object):void { + writeDebug('onPlayStatus called with '+info); + switch(info.code) { + case "NetStream.Play.Complete": + writeDebug('Song has finished!'); + break; + } + } + + public function doIOError(e: IOErrorEvent) : void { + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onload", 0); // call onload, assume it failed. + // there was a connection drop, a loss of internet connection, or something else wrong. 404 error too. + } + + public function doAsyncError(e: AsyncErrorEvent) : void { + writeDebug('asyncError: ' + e.text); + } + + public function doNetStatus(e: NetStatusEvent) : void { + + // Handle failures + if (e.info.code == "NetStream.Failed" + || e.info.code == "NetStream.Play.FileStructureInvalid" + || e.info.code == "NetStream.Play.StreamNotFound") { + + this.lastNetStatus = e.info.code; + writeDebug('netStatusEvent: ' + e.info.code); + this.failed = true; + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfailure", '', e.info.level, e.info.code); + return; + } + + writeDebug('netStatusEvent: ' + e.info.code); // KJV we like to see all events + + // When streaming, Stop is called when buffering stops, not when the stream is actually finished. + // @see http://www.actionscript.org/forums/archive/index.php3/t-159194.html + if (e.info.code == "NetStream.Play.Stop") { + + if (!this.useNetstream) { + // finished playing + // this.didFinish = true; // will be reset via JS callback + this.didJustBeforeFinish = false; // reset + writeDebug('calling onfinish for a sound'); + // reset the sound? Move back to position 0? + this.sm.checkProgress(); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfinish"); + } + + } else if (e.info.code == "NetStream.Play.Start" || e.info.code == "NetStream.Buffer.Empty" || e.info.code == "NetStream.Buffer.Full") { + + // First time buffer has filled. Print debugging output. + if (this.recordStats && !this.play_time) { + this.recordPlayTime(); + } + + // RTMP case.. + // We wait for the buffer to fill up before pausing the just-loaded song because only if the + // buffer is full will the song continue to buffer until the user hits play. + if (this.serverUrl && e.info.code == "NetStream.Buffer.Full" && this.pauseOnBufferFull) { + this.ns.pause(); + this.paused = true; + this.pauseOnBufferFull = false; + // Call pause in JS. This will call back to us to pause again, but + // that should be harmless. + writeDebug('Pausing song because buffer is full'); + ExternalInterface.call(baseJSObject + "['" + this.sID + "'].pause", false); + } + + // The buffer is full. Increase its size if possible. + // Double buffering has not been shown to cause false starts, so this is safe. + if (e.info.code == "NetStream.Buffer.Full") { + var next_buffer: int = this.getNextBuffer(this.ns.bufferTime); + if (next_buffer != this.ns.bufferTime) { + this.setBuffer(next_buffer); + } + } + + var isNetstreamBuffering: Boolean = (e.info.code == "NetStream.Buffer.Empty" || e.info.code == "NetStream.Play.Start"); + // assume buffering when we start playing, eg. initial load. + if (isNetstreamBuffering != this.lastValues.isBuffering) { + this.lastValues.isBuffering = isNetstreamBuffering; + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onbufferchange", this.lastValues.isBuffering ? 1 : 0); + } + + // We can detect the end of the stream when Play.Stop is called followed by Buffer.Empty. + // However, if you pause and let the whole song buffer, Buffer.Flush is called followed by + // Buffer.Empty, so handle that case too. + // + // Ignore this event if we are more than 5 seconds from the end of the song. + if (e.info.code == "NetStream.Buffer.Empty" && (this.lastNetStatus == 'NetStream.Play.Stop' || this.lastNetStatus == 'NetStream.Buffer.Flush')) { + if (this.duration && (this.ns.time * 1000) < (this.duration - 5000)) { + writeDebug('Ignoring Buffer.Empty because this is too early to be the end of the stream! (sID: '+this.sID+', time: '+(this.ns.time*1000)+', duration: '+this.duration+')'); + } else { + this.didJustBeforeFinish = false; // reset + this.finished = true; + writeDebug('calling onfinish for sound '+this.sID); + this.sm.checkProgress(); + ExternalInterface.call(baseJSObject + "['" + this.sID + "']._onfinish"); + } + + } else if (e.info.code == "NetStream.Buffer.Empty") { + + // The buffer is empty. Start from the smallest buffer again. + this.setBuffer(this.getStartBuffer()); + } + } + + // Remember the last NetStatus event + this.lastNetStatus = e.info.code; + } + + // KJV The sound adds some of its own netstatus handlers so we don't need to do it here. + public function addNetstreamEvents() : void { + ns.addEventListener(AsyncErrorEvent.ASYNC_ERROR, doAsyncError); + ns.addEventListener(NetStatusEvent.NET_STATUS, doNetStatus); + ns.addEventListener(IOErrorEvent.IO_ERROR, doIOError); + } + + public function removeNetstreamEvents() : void { + ns.removeEventListener(AsyncErrorEvent.ASYNC_ERROR, doAsyncError); + ns.removeEventListener(NetStatusEvent.NET_STATUS, doNetStatus); + ns.addEventListener(NetStatusEvent.NET_STATUS, dummyNetStatusHandler); + ns.removeEventListener(IOErrorEvent.IO_ERROR, doIOError); + // KJV Stop listening for NetConnection events on the sound + nc.removeEventListener(NetStatusEvent.NET_STATUS, netStatusHandler); + } + + // Prevents possible 'Unhandled NetStatusEvent' condition if a sound is being + // destroyed and interacted with at the same time. + public function dummyNetStatusHandler(e: NetStatusEvent) : void { + // Don't do anything + } + } +} \ No newline at end of file diff --git a/js/libs/soundmanager/src/make-flash8.bat b/js/libs/soundmanager/src/make-flash8.bat new file mode 100644 index 0000000..fcab423 --- /dev/null +++ b/js/libs/soundmanager/src/make-flash8.bat @@ -0,0 +1,5 @@ +@REM this builds the soundmanager 2 SWF from source + +mtasc -swf ../swf/soundmanager2_debug.swf -main -header 16:16:30 SoundManager2.as -version 8 +@pause + diff --git a/js/libs/soundmanager/src/make-flash8.sh b/js/libs/soundmanager/src/make-flash8.sh new file mode 100644 index 0000000..8857d15 --- /dev/null +++ b/js/libs/soundmanager/src/make-flash8.sh @@ -0,0 +1,2 @@ +#!/bin/bash +/Applications/mtasc/mtasc -swf ../swf/soundmanager2_debug.swf -main -header 16:16:30 SoundManager2.as -version 8 diff --git a/js/libs/soundmanager/src/make-flash9.bat b/js/libs/soundmanager/src/make-flash9.bat new file mode 100644 index 0000000..ed63934 --- /dev/null +++ b/js/libs/soundmanager/src/make-flash9.bat @@ -0,0 +1,4 @@ +@REM this builds the soundmanager 2 SWF from source +@REM using mxmlc from the Adobe open-source Flex SDK + +c:\progra~1\flexsdk\bin\mxmlc -debug=true -use-network=false -static-link-runtime-shared-libraries=true -optimize=true -o ../swf/soundmanager2_flash9_debug.swf -file-specs SoundManager2_AS3.as diff --git a/js/libs/soundmanager/src/make-flash9.sh b/js/libs/soundmanager/src/make-flash9.sh new file mode 100644 index 0000000..ec6041c --- /dev/null +++ b/js/libs/soundmanager/src/make-flash9.sh @@ -0,0 +1,2 @@ +#!/bin/bash +/Applications/flexsdk/bin/mxmlc -debug=true -static-link-runtime-shared-libraries=true -optimize=true -o ../swf/soundmanager2_flash9_debug.swf -file-specs SoundManager2_AS3.as diff --git a/js/libs/soundmanager/swf/soundmanager2_debug.swf b/js/libs/soundmanager/swf/soundmanager2_debug.swf new file mode 100644 index 0000000..26f834c Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_debug.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_debug3.swf b/js/libs/soundmanager/swf/soundmanager2_debug3.swf new file mode 100644 index 0000000..ca266ae Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_debug3.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash9.swf b/js/libs/soundmanager/swf/soundmanager2_flash9.swf new file mode 100644 index 0000000..a6a7690 Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash9.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash9_debug.swf b/js/libs/soundmanager/swf/soundmanager2_flash9_debug.swf new file mode 100644 index 0000000..2ec0bea Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash9_debug.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2.swf b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2.swf new file mode 100644 index 0000000..741dbd5 Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_debug.swf b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_debug.swf new file mode 100644 index 0000000..26f834c Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_debug.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9.swf b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9.swf new file mode 100644 index 0000000..a6a7690 Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9_debug.swf b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9_debug.swf new file mode 100644 index 0000000..2ec0bea Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain 2/soundmanager2_flash9_debug.swf differ diff --git a/js/libs/soundmanager/swf/soundmanager2_flash_xdomain.zip b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain.zip new file mode 100644 index 0000000..1015353 Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_flash_xdomain.zip differ diff --git a/js/libs/soundmanager/swf/soundmanager2_src.swf b/js/libs/soundmanager/swf/soundmanager2_src.swf new file mode 100644 index 0000000..741dbd5 Binary files /dev/null and b/js/libs/soundmanager/swf/soundmanager2_src.swf differ diff --git a/js/libs/soundmanager/swf/source/soundmanager2.swf b/js/libs/soundmanager/swf/source/soundmanager2.swf new file mode 100644 index 0000000..34c90f3 Binary files /dev/null and b/js/libs/soundmanager/swf/source/soundmanager2.swf differ diff --git a/js/libs/soundmanager/swf/source/soundmanager2_debug.swf b/js/libs/soundmanager/swf/source/soundmanager2_debug.swf new file mode 100644 index 0000000..33ec1eb Binary files /dev/null and b/js/libs/soundmanager/swf/source/soundmanager2_debug.swf differ diff --git a/js/libs/soundmanager/swf/source/soundmanager2_flash9.swf b/js/libs/soundmanager/swf/source/soundmanager2_flash9.swf new file mode 100644 index 0000000..72d8462 Binary files /dev/null and b/js/libs/soundmanager/swf/source/soundmanager2_flash9.swf differ diff --git a/js/libs/soundmanager/swf/source/soundmanager2_flash9_debug.swf b/js/libs/soundmanager/swf/source/soundmanager2_flash9_debug.swf new file mode 100644 index 0000000..ffede89 Binary files /dev/null and b/js/libs/soundmanager/swf/source/soundmanager2_flash9_debug.swf differ diff --git a/js/libs/soundmanager/troubleshoot/debug.css b/js/libs/soundmanager/troubleshoot/debug.css new file mode 100644 index 0000000..7e86358 --- /dev/null +++ b/js/libs/soundmanager/troubleshoot/debug.css @@ -0,0 +1,120 @@ +/* SM2 troubleshooting CSS */ + +#sm2-test { + position:relative; + background:#f6f6f6; + border:1px solid #eee; + padding:3px; +} + +#sm2-test, +#sm2-test ul.items { + -moz-border-radius:3px; + -khtml-border-radius:3px; + -webkit-border-radius:3px; +} + +#sm2-test ul.items { + position:relative; + background:#fff; + list-style-type:none; + margin:0px; + padding:0px; + border:1px solid #ccc; +} + +#sm2-test ul.items li { + position:relative; + margin-left:0.5em; + padding-left:0.5em; + margin-right:0.5em; + padding-right:0.5em; +} + +#sm2-test ul.items li h3 { + padding-top:0.3em; + margin-top:0px; + border-bottom:1px solid #ccc; +} + +#sm2-test ul.items li:last-child h3 { + border-bottom:none; +} + +#sm2-test ul.items li div.details { + border-bottom:1px solid #ccc; +} + +#sm2-test ul.items li:hover div.details { + border-bottom:1px solid #ccc; +} + +#sm2-test ul.items li.open:last-child h3, +#sm2-test ul.items li.fail:last-child h3, +#sm2-test ul.items li:last-child div.details:last-child { + border-bottom:1px solid #fff; +} + +#sm2-test ul.items li div.details { + display:none; +} + +#sm2-test ul.items li.open div.details, +#sm2-test ul.items li.unknown div.details, +#sm2-test ul.items li.fail div.details { + display:block; +} + +#sm2-test ul.items li span.yay, +#sm2-test ul.items li span.boo, +#sm2-test ul.items li span.default, +#sm2-test ul.items li span.unknown { + display:none; +} + +#sm2-test ul.items li span.yay, +#sm2-test ul.items li.pass span.msg { + color:green; +} + +#sm2-test ul.items li span.boo, +#sm2-test ul.items li.fail span.msg { + color:red; +} + +#sm2-test ul.items li span.default, +#sm2-test ul.items li.default span.msg { + color:#ccc; +} + +#sm2-test ul.items li span.unknown, +#sm2-test ul.items li.unknown span.msg { + color:#666; +} + +#sm2-test ul.items li.default span.msg { + display:none; /* hide messages in the event a reset occurs */ +} + +#sm2-test ul.items li.pass span.yay, +#sm2-test ul.items li.fail span.boo, +#sm2-test ul.items li.default span.default, +#sm2-test ul.items li.unknown span.unknown { + float:right; + display:inline; +} + +#sm2-container.flash_debug { + /* flash movie, when soundManager.debugFlash = true */ + position:relative; + width:auto; + height:300px; + width:100%; + background:#f6f6f6; + border:1px solid #ccc; +} + +#sm2-container.flash_debug object, +#sm2-container.flash_debug embed { + border:1px solid #fff; +} \ No newline at end of file diff --git a/js/libs/soundmanager/troubleshoot/debug.js b/js/libs/soundmanager/troubleshoot/debug.js new file mode 100644 index 0000000..052955a --- /dev/null +++ b/js/libs/soundmanager/troubleshoot/debug.js @@ -0,0 +1,173 @@ +// SoundManager 2 start-up troubleshooting tool + +// FlashDetect, by Carl Yestrau +// http://www.featureblend.com/license.txt +var FlashDetect=new function(){var self=this;self.installed=false;self.raw="";self.major=-1;self.minor=-1;self.revision=-1;self.revisionStr="";var activeXDetectRules=[{"name":"ShockwaveFlash.ShockwaveFlash.7","version":function(obj){return getActiveXVersion(obj);}},{"name":"ShockwaveFlash.ShockwaveFlash.6","version":function(obj){var version="6,0,21";try{obj.AllowScriptAccess="always";version=getActiveXVersion(obj);}catch(err){} +return version;}},{"name":"ShockwaveFlash.ShockwaveFlash","version":function(obj){return getActiveXVersion(obj);}}];var getActiveXVersion=function(activeXObj){var version=-1;try{version=activeXObj.GetVariable("$version");}catch(err){} +return version;};var getActiveXObject=function(name){var obj=-1;try{obj=new ActiveXObject(name);}catch(err){} +return obj;};var parseActiveXVersion=function(str){var versionArray=str.split(",");return{"raw":str,"major":parseInt(versionArray[0].split(" ")[1],10),"minor":parseInt(versionArray[1],10),"revision":parseInt(versionArray[2],10),"revisionStr":versionArray[2]};};var parseStandardVersion=function(str){var descParts=str.split(/ +/);var majorMinor=descParts[2].split(/\./);var revisionStr=descParts[3];return{"raw":str,"major":parseInt(majorMinor[0],10),"minor":parseInt(majorMinor[1],10),"revisionStr":revisionStr,"revision":parseRevisionStrToInt(revisionStr)};};var parseRevisionStrToInt=function(str){return parseInt(str.replace(/[a-zA-Z]/g,""),10)||self.revision;};self.majorAtLeast=function(version){return self.major>=version;};self.FlashDetect=function(){if(navigator.plugins&&navigator.plugins.length>0){var type='application/x-shockwave-flash';var mimeTypes=navigator.mimeTypes;if(mimeTypes&&mimeTypes[type]&&mimeTypes[type].enabledPlugin&&mimeTypes[type].enabledPlugin.description){var version=mimeTypes[type].enabledPlugin.description;var versionObj=parseStandardVersion(version);self.raw=versionObj.raw;self.major=versionObj.major;self.minor=versionObj.minor;self.revisionStr=versionObj.revisionStr;self.revision=versionObj.revision;self.installed=true;}}else if(navigator.appVersion.indexOf("Mac")==-1&&window.execScript){var version=-1;for(var i=0;i'+soundManager.url+''; + if (soundManager.getMoviePercent() == 100) { + // SWF may have already loaded + fOnComplete(true,msg); + } else { + try { + xhr.open("HEAD",sURL,true); + xhr.onreadystatechange = function() { + if (xhr.readyState == 4) { + if (xhr.status == '200') { + fOnComplete(true,msg); + } else if (xhr.status == '404') { + fOnComplete(false,msg); + } else { + // some other response + fOnComplete('unknown',(xhr.status != '0'?'HTTP response: '+xhr.status+', ':'')+msg); // safari returns 0 when offline + } + } + } + xhr.send(null); + + } catch(e) { + // fail (cross-domain, or no XHR) unless offline + fOnComplete('unknown',msg); + return false; + } + } + } + + this.handleEvent = function(sEventType,bSuccess,sMessage) { + var o = elements[sEventType]; + if (o) { + o.className = (bSuccess == true?'pass':(bSuccess != false?bSuccess:'fail')); // true = pass, className as argument, or false == fail + if (sMessage) { + var oSpan = o.getElementsByTagName('span')[4]; + if (oSpan) { + oSpan.innerHTML = (oSpan.innerHTML +' '+sMessage+''); + } else { + o.title = sMessage; + } + } + // associated events + if (sEventType == 'onload') { + if (bSuccess) { + self.doSoundTest(); + } else { + self.testURL(soundManager.url,function(bSuccess,sMessage) { + if (typeof sMessage == 'undefined') { + sMessage = null; + } + self.handleEvent('swf',bSuccess,sMessage); + }); + } + } else if (sEventType == 'swf') { + if (bSuccess == false) { + // don't show flashtojs at all if SWF failed to load + self.handleEvent('flashtojs','default'); // reset to N/A status + } + } else if (sEventType == 'flashtojs') { + if (bSuccess != true) { + // online or offline help messages + if (soundManager._overHTTP) { + document.getElementById('d-flashtojs-offline').style.display = 'none'; + } else { + document.getElementById('d-flashtojs-online').style.display = 'none'; + } + } + } + } else { + soundManager._writeDebug('SM2 debugger warning: Undefined event type "'+sEventType+'"',1); + } + } + + this.doSoundTest = function() { + var foo = soundManager.createSound({ + id: 'sm2TestSound', + url: ('http://schillmania.com/projects/soundmanager2/demo/_mp3/mouseover.mp3') + }); + if (!soundManager._disabled) { + foo.play(); + // looks to be OK.. + if (!soundManager._disabled) { + // still OK.. + self.handleEvent('soundtest',true); + } else { + self.handleEvent('soundtest',false,': Failed after play()'); + } + } else { + self.handleEvent('soundtest',false,': Failed after createSound()'); + } + } + + this.init = function() { + // map event elements to DOM nodes - eg. elements.flashtojs = document.getElementById('d-flashtojs'); + for (var i=elementIDs.length; i--;) { + elements[elementIDs[i]] = document.getElementById('d-'+elementIDs[i]); + } + self.doFlashTest(); + } + + this.doFlashTest = function() { + var fd = FlashDetect; + var hasFlash = fd.installed; + var isSupported = (hasFlash && fd.major >= soundManager.flashVersion); + var flashVersion = fd.major+'.'+fd.minor+'.'+fd.revisionStr; + var flashInfo = ' version '+(!isSupported?'unsupported ('+flashVersion+', SWF version '+soundManager.flashVersion+')':flashVersion); + document.getElementById('d-flashversion').innerHTML = 'soundManager.flashVersion = '+soundManager.flashVersion+';'; + self.handleEvent('hasflash',isSupported,hasFlash?flashInfo:null); + } + + soundManager.debugFlash = true; // try to get flash debug output, as well + + this.init(); + +} + +function sm2DebugInit() { + sm2Debugger = new SM2Debugger(); +} \ No newline at end of file diff --git a/js/libs/soundmanager/troubleshoot/fpgss-add-location.png b/js/libs/soundmanager/troubleshoot/fpgss-add-location.png new file mode 100644 index 0000000..61db61c Binary files /dev/null and b/js/libs/soundmanager/troubleshoot/fpgss-add-location.png differ diff --git a/js/libs/soundmanager/troubleshoot/fpgss-added-location.png b/js/libs/soundmanager/troubleshoot/fpgss-added-location.png new file mode 100644 index 0000000..6cf1c19 Binary files /dev/null and b/js/libs/soundmanager/troubleshoot/fpgss-added-location.png differ diff --git a/js/libs/soundmanager/troubleshoot/index.html b/js/libs/soundmanager/troubleshoot/index.html new file mode 100644 index 0000000..ff118cc --- /dev/null +++ b/js/libs/soundmanager/troubleshoot/index.html @@ -0,0 +1,154 @@ + + + +SoundManager 2 Start-up Test / Troubleshooting Tool + + + + + + + + + + + + + + + + + + + + + + + +
    + +

    Flash options: Flash 8 (default), Flash 9 (normal) or Flash 9 + highPerformance + fastPolling modes.

    + +
    +
      + +
    • +

      OKFAILN/AUnknownSoundManager 2 start-up

      +
      +

      soundManager.onload() or soundManager.onerror() is ultimately called when start-up completes.

      +

      If you're seeing a failure, refer to the below for troubleshooting details for common causes.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash

      +
      +

      The Flash 8 plugin is a minimal requirement for SoundManager 2, but the exact requirement varies based on soundManager.flashVersion. You are currently using [unknown].

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash SWF

      +
      +

      SoundManager 2 must load a flash movie before initialisation can proceed. If you have errors here, check that soundManager.url is correctly defined and that the URL being loaded is correct.

      +

      If the Flash movie URL is OK, Flash security or flash blockers are the likely cause. Check the section below.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownFlash -> JS

      +
      +

      Once the flash component of SM2 has loaded, it tries to make a call to Javascript-land. This is a common point of failure, for security reasons:

      +
        +
      • +

        Have a flash blocker? Check that the SM2 flash movie (below) is loading and is not being blocked.

        +
      • +
      • + Is your browser URL at file:// or c:/path/ or otherwise not using HTTP? Flash security "whitelisting" is required to allow Flash + JS to work when offline, placing it in the "LocalTrusted" Flash security sandbox rather than "localWithFile". + +
        +

        Offline viewing: Adding a "trusted location" to the Flash Security Settings Panel

        +

        The Flash Player Global Security Settings Panel is a web-based control panel which allows you to configure Flash security. You will need to add the path of the SoundManager 2 project in order for it to work "offline" (ie., when viewing via file:// or c:/)

        +

        Show me how: Adding a "trusted location"

        + +

        Launch the Flash Security Settings Panel

        +
        + +
      • +
      • Flash blockers (FlashBlock, "click to flash" etc.) preventing flash load and start-up - need whitelisting/"allow this domain" to work smoothly. If you suspect blocking is the issue, try the SoundManager 2 Flashblock demo.
      • +
      • Online viewing (HTTP/S): Same-domain security rules apply to HTML + Flash content by default (crossdomain.xml/allowDomain() in .AS source required to override.)
      • +
      +

      See Flash debug output for more security error details.

      + +
      +

      Online viewing: Cross-domain security restrictions

      +

      HTML page on domain A loading .SWF from domain B: Flash security prevents JS + Flash when a cross-domain XML permission file is not available on domain B, and/or flash movie was not compiled with allowDomain('domainA') or allowDomain('*') - note that the SWF distributed with SM2 does not use this by default; try using the cross-domain version of the SWF, or compile your own which whitelists your own domain(s).

      + +

      Flash Blockers

      +

      Browser extensions/add-ons like "FlashBlock" and "click to flash" can prevent the .SWF from loading, and this will mean SM2 will time-out and fail waiting for a response from Flash. For development, it's best to whitelist the domain(s) or the .SWF for SM2 to allow it to work.

      +

      Have a flash blocker installed? Want to test it? Try the SoundManager 2 Flashblock demo.

      + +
      + +
      +
    • + +
    • +

      OKErrorN/AUnknownJS -> Flash

      +
      +

      At this point, Javascript attempts to respond to Flash's initial outgoing Flash -> JS call, completing the test for JS/flash communication. If SM2 does not receive a response from flash, it will eventually fail.

      +

      Offline viewing conditions and cross-domain security rules will prevent Flash <-> JS communication. See the details of Flash -> JS for information.

      +
      +
    • + +
    • +

      OKErrorN/AUnknownSound test

      +
      +

      Here, a simple createSound() call is made to test SM2's actual operation. A sound should load and play provided SM2 was able to start successfully.

      +
      +
    • + +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    + + + +
    + + diff --git a/js/main.js b/js/main.js index 24dfbe0..48117be 100644 --- a/js/main.js +++ b/js/main.js @@ -1,47 +1,129 @@ -var keys = {}; - -function controlship() { - for (var i in keys) { - - //a pressed - if (i == 65) { - $('#ship').css('left', (parseInt($('#ship').css('left'),10) - 10) + 'px'); - - } - // s pressed - if (i == 83) { - $('#ship').css('top', (parseInt($('#ship').css('top'),10) + 10) + 'px'); - } - // d pressed - if (i == 68) { - $('#ship').css('left', (parseInt($('#ship').css('left'),10) + 10) + 'px'); - } - // w pressed - if (i == 87) { - $('#ship').css('top', (parseInt($('#ship').css('top'),10) - 10) + 'px'); - } - } - - -} - -$(document).keydown(function (evt) { - var code = evt.keyCode || evt.which; - keys[code] = true; -}); - -$(document).keyup(function (evt) { - var code = evt.keyCode || evt.which; - delete keys[code]; - +var Game = new app({ + 'layers': [ + 'order!layouts/BgLayer', + 'order!layouts/PlayerLayer', + 'order!layouts/Ennemies' + ], + 'wrapper': $('#GameContainer') +}) ; + +// Init Application and bind all games events +jQuery(document).ready(function() { + + /************************************************************************** + * Load Dependencies & Create Application + ***************************************************************************/ + var baseLibs = [ + 'order!libs/jquery.transform-0.9.3.min', + 'order!layouts/LayoutClass' + ], + GameVersion = $('#version').html() ; + + require({ + baseUrl: "js/", + urlArgs: "bust=" + GameVersion + }, + baseLibs, + + // -- All objects are loaded => can run + function() { + + // -- Init Stage or show IE popup + if ( ! $.browser.msie || ( $.browser.version >= 9 ) ) { + Game.init() ; + } else { + alert('Sorry but this game only works in good navigators. Please download Google Chrome or Firefox' ) ; + } + + } + ); + + + /************************************************************************** + * Game Controls Events + ***************************************************************************/ + + // -- Game is loaded + $(document).bind('gameLoaded', function(e, res) { + + }); + + // -- Init Game + $(document).bind('gameInit', function(e, res) { + $(document).trigger('gameReset') ; + }) ; + + // -- Game Reset + $(document).bind('gameReset', function(e, res) { + Game.score = 0 ; + Game.loops = 0 ; + Layouts.Ennemies.els = [] ; + $('.sprite').remove() ; + $.each(Layouts, function(key, val){ + Layouts[key].running = true ; + $.each(val.els, function(key2, val2){ + if ( Layouts[key].els.length && Layouts[key].els[key2] ) { + Layouts[key].els[key2].x = Layouts[key].els[key2].settings.origin.x ; + Layouts[key].els[key2].y = Layouts[key].els[key2].settings.origin.y ; + } + }) ; + }) ; + + $('#ground, #ship').fadeTo(500, 1) ; + + if ( timers.loopGame ) clearInterval(timers.loopGame) ; + timers.loopGame = setInterval(Game.loopAnimation, 1000/FPS) ; + }) ; + + // -- Start Animation + $(document).bind('gameStart', function(e, res) { + + $('#hud').fadeIn(500) ; + + if ( timers.loopGame ) clearInterval(timers.loopGame) ; + timers.loopGame = setInterval(Game.loopAnimation, 1000/FPS) ; + }) ; + + // -- On Complete Launch + $(document).bind('gameComplete', function(e, res) { + + // -- Stop layouts running + $('.sprite').not('.explosion').remove() ; + Layouts.Ennemies.running = false ; + Layouts.Background.running = false ; + + // -- Show game over overlay + $('#game-over:hidden').fadeIn(500) ; + $('#ground, #ship').fadeTo(500, 0.2) ; + + // -- Stop loopAnimation + if ( timers.loopGame ) clearInterval(timers.loopGame) ; + + }) ; + + + // -- Bind Start Button + $('#start-game').click(function() { + $('#game-intro:visible').fadeOut(500, function() { + $(document).trigger('gameStart') ; + }) ; + }).hover(function() { + $(this).addClass('hover') ; + }, function() { + $(this).removeClass('hover') ; + }) ; + + + // -- Bind Restart Screen controls + $('#restart-game').click(function() { + $('#game-over:visible').fadeOut(500, function() { + $(document).trigger('gameReset') ; + }) ; + }).hover(function() { + $(this).addClass('hover') ; + }, function() { + $(this).removeClass('hover') ; + }) ; -}); - -function onTimerTick() { - controlship(); -} - -setInterval(onTimerTick, 33); // 33 milliseconds = ~ 30 frames per sec - - +}) ; \ No newline at end of file diff --git a/js/sounds.load.js b/js/sounds.load.js new file mode 100644 index 0000000..ae6c65f --- /dev/null +++ b/js/sounds.load.js @@ -0,0 +1,103 @@ + + /************************************************************************** + * SOUNDMANAGER CONFIG + ***************************************************************************/ + soundManager.useFlashBlock = false; + soundManager.bgColor = '#ffffff'; + soundManager.debugMode = false; + soundManager.url = 'http://patator.socialmixmedia.fr/assets/js/soundmanager/swf/'; + soundManager.wmode = 'transparent'; // hide initial flash of white on everything except firefox/win32 + soundManager.allowScriptAccess = 'always'; + soundManager.useFastPolling = true; + soundManager.flashVersion = 9; + soundManager.flashLoadTimeout = 3000; + soundManager.useHTML5Audio = true; + + // -- when ready, preload sounds + soundManager.onready(function() { + + + // -- Click + soundManager.createSound({ + id: 'click', + url: '/assets/mp3/50559__broumbroum__sf3_sfx_menu_select_L.ogg', + autoLoad: true, + autoPlay: false, + multiShot: false, + volume: 50 + }); + + // -- Validate + soundManager.createSound({ + id: 'validate', + url: '/assets/mp3/50562__broumbroum__sf3_sfx_menu_validate_L.ogg', + autoLoad: true, + autoPlay: false, + multiShot: false, + volume: 50 + }); + + + // -- Boom + soundManager.createSound({ + id: 'boom', + url: '/assets/mp3/boom.ogg', + autoLoad: true, + autoPlay: false, + volume: 50 + }); + + // -- Touch + soundManager.createSound({ + id: 'touch', + url: '/assets/mp3/hopping.ogg', + autoLoad: true, + autoPlay: false, + volume: 50 + }); + + // -- End + soundManager.createSound({ + id: 'endGame', + url: '/assets/mp3/fall-explosion.ogg', + autoLoad: true, + autoPlay: false, + volume: 50 + }); + + // -- Nitro + soundManager.createSound({ + id: 'nitro', + url: '/assets/mp3/rocket-burn.ogg', + autoLoad: true, + autoPlay: false, + loops: 10, + volume: 50 + }); + + + // -- Mad Cow + soundManager.createSound({ + id: 'cow', + url: '/assets/mp3/cow.ogg', + autoLoad: true, + autoPlay: false, + volume: 50 + }); + + // -- Wizz + soundManager.createSound({ + id: 'wizz', + url: '/assets/mp3/siren.ogg', + autoLoad: true, + autoPlay: false, + volume: 50 + }); + + }); + + soundManager.ontimeout(function() { + var smLoadFailWarning = 'Oh snap! : ' + (soundManager.hasHTML5 ? 'The flash portion of ' : '') + 'SoundManager 2 was unable to start. '; + _log(smLoadFailWarning) ; + }); + \ No newline at end of file