macdonst · May 18, 2011 19:48 · bayomio · May 8, 2014
diff --git a/audio.html b/audio.html
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
                      "http://www.w3.org/TR/html4/strict.dtd">
 <html>
  <head>
    <title>PhoneGap Back Button Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap.0.9.5.js"></script>
    <script type="text/javascript" charset="utf-8">
   
    var myMedia = null;
 	var playing = false;
 	
    function playAudio() {
 		if (!playing) {
                        myMedia.play();	
 			document.getElementById('play').src = "images/pause.png";
 			playing = true;	
 		} else {
 			myMedia.pause();
                        document.getElementById('play').src = "images/play.png";    
                        playing = false; 
 		}
    }

    function stopAudio() {
 		myMedia.stop();
 		playing = false;
                document.getElementById('play').src = "images/play.png";    
 		document.getElementById('audio_position').innerHTML = "0.000 sec";
 	}

   function onLoad() {
       document.addEventListener("deviceready", onDeviceReady, false);
   }
   
   function onDeviceReady(){
   	console.log("Got device ready");
   	updateMedia();
   }
   
   function updateMedia(src) {
   	    // Clean up old file
   	    if (myMedia != null) {
 			myMedia.release();
 		}
 		
 		// Get the new media file
 		var yourSelect = document.getElementById('playlist');		
                myMedia = new Media(yourSelect.options[yourSelect.selectedIndex].value, stopAudio, null);

 		// Update media position every second
 	        var mediaTimer = setInterval(function() {
 	        // get media position
 	        myMedia.getCurrentPosition(
 	            // success callback
 	            function(position) {
 	                if (position > -1) {
 						document.getElementById('audio_position').innerHTML = (position/1000) + " sec";
 	                }
 	            },
 	            // error callback
 	            function(e) {
 	                console.log("Error getting pos=" + e);
 	            }
 	        );
 	    }, 1000);
   }

   function setAudioPosition(position) {
       document.getElementById('audio_position').innerHTML =position;
   }
 </script>
 <body onload="onLoad()">
   <h1>Audio Player</h1>
   <p id="audio_position">0.000 sec</p>
   <p>
 	   <select id="playlist" onchange="updateMedia()">
 	        <option checked value="/android_asset/www/test.mp3">Asset</option>
 	        <option value="test.mp3">SD Card</option>
 	        <option value="http://audio.ibeat.org/content/p1rj1s/p1rj1s_-_rockGuitar.mp3">Internet</option>
 	   </select>
   </p>
   <a href="#" onclick="playAudio()"><img id="play" src="images/play.png"></a>
   <a href="#" onclick="stopAudio()"><img id="stop" src="images/stop.png"></a>
 </body>
 </html>
	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
	<html>
	<head>
	<title>PhoneGap Back Button Example</title>

	<script type="text/javascript" charset="utf-8" src="phonegap.0.9.5.js"></script>
	<script type="text/javascript" charset="utf-8">

	var myMedia = null;
	var playing = false;

	function playAudio() {
	if (!playing) {
	myMedia.play();
	document.getElementById('play').src = "images/pause.png";
	playing = true;
	} else {
	myMedia.pause();
	document.getElementById('play').src = "images/play.png";
	playing = false;
	}
	}

	function stopAudio() {
	myMedia.stop();
	playing = false;
	document.getElementById('play').src = "images/play.png";
	document.getElementById('audio_position').innerHTML = "0.000 sec";
	}

	function onLoad() {
	document.addEventListener("deviceready", onDeviceReady, false);
	}

	function onDeviceReady(){
	console.log("Got device ready");
	updateMedia();
	}

	function updateMedia(src) {
	// Clean up old file
	if (myMedia != null) {
	myMedia.release();
	}

	// Get the new media file
	var yourSelect = document.getElementById('playlist');
	myMedia = new Media(yourSelect.options[yourSelect.selectedIndex].value, stopAudio, null);

	// Update media position every second
	var mediaTimer = setInterval(function() {
	// get media position
	myMedia.getCurrentPosition(
	// success callback
	function(position) {
	if (position > -1) {
	document.getElementById('audio_position').innerHTML = (position/1000) + " sec";
	}
	},
	// error callback
	function(e) {
	console.log("Error getting pos=" + e);
	}
	);
	}, 1000);
	}

	function setAudioPosition(position) {
	document.getElementById('audio_position').innerHTML =position;
	}
	</script>
	<body onload="onLoad()">
	<h1>Audio Player</h1>
	<p id="audio_position">0.000 sec</p>
	<p>
	<select id="playlist" onchange="updateMedia()">
	<option checked value="/android_asset/www/test.mp3">Asset</option>
	<option value="test.mp3">SD Card</option>
	<option value="http://audio.ibeat.org/content/p1rj1s/p1rj1s_-_rockGuitar.mp3">Internet</option>
	</select>
	</p>
	<a href="#" onclick="playAudio()"><img id="play" src="images/play.png"></a>
	<a href="#" onclick="stopAudio()"><img id="stop" src="images/stop.png"></a>
	</body>
	</html>