I developed an music player with Cordova
witch play MP3 files with HTML5 Audio
from Apache hosted server, when I play songs (in chrome windows or in crosswalk application or iOS Cordova App), it shows buffer size and currentPosiotion
in UI and song plays with no problem.
My problem is some testers (Crosswalk or iOS Corodova) report that when some songs are playing, buffer size is ahead of playing time for at least 10 sec, but it stuck for a moment and music jumps to last buffer position without updating currentTime
(feels like we are on UDP :D ), It seems a low quality network problem, so I attached this code, to know when music stuck and jumps, but testers says nothing shown and music still jumps
audio.addEventListener('stalled', function(){
alert(audio.currentTime);
})
I don't know where is problem, and I insist using HTML5 Audio
(because Cordova Media Plugin
is laggy when I change song)
And just a little note about MP3 files, there are 2 servers hosting files, one of them sends total size of file (when I download that file in chrome or Cordova FileTransfer plugin
) and the other one doesn't do the same (MP3 file downloads but not shows how much left).
feel free to share any ideas, from using any JS plugins, hacks, Corodva ideas or any other things!
Here is my CoffeeScript media control class:
loadingAnimation = require './Loading'
flashMessage = require './FlashMessage'
module.exports = new class AudioManager
constructor: ->
@audio = new Audio ""
@audio.autobuffer = true
@audio.preload = "auto"
@playing = no
@buffering = no
@audio.addEventListener 'canplaythrough', =>
@buffering = no
do loadingAnimation.hide
if @playing is yes
@audio.play()
@audio.addEventListener 'error', (event) =>
if @playing
@playing = no
@buffering = no
do loadingAnimation.hide
flashMessage.show "Sorry, Cannot load song!"
@src = ""
@audio.src = @src
@playToEndCallback("error") if @playToEndCallback?
@audio.addEventListener 'timeupdate', (event) =>
@timeCallback @audio.currentTime if @timeCallback?
if @audio.duration > 0
@timePercentCallback(@audio.currentTime / @audio.duration) if @timePercentCallback?
@audio.addEventListener 'progress', (event) =>
if @audio.duration > 0
@bufferPercentCallback(@audio.buffered.end(@audio.buffered.length-1) / @audio.duration) if @bufferPercentCallback?
@audio.addEventListener 'ended', (event) =>
@playToEndCallback event if @playToEndCallback?
play: (src) ->
return if src is @src
if src isnt undefined
if @playing is yes
do @pause
@changeSongCallback() if @changeSongCallback?
@src = src
@audio.src = @src
@buffering = yes
do loadingAnimation.show
@audio.load()
else
@audio.play()
@playing = yes
@playStatusCallback(yes) if @playStatusCallback?
pause: ->
@audio.pause()
@playing = no
@playStatusCallback(no) if @playStatusCallback?
switch: ->
if @playing then do @pause else do @play
onPlayStatus: (@playStatusCallback) ->
onPlayToEnd: (@playToEndCallback) ->
onTime: (@timeCallback) ->
onTimePercent: (@timePercentCallback) ->
onBufferPercent: (@bufferPercentCallback) ->
onChangeSong: (@changeSongCallback) ->
Aucun commentaire:
Enregistrer un commentaire