How to convert seconds to minutes and seconds for audio in main.js

124 views
Skip to first unread message

Chris

unread,
Mar 26, 2012, 11:10:37 PM3/26/12
to Eclipse Plugin for PhoneGap
Hi all,

I'm loving using MDS Applaud and PhoneGap. I have a small tweak that
is a little beyond my JavaScript abilities. I would like to have the
audio "Current" and "Total" display the audio time in minutes and
seconds rather that just seconds. The desired format would be, for
example, "1:23" instead of "83".

Many thanks for any input!

Chris

Here is the main.js file I am using:



// The Audio player
var my_media = null;
var mediaTimer = null;
// duration of media (song)
var dur = -1;
// need to know when paused or not
var is_paused = false;

//Set audio position on page
function setAudioPosition(position) {
$("#audio_position").html(position + " sec");
}

//onSuccess Callback
function onSuccess() {
setAudioPosition(dur);
clearInterval(mediaTimer);
mediaTimer = null;
my_media = null;
is_paused = false;
dur = -1;
}

//onError Callback
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
clearInterval(mediaTimer);
mediaTimer = null;
my_media = null;
is_paused = false;
setAudioPosition("0");
}

function playAudio(src) {

if (my_media === null) {
// ui niceties
$("#media_dur").html("0");
$("#audio_position").html("Loading...");

// Create Media object from src
my_media = new Media(src, onSuccess, onError);
// Play audio
//alert('Playing Audio');
my_media.play();
} else {
if (is_paused) {
// to resume where paused in song: call .play()
is_paused = false;
my_media.play();
}
}

// Update my_media position every second
if (mediaTimer === null) {
mediaTimer = setInterval(function() {
my_media.getCurrentPosition(
// success callback
function(position) {
if (position > -1) {
setAudioPosition(Math.round(position));
// getDuration() can take a few seconds so
keep trying
// this could be done a better way, no
callback for it
if (dur <= 0) {
dur =
my_media.getDuration();
if (dur > 0) {
dur = Math.round(dur);
$("#media_dur").html(dur);
}
}
}
},
// error callback
function(e) {
alert("Error getting pos=" + e);
setAudioPosition("Error: " + e);
}
);
}, 1000);
}
}

//Pause audio
function pauseAudio() {
if (is_paused) return;
if (my_media) {
is_paused = true;
my_media.pause();
}
}

//Stop audio
function stopAudio() {
if (my_media) {
// A successful .stop() will call .release()
my_media.stop();
my_media = null;
}
if (mediaTimer) {
clearInterval(mediaTimer);
mediaTimer = null;
}
is_paused = false;
dur = 0;
}

$('#page-home').live('pageinit',function(){

$("#playaudio").live('tap', function() {
// Note: two ways to access media file: web and local
file
//var src = 'http://audio.ibeat.org/content/p1rj1s/p1rj1s_-
_rockGuitar.mp3';

var currentDay = (new Date()).getDate();
var src = "/android_asset/psapro/proverbs" + currentDay +
".mp4";

// local (on device): copy file to project's /assets folder:
//var src = '/android_asset/spittinggames.m4a';

playAudio(src);
});

$("#pauseaudio").live('tap', function() {
pauseAudio();
});

$("#stopaudio").live('tap', function() {
stopAudio();
});
});

Libby

unread,
Mar 27, 2012, 3:06:49 PM3/27/12
to eclipse-plugi...@googlegroups.com
Hi Chris. Glad you are having fun w/PhoneGap!

I guess that would be something like:

var min = dur / 60;
var seconds = dur % 60;

$("#mins").html(min);
$("#secs").html(seconds);

Instead of media_dur add to html :
<span id="mins"></span>&nbsp;:<span id="secs"></span>

Not sure if you need &nbsp; to keep it all on one line.

Cheers,
Libby
Reply all
Reply to author
Forward
0 new messages