Mercurial > hg > env-test-daniele

diff audio1.html @ 0:032bc65ebafc

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
added core components
author George Fazekas <gyorgy.fazekas@eecs.qmul.ac.uk>
date Wed, 06 Mar 2013 15:45:48 +0000
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/audio1.html	Wed Mar 06 15:45:48 2013 +0000
@@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html>
+<head>
+
+	
+	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+	<title>HTML5 MediaElement</title>	
+	
+	<script src="build/jquery.js"></script>	
+	<script src="build/mediaelement-and-player.min.js"></script>
+	<link rel="stylesheet" href="build/mediaelementplayer.min.css" />
+</head>
+<body>
+
+<h1>MediaElementPlayer.js</h1>
+
+<p>Audio player</p>
+
+<h2>MP3</h2>
+
+<audio id="player1" controls="controls">
+    <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test1a.mp3" type="audio/mpeg" />
+    <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test1a.ogg" type="audio/ogg" />	
+
+	  <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>
+
+  </audio>
+  <div id="default_player_fallback"></div>
+
+  <script>
+  if (document.createElement('audio').canPlayType) {
+    if (!document.createElement('audio').canPlayType('audio/mpeg') &&
+        !document.createElement('audio').canPlayType('audio/ogg')) {
+      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"});
+      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"});
+      document.getElementById('audio_with_controls').style.display = 'none';
+    }
+    else { // HTML5 audio + mp3 support
+      document.getElementById('player').style.display = 'block';
+    }
+  }
+  </script>
+</audio>	
+
+<audio id="player2" controls="controls">
+    <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.mp3" type="audio/mpeg" />
+    <source src="http://webspace.qmul.ac.uk/twilmering/fxo_audio/test%ib.ogg" type="audio/ogg" />	
+
+	  <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>
+
+  </audio>
+  <div id="default_player_fallback"></div>
+
+  <script>
+  if (document.createElement('audio').canPlayType) {
+    if (!document.createElement('audio').canPlayType('audio/mpeg') &&
+        !document.createElement('audio').canPlayType('audio/ogg')) {
+      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"});
+      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"});
+      document.getElementById('audio_with_controls').style.display = 'none';
+    }
+    else { // HTML5 audio + mp3 support
+      document.getElementById('player').style.display = 'block';
+    }
+  }
+  </script>
+</audio>
+
+
+
+
+<script>
+$('audio,video').mediaelementplayer();
+</script>
+
+</body>
+</html>
+