Skip to content

Instantly share code, notes, and snippets.

@loicknuchel
Created January 21, 2015 10:20
Show Gist options
  • Star 12 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save loicknuchel/f0222bb66fdaaf7e3391 to your computer and use it in GitHub Desktop.
Save loicknuchel/f0222bb66fdaaf7e3391 to your computer and use it in GitHub Desktop.
Angular MediaSrv : play audio with Cordova & Ionic apps
angular.module('my.cordova.plugins', ['ionic'])
// for media plugin : http://plugins.cordova.io/#/package/org.apache.cordova.media
.factory('MediaSrv', function($q, $ionicPlatform, $window){
var service = {
loadMedia: loadMedia,
getStatusMessage: getStatusMessage,
getErrorMessage: getErrorMessage
};
function loadMedia(src, onStop, onError, onStatus){
var defer = $q.defer();
$ionicPlatform.ready(function(){
var mediaStatus = {
code: 0,
text: getStatusMessage(0)
};
var mediaSuccess = function(){
mediaStatus.code = 4;
mediaStatus.text = getStatusMessage(4);
if(onStop){onStop();}
};
var mediaError = function(err){
_logError(src, err);
if(onError){onError(err);}
};
var mediaStatus = function(status){
mediaStatus.code = status;
mediaStatus.text = getStatusMessage(status);
if(onStatus){onStatus(status);}
};
if($ionicPlatform.is('android')){src = '/android_asset/www/' + src;}
var media = new $window.Media(src, mediaSuccess, mediaError, mediaStatus);
media.status = mediaStatus;
defer.resolve(media);
});
return defer.promise;
}
function _logError(src, err){
console.error('MediaSrv error', {
code: err.code,
text: getErrorMessage(err.code)
});
}
function getStatusMessage(status){
if(status === 0){return 'Media.MEDIA_NONE';}
else if(status === 1){return 'Media.MEDIA_STARTING';}
else if(status === 2){return 'Media.MEDIA_RUNNING';}
else if(status === 3){return 'Media.MEDIA_PAUSED';}
else if(status === 4){return 'Media.MEDIA_STOPPED';}
else {return 'Unknown status <'+status+'>';}
}
function getErrorMessage(code){
if(code === 1){return 'MediaError.MEDIA_ERR_ABORTED';}
else if(code === 2){return 'MediaError.MEDIA_ERR_NETWORK';}
else if(code === 3){return 'MediaError.MEDIA_ERR_DECODE';}
else if(code === 4){return 'MediaError.MEDIA_ERR_NONE_SUPPORTED';}
else {return 'Unknown code <'+code+'>';}
}
return service;
});
angular.module('app', ['ionic', 'my.cordova.plugins'])
.controller('PlayCtrl', function($scope, MediaSrv){
var myMedia = null;
MediaSrv.loadMedia('sounds/mysound.mp3').then(function(media){
myMedia = media;
});
$scope.play = function(){
myMedia.play();
};
})
.controller('PlayLoopCtrl', function($scope, MediaSrv){
var shouldPlay = false;
var myMedia = null;
function onStop(){
if(myMedia !== null && shouldPlay){
myMedia.play();
}
}
MediaSrv.loadMedia('sounds/1023.mp3', onStop).then(function(media){
myMedia = media;
});
function playStart(){
shouldPlay = true;
onStop();
}
function playStop(){
shouldPlay = false;
myMedia.stop();
}
})
.controller('PlayLoopMultiCtrl', function($scope, MediaSrv){
var shouldPlay = false;
var soundFiles = ['sounds/1.mp3', 'sounds/2.mp3', 'sounds/3.mp3'];
var playingMediaIndex = null;
var mediaInstances = [];
var onStop = function(){
if(shouldPlay){
if(playingMediaIndex === null){
playingMediaIndex = 0;
} else {
playingMediaIndex = (playingMediaIndex+1) % mediaInstances.length;
}
mediaInstances[playingMediaIndex].play();
}
};
for(var i in soundFiles){
MediaSrv.loadMedia(soundFiles[i], onStop).then(function(media){
mediaInstances.push(media);
});
}
function playStart(){
shouldPlay = true;
onStop();
}
function playStop(){
shouldPlay = false;
mediaInstances[playingMediaIndex].stop();
}
});
// browser mocking for media plugin : http://plugins.cordova.io/#/package/org.apache.cordova.media
window.Media = function(src, mediaSuccess, mediaError, mediaStatus){
// src: A URI containing the audio content. (DOMString)
// mediaSuccess: (Optional) The callback that executes after a Media object has completed the current play, record, or stop action. (Function)
// mediaError: (Optional) The callback that executes if an error occurs. (Function)
// mediaStatus: (Optional) The callback that executes to indicate status changes. (Function)
if (typeof Audio !== "function" && typeof Audio !== "object") {
console.warn("HTML5 Audio is not supported in this browser");
}
var sound = new Audio();
sound.src = src;
sound.addEventListener("ended", mediaSuccess, false);
sound.load();
return {
// Returns the current position within an audio file (in seconds).
getCurrentPosition: function(mediaSuccess, mediaError){ mediaSuccess(sound.currentTime); },
// Returns the duration of an audio file (in seconds) or -1.
getDuration: function(){ return isNaN(sound.duration) ? -1 : sound.duration; },
// Start or resume playing an audio file.
play: function(){ sound.play(); },
// Pause playback of an audio file.
pause: function(){ sound.pause(); },
// Releases the underlying operating system's audio resources. Should be called on a ressource when it's no longer needed !
release: function(){},
// Moves the position within the audio file.
seekTo: function(milliseconds){}, // TODO
// Set the volume for audio playback (between 0.0 and 1.0).
setVolume: function(volume){ sound.volume = volume; },
// Start recording an audio file.
startRecord: function(){},
// Stop recording an audio file.
stopRecord: function(){},
// Stop playing an audio file.
stop: function(){ sound.pause(); if(mediaSuccess){mediaSuccess();} } // TODO
};
};
@pcrombach
Copy link

Hi, in the factorycode I see in $ionicPlatform.ready(function() 2 times a var assigned to mediaStatus?!?!

Is this corect??

@felipedaraujo
Copy link

It works! Awesome! 😄

@jeanpratt
Copy link

Finally got this working. Thanks so much!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment