Search code examples
javascriptcordovaaudiophonegap-pluginsphonegap-build

Phonegap build and media plugin errors

Greetings. I am a beginner in javascript. I copied code from a stackoverflow question to make cordova media plugin to work.

This is the question. Phonegap Build with phonegap 3 and media plugin

I'm using an online radio streaming url. when i press play button its playing and all other functions are working.

But i encountered some different problems.

1.When i click play button twice, the radio stream is playing twice at the same time..

2.and when i press stop button its stoping the stream, but if i press stop button once again i get an error message.

How to fix this??

My index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <title>Waves of Power</title>

        <link rel="stylesheet" href="style.css" />
		<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8" src="radio.js"></script>
      
      
      
      
      </head>
     
     
     
     
     
     
      <body>
      			<div>
        		<img class="how" width="800px" height="1280px" src="images/ui.png" />
        		</div>
        
        
        
      <div class="cat-wrap">
        <div align="center" class="category" id="blin1">
          <a onClick="pauseAudio();"><img src="images/pause.png" width="90" height="90"  /></a>
        </div>
        <div align="center" class="category" id="blin2">
            <a onClick="playAudio('http://192.184.9.81:8374/;');"><img src="images/play.png" width="90" height="90" /> </a>
        </div>
        <div align="center" class="category" id="blin3">
            <a onClick="stopAudio();"><img src="images/stop.png" width="90" height="90" /> </a>
        </div>
        </div>
        
        
        

      </body>
    </html>

My radio.js

// JavaScript Document


        // Wait for device API libraries to load
        //
        //document.addEventListener("deviceready", onDeviceReady, false);

        // device APIs are available
        //
        //function onDeviceReady() {
        //    playAudio("http://192.184.9.81:8374/;");
        //}

        // Audio player
        //
        var my_media = null;
        var mediaTimer = null;

        // Play audio
        //
        function playAudio(src) {
            // Create Media object from src
            my_media = new Media(src, onSuccess, onError);

            // Play audio
            my_media.play();

            // Update my_media position every second
            if (mediaTimer == null) {
                mediaTimer = setInterval(function() {
                    // get my_media position
                    my_media.getCurrentPosition(
                        // success callback
                        function(position) {
                            if (position > -1) {
                                setAudioPosition((position) + " sec");
                            }
                        },
                        // error callback
                        function(e) {
                            console.log("Error getting pos=" + e);
                            setAudioPosition("Error: " + e);
                        }
                    );
                }, 1000);
            }
        }

        // Pause audio
        //
        function pauseAudio() {
            if (my_media) {
                my_media.pause();
            }
        }

        // Stop audio
        //
        function stopAudio() {
            if (my_media) {
                my_media.stop();
            }
            clearInterval(mediaTimer);
            mediaTimer = null;
        }

        // onSuccess Callback
        //
        function onSuccess() {
            console.log("playAudio():Audio Success");
        }

        // onError Callback
        //
        function onError(error) {
            alert('code: '    + error.code    + '\n' +
                  'message: ' + error.message + '\n');
        }

        // Set audio position
        //
        function setAudioPosition(position) {
            document.getElementById('audio_position').innerHTML = position;
        }

Thanks.

Solution

  • When you do if (my_media), you are checking if the variable is defined. You also need to check the media playback status. For example, in the stopAudio() function, you should check that the audio is actually playing, and in playAudio(), check that it isn't currently playing. You can find how to use the status in the plugin documentation.