Mercurial > hg > env-test-daniele

annotate audio1.html @ 25:4a4bd554b4c1 tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Closing this sub branch.
author Daniele Barchiesi <daniele.barchiesi@eecs.qmul.ac.uk>
date Mon, 25 Mar 2013 14:02:54 +0000
parents 032bc65ebafc
children
rev   line source
gyorgy@0 1 <!DOCTYPE html>
gyorgy@0 2 <html>
gyorgy@0 3 <head>
gyorgy@0 4
gyorgy@0 5
gyorgy@0 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
gyorgy@0 7 <title>HTML5 MediaElement</title>
gyorgy@0 8
gyorgy@0 9 <script src="build/jquery.js"></script>
gyorgy@0 10 <script src="build/mediaelement-and-player.min.js"></script>
gyorgy@0 11 <link rel="stylesheet" href="build/mediaelementplayer.min.css" />
gyorgy@0 12 </head>
gyorgy@0 13 <body>
gyorgy@0 14
gyorgy@0 15 <h1>MediaElementPlayer.js</h1>
gyorgy@0 16
gyorgy@0 17 <p>Audio player</p>
gyorgy@0 18
gyorgy@0 19 <h2>MP3</h2>
gyorgy@0 20
gyorgy@0 21 <audio id="player1" controls="controls">
gyorgy@0 22 <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test1a.mp3" type="audio/mpeg" />
gyorgy@0 23 <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test1a.ogg" type="audio/ogg" />
gyorgy@0 24
gyorgy@0 25 <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ia.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ia.mp3" /></object>
gyorgy@0 26
gyorgy@0 27 </audio>
gyorgy@0 28 <div id="default_player_fallback"></div>
gyorgy@0 29
gyorgy@0 30 <script>
gyorgy@0 31 if (document.createElement('audio').canPlayType) {
gyorgy@0 32 if (!document.createElement('audio').canPlayType('audio/mpeg') &&
gyorgy@0 33 !document.createElement('audio').canPlayType('audio/ogg')) {
gyorgy@0 34 swfobject.embedSWF("player_mp3_mini.swf", "default_player_fallback", "200", "20", "9.0.0", "", {"mp3":"http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ia.mp3"}, {"bgcolor":"#085c68"});
gyorgy@0 35 swfobject.embedSWF("player_mp3_mini.swf", "custom_player_fallback", "200", "20", "9.0.0", "", {"mp3":"http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ia.mp3"}, {"bgcolor":"#085c68"});
gyorgy@0 36 document.getElementById('audio_with_controls').style.display = 'none';
gyorgy@0 37 }
gyorgy@0 38 else { // HTML5 audio + mp3 support
gyorgy@0 39 document.getElementById('player').style.display = 'block';
gyorgy@0 40 }
gyorgy@0 41 }
gyorgy@0 42 </script>
gyorgy@0 43 </audio>
gyorgy@0 44
gyorgy@0 45 <audio id="player2" controls="controls">
gyorgy@0 46 <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3" type="audio/mpeg" />
gyorgy@0 47 <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.ogg" type="audio/ogg" />
gyorgy@0 48
gyorgy@0 49 <object class="playerpreview" type="application/x-shockwave-flash" data="player_mp3_mini.swf" width="200" height="20"><param name="movie" value="player_mp3_mini.swf" /><param name="bgcolor" value="#085c68" /><param name="FlashVars" value="mp3=http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3" /><embed href="player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3" /></object>
gyorgy@0 50
gyorgy@0 51 </audio>
gyorgy@0 52 <div id="default_player_fallback"></div>
gyorgy@0 53
gyorgy@0 54 <script>
gyorgy@0 55 if (document.createElement('audio').canPlayType) {
gyorgy@0 56 if (!document.createElement('audio').canPlayType('audio/mpeg') &&
gyorgy@0 57 !document.createElement('audio').canPlayType('audio/ogg')) {
gyorgy@0 58 swfobject.embedSWF("player_mp3_mini.swf", "default_player_fallback", "200", "20", "9.0.0", "", {"mp3":"http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3"}, {"bgcolor":"#085c68"});
gyorgy@0 59 swfobject.embedSWF("player_mp3_mini.swf", "custom_player_fallback", "200", "20", "9.0.0", "", {"mp3":"http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3"}, {"bgcolor":"#085c68"});
gyorgy@0 60 document.getElementById('audio_with_controls').style.display = 'none';
gyorgy@0 61 }
gyorgy@0 62 else { // HTML5 audio + mp3 support
gyorgy@0 63 document.getElementById('player').style.display = 'block';
gyorgy@0 64 }
gyorgy@0 65 }
gyorgy@0 66 </script>
gyorgy@0 67 </audio>
gyorgy@0 68
gyorgy@0 69
gyorgy@0 70
gyorgy@0 71
gyorgy@0 72 <script>
gyorgy@0 73 $('audio,video').mediaelementplayer();
gyorgy@0 74 </script>
gyorgy@0 75
gyorgy@0 76 </body>
gyorgy@0 77 </html>
gyorgy@0 78