Javascript - MP3 Player - Sound


/ Published in: JavaScript
Save to your folder(s)

aditional files:
mp3/uno.mp3
mp3/dos.mp3
mp3/tres.mp3
mp3/cuatro.mp3
images/ico_on.gif
images/ico_off.gif

note: for example Firefox require plugin (tag node ).


Copy this code and paste it in your HTML
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>HTML PLAYER</title>
  6.  
  7. <script>
  8.  
  9.  
  10.  
  11. function MM_findObj(n, d) { //v4.01
  12. var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
  13. d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  14. if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  15. for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  16. if(!x && d.getElementById) x=d.getElementById(n); return x;
  17. }
  18.  
  19. /*Namespaces*/
  20. var Media = document.Media || {};
  21. // funciones para cookies
  22.  
  23. Media.PlaySound = {
  24. MSIE: navigator.userAgent.indexOf("MSIE"),
  25. NETS: navigator.userAgent.indexOf("Netscape"),
  26. OPER: navigator.userAgent.indexOf("Opera"),
  27. cookieNameActive: "cookie_sound_active",
  28. cookieNameThisSound: "cookie_this_sound",
  29. imgOn: "images/ico_on.gif",
  30. imgOff: "images/ico_off.gif",
  31. SoundDefault: 1,
  32. Sounds: {
  33. 0:{"file":"mp3/uno.mp3","name":"UNO"},
  34. 1:{"file":"mp3/dos.mp3","name":"DOS"},
  35. 2:{"file":"mp3/tres.mp3","name":"TRES"},
  36. 3:{"file":"mp3/cuatro.mp3","name":"CUATRO"}
  37. },
  38. SoundStop: "mp3/silence.mp3",
  39. WriteCookie: function( name, value ){
  40. var expdate=new Date();
  41. expdate.setTime(expdate.getTime()+10*365*24*60*60*1000);
  42. document.cookie = name + "=" + escape (value) + "; expires=" + expdate.toGMTString();
  43. },
  44. EliminarElemento: function(elemento) {
  45. elemento.parentNode.removeChild(elemento);
  46. },
  47. ReadCookie: function( name ){
  48. var namearg = name + "=";
  49. var nlen = namearg.length;
  50. var clen = document.cookie.length;
  51. var i = 0;
  52. while (i < clen) {
  53. var j = i + nlen;
  54. if (document.cookie.substring(i, j) == namearg) {
  55. var endpos = document.cookie.indexOf (";", j);
  56. if (endpos == -1) endpos = document.cookie.length;
  57. return unescape(document.cookie.substring(j, endpos));
  58. }
  59. i = document.cookie.indexOf(" ", i) + 1;
  60. if (i == 0) break;
  61. }
  62. return null;
  63. },
  64. OnOffSound: function( img ){
  65. newValue = Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == 1 || Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == null ? 0 : 1;
  66. img.src = newValue == 1 ? Media.PlaySound.imgOn : Media.PlaySound.imgOff;
  67. objInfo = MM_findObj("MediaMyMediaDivInfo");
  68. if( newValue == 0 ){
  69. Media.PlaySound.Stop();
  70. objInfo.innerHTML = 'Mute';
  71. Media.PlaySound.WriteCookie( Media.PlaySound.cookieNameActive, newValue );
  72. }else{
  73. Media.PlaySound.WriteCookie( Media.PlaySound.cookieNameActive, newValue );
  74. Media.PlaySound.Play();
  75. }
  76.  
  77. },
  78. Init: function(){
  79. if((Media.PlaySound.MSIE>-1) || (Media.PlaySoundOPER>-1)) {
  80. document.write('<bgsound loop="0" name="MediaMyMediaObj" id="MediaMyMediaObj" >');
  81. }
  82. },
  83. Play: function(){
  84. if( Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == 1 || Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == null ){
  85. sound = Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameThisSound ) || Media.PlaySound.SoundDefault;
  86. obj = MM_findObj("MediaMyMedia");
  87. objInfo = MM_findObj("MediaMyMediaDivInfo");
  88. objInfo.innerHTML = 'Estás escuchando ' + Media.PlaySound.Sounds[sound].name;
  89. //alert(Media.PlaySound.Sounds[sound].file)
  90. if((Media.PlaySound.MSIE>-1) || (Media.PlaySoundOPER>-1)) {
  91. obj = MM_findObj("MediaMyMediaObj");
  92. obj.src = Media.PlaySound.Sounds[sound].file;
  93. } else {
  94. obj = MM_findObj("MediaMyMediaDiv");
  95. obj.innerHTML = '<embed src="'+Media.PlaySound.Sounds[sound].file+'" hidden="true" volume="200" loop="0" type="audio/midi" >';
  96. }
  97. }
  98. },
  99. Next: function(){
  100. sounds = Media.PlaySound.Sounds;
  101. var firstSound = 0;
  102. var lastSound = 0; for (var sonido in sounds){ lastSound++; } if( lastSound > 0 ) lastSound--;
  103. thisSound = Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameThisSound ) || Media.PlaySound.SoundDefault;
  104. nextSound = thisSound < lastSound ? parseInt(parseInt(thisSound,10)+1,10) : firstSound;
  105.  
  106. Media.PlaySound.WriteCookie( Media.PlaySound.cookieNameThisSound, nextSound );
  107. Media.PlaySound.Play();
  108. },
  109. Previus: function(){
  110. sounds = Media.PlaySound.Sounds;
  111. var firstSound = 0;
  112. var lastSound = 0; for (var sonido in sounds){ lastSound++; } if( lastSound > 0 ) lastSound--;
  113. thisSound = Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameThisSound ) || Media.PlaySound.SoundDefault;
  114. nextSound = thisSound > 0 ? parseInt(parseInt(thisSound,10)-1,10) : lastSound;
  115.  
  116. Media.PlaySound.WriteCookie( Media.PlaySound.cookieNameThisSound, nextSound );
  117. Media.PlaySound.Play();
  118. },
  119. Stop: function(){
  120. if( Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == 1 || Media.PlaySound.ReadCookie( Media.PlaySound.cookieNameActive ) == null ){
  121. obj = MM_findObj("MediaMyMedia");
  122. objInfo = MM_findObj("MediaMyMediaDivInfo");
  123. objInfo.innerHTML = 'Stop';
  124.  
  125. if((Media.PlaySound.MSIE>-1) || (Media.PlaySoundOPER>-1)) {
  126. obj = MM_findObj("MediaMyMediaObj");
  127. obj.src = Media.PlaySound.SoundStop;
  128. } else {
  129. obj = MM_findObj("MediaMyMediaDiv");
  130. obj.innerHTML = '<embed src="'+Media.PlaySound.SoundStop+'" hidden="true" volume="200" loop="0" type="audio/midi" >';
  131. }
  132. }
  133. }
  134. }
  135. Media.PlaySound.Init();
  136. </script>
  137. </head>
  138. <body>
  139.  
  140.  
  141.  
  142. <a href="#"><img src="images/ico_on.gif" onclick="Media.PlaySound.OnOffSound(this)" border="0" align="absmiddle" /></a>
  143.  
  144.  
  145. <span name="MediaMyMediaDiv" id="MediaMyMediaDiv" style="margin:0; width:0; height:0;"></span>
  146. <input type="button" value="Previus" onclick="Media.PlaySound.Previus()" />
  147. <input type="button" value="Play" onclick="Media.PlaySound.Play()" />
  148. <input type="button" value="Stop" onclick="Media.PlaySound.Stop()" />
  149. <input type="button" value="Next" onclick="Media.PlaySound.Next()" />
  150. <span name="MediaMyMediaDivInfo" id="MediaMyMediaDivInfo"></span>
  151. </body>
  152. </html>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.