zohararad / audio5js Goto Github PK

View Code? Open in Web Editor NEW

643.0 643.0 128.0 368 KB

The HTML5 Audio Compatibility Layer

Home Page: http://zohararad.github.com/audio5js/

JavaScript 94.60% ActionScript 2.85% CSS 1.75% HTML 0.80%

audio5js's People

Contributors

Stargazers

Watchers

Forkers

ydaniv irrelon tatygrassini yrsdi antixrist fengyiyi altryne mohitsadaria lonjoy tyidnet bjoerge gryzzly mauricionobrega imclab web5design nl0 creativebraininc jmurowaniecki qyiming nogizhopaboroda kasheftin emmanuellesoy xmmdream ssrihari nonloso7 hulion barodeur davidkaminsky jiggsfoo sljubura for0231 reubenmoes nvdnkpr brileyhe qiubi8801 shamim71 bzrga 5erg symonny pteich penwin angck elebescond iancl is00hcw sethlesky cevic chin2chavda libingqing809 gabriel0402 ioying mikaelkaron davecoffin wanggang198810 mikerudolph matak chenxofhit adamfu mutewinter yaojaa olegfox squallyan xzf158 erikagriffin kaikaiandhisfellows yibn2008 svnlabs mcanthony smudiya kosso mondolfo jonham urtubia xli0011 davlou admpub ssiagu dreamllq yonjar salman-samian nolajun shengtao bruce-yangs cucygh lixuanxian pk-codebox-evo nctruong rscap lodyn tanghanjun shiaijuan yih92 superilya yugngit yinshipeng rampapampapampapam yangyangsgit phpcai byjg yogalin

audio5js's Issues

Events should support .once

Sometimes it makes sense to subscribe to an event just once. It is also quite common for event libraries to provide such a feature.

mp4 codec support seems to have problem

I have this piece of coffeescript

    @audio5js = new Audio5js
      codecs: ['mp4', 'vorbis', 'mp3']
      ready: (player) ->
        src = switch player.codec
          when 'mp4' then m4aSrc
          when 'vorbis' then ogaSrc
          else mp3Src
        @load(src)

The m4aSrc is an audio of .aac extension. When I try to execute this in chrome, Audio5js goes to mp4 source, load the aac file and then complain AUDIO_FORMAT_NOT_SUPPORTED.

The demo is not working in IE8

View th demo link:http://zohararad.github.com/audio5js/
Use IE11,It's work.But in IE8 simulation mode，don't work.

Fading sound on play/pause

Is it possible to add a parameter to fade in/out sound when play/pause sound ?

Regards

destroyAudio doesn't stop audio

I'm looking for a way to stop the audio from playing as well as downloading in the background. I found the destroyAudio method but it simply deletes the instance which doesn't stop the audio, at least in my version of chrome. Currently, I'm nulling the audio src which creates an uncaught error.

onTimeUpdate not triggering on some Android browser

On an Android browser with this UserAgent string Mozilla/5.0 (Linux; U; Android 4.2.2; uk-ua; PAP3350DUO Build/JDQ39) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30 the onTimeUpdate doesn't trigger, and that's because this.audio.buffered.length [audio5.js:579] evaluates to 0 even on a non-streaming (download) file.

Completely remove all Flash components

Hello,

is it possible to use audio5js in a way that no flash components are used at all. Because even if the html player is used, it seems there is an SWF pixel generated. I realized this through Google Page Speed Inisghts.

So the question: Is there a way to have audio5js purely use html and nothing else?

Can I haz AMD wrapper?

No AMD, not buying (:

Single audio

I want when hover the menu list to play only the current sound.
It's possible to stopallsounds?

$('.cms39_accessibility_hover ').mouseover(function (e) {
        var text = $(this).text();
        var tts ='source'; 
        initAudio(tts);
    });

function initAudio(tts) {
    var audio5js = new Audio5js({
        swf_path: 'http://cdn.jsdelivr.net/audio5js/0.1.7/swf/audio5js.swf',
        ready: function () {
            this.load(tts);
            this.play();
        }
    });
    //audio.destroy();
}

Cannot Unsubscribe from Event from within Handler

Calling Pubsub#off is no-op while Pubsub#trigger is running:

function handler() {
  if (...) {
    player.off('progress', handler)
  }
})

player.on('progress', handler)

This happens since trigger empties the channels array while processing event handlers. So the handler does not appear to be registered while trigger is running.

In most cases you can probably just use one instead. Still, it's a gotcha.

There is no ngAudio5.js included in bower package?

Support more media events?

The list of the event types currently supported is quite limited. Do you have any plans to support more html5 media events?

https://developer.mozilla.org/en-US/docs/DOM/Media_events

AngularJS demo doesn't work in Chrome v.31.0.1650.63 on Windows 8

AngularJS demo doesn't work in Chrome v.31.0.1650.63 on Windows 8, but works with Firefox and IE

Parameters are reverse

this.on('timeupdate', function (duration, position) {
console.log(duration, position);
}, this);

// position, duration

Should output

//duration, position

Flash container inserted too soon

The element containing the flash embed code is tried appended to document.body at a time when document.body may not be set (depending on when audiojs is initialized).

I.e. the following will break flash fallback:

<html>
<head>
  <script src="/js/audio5.js"></script>
  <script>
    function initAudio () {
      var audio5js = new Audio5js({
        ready: function () {
          this.load('/someaudio.mp3');
          this.play();
        }
     });
    }
    initAudio();
  </script>
  </head>
<body>
(...)

Offending line is this: zohararad/audio5js/src/audio5.js#L209

Have you considered making available through bower

Hi, I'm using yeoman.io and it makes it pretty easy to pull you repo when you have a bower repo like: https://github.com/angular/bower-angular

This site may help you set one up: http://net.tutsplus.com/tutorials/tools-and-tips/meet-bower-a-package-manager-for-the-web/

Cheers!

duration is broken

Hi!

I'm trying to retrieve the duration of a track, following the Mobile Safari usage pattern.

Inside a canplay event callback i access player.duration property, and it always returns 0.

From play button click callback, the player.duration is 0 for the first time and 30.000181 on subsequent tries, which seems to be the correct value.

But i've also seen player.duration return 0:30 and NaN:NaN.

HTML5 destoryAudio function produces Audio load Error

I was getting an error whenever I was calling .load()

audio5.min.js:2 Uncaught Error: Audio Error. Failed to Load Audio

Found the source of this to be setting the source to an empty string when calling destoryAudio()

this.audio.setAttribute('src', '');

https://github.com/zohararad/audio5js/blob/master/src/audio5.js#L509-516

player not working on chrome on mac

http://stackoverflow.com/questions/25191189/audio5js-player-not-working-for-chrome-on-mac

Please remove.

Sorry - please delete.

Position is 0 after Seek, then Play.

Hi, I can play() an mp3 file, then seek(), and monitor it's position using the timeupdate event. This works as expected.

My problem is the position returns to 0 when I do this process:

1: pause()
2: seek(position + 0.5) // advance the position 1/2 second
3: play()

Imagine the position at 1 is 10 seconds and duration is 20 seconds. After step 2, the position pointer is 10.5 seconds, then, on step 3, the position should remain there, but it returns to 0. Is this a bug?.

support dataURI scheme in Flash

audio5.load('http://127.0.0.1/test.mp3'); work well. But audio5.load("data:audio/mp3;base64,XXXXXXXXXXXX"); generate Error calling method on NPObject!

Is it be possible to use an audio file encoded in base64 ? How ?
Thank

the demos doesn't work

the demos doesn't work actually on both IE10 and chrome, by the way, is there anything special in contrast with audioJS ?

Format Duration not working

I'm using audio5js with angular and for some reason format_time only affects position but duration always remains unformatted in seconds. Also i've checked all the demos for ngAudio and they all seem to have the same problem.

Opera : Error: Cannot convert 'this.audio' to object

Hi,
Just tested my project in Opera Browser v12.16, i have this error:

Error: Cannot convert 'this.audio' to object
([arguments not available]) audio5.js:430
([arguments not available]) audio5.js:825

Hope this helps fix this issue

Thanks

Regards

Audio5js on mobile browsers

Hi, I'd like to use audio5js on a playlist-site (hvsr.net) but I'm experiencing some problems on mobile browsers. I know Apple and Android won't allow the autoplay feature, and it's ok for me to have the playlist streamed only after the user plays the PLAY button. BUT I would like the player to stream a new song when the previous one has ended. On desktop it works, but not on mobile. Please take a look at this demo page:
http://jsfiddle.net/franz976/pyt5k0ma/

thank you

html5 audio player for mp3 issue for Chrome

util.can_play()

returns false for mime_type:mp3, mime_str :audio/mpeg; codecs="mp3".

!!a.canPlayType && a.canPlayType(mime_str) !== ''

returns false.

tested this on chrome 36.0.1985.125, android chrome. Does not happen on Safari. The interesting thing is if you change the mime_str for mp3 to audio/mpeg; codec="mp3" it seems to be working.

How to integrate with backbone js

Could you please help me integrate audio5js with backbone js. I am using handlebars templates, i need to put audio to my backbone view, as internet explorer wont play .wav files.

Sorry, this is not an issue, was just asking a help :) .

Best Regards,
Deepu.

Audio not playing on iOS 8 standalone web app

Audio which plays as expected on iOS7 in safari and as a web app that is 'saved to homescreen' does not play on iOS8 in the homescreen version. Works fine in Safari and all other desktop browsers.

It's likely a known bug w/ iOS8 but thought I would put here in case anyone has insight. http://stackoverflow.com/questions/25977730/video-no-longer-playing-in-ios-8-webbapp-standalone-mode-anyone-found-a-solutio

play() can only run once in safari without quicktime

this is a simple html:

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
      <script src="js/audio5.js"></script>
      <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
    </head>

    <body>
      <button id="play">play</button>



      <script type="text/javascript">
        $(document).ready(function(){
          var audio5js = new Audio5js({
            swf_path: 'swf/audio5js.swf',
            ready: function () {
              this.load('sample3.mp3');
            }
          });


          $("#play").click(function(){
           audio5js.play();
         });

        });
      </script>
    </body>

    </html>

I open it in safari without quicktime on my pc(so the mp3 will play with audio5js.swf, I think), and I click the play button, the mp3 will play, it works. But when I press the button again, it is no sound.

I open this html with firefox and ie, audio5js works well.

what's wrong? it seems like the swf is not correct run at the second time.

Android Support

Wonderful work so far! You are AWESOME! It does not work in Android (namely, on my HTC Desire Z Android 2.3 Phone) but there is good news. There are two ways to workaround the missing audio tag support on older android devices:

Apparently this works, as silly as is looks:
[video src="test.mp3" onclick="this.play();"][/video]
Yes, as video. =) But I'm sot sure if this is of any help.

Additionally, Flash sound using mp3s also works great. An example of a functional implementation is the one found in SoundManager2 which I've successfully used on my phone.

More info here, including alternate workarounds:
http://stackoverflow.com/questions/3069124/playing-html5-audio-in-android-browser

Keep up the fantastic work, and know that your efforts are appreciated and highly valued. Thank you.

If you change src of audio element, this fault will occur: Invalid URI. Load of media resource failed.

i think that destroy function of audio5 class should remove audio element from document, otherwise this fault will appear in console

everything work, but if it is considered as a fault, maybe in future could be problem with it? also many programmers dont know what does it mean

what do you think?

playing more title on one page

i am trying to play more sounds on one page, one plays it means stop the before sound

but, i think that problem is that it takes some time when the playback is stopped, and new playback is stopped before it starts because i think that the new load is stopped due to before stop command

hope it is understandable?

or do you have some example how to do it?

´´´
(function ($) {
$.extend({
soundsplayer: {
audio5: null,
audioStopping: false,
elem: null,
playsoundtimeElem: null,
init: function() {
var self = this;

            self.audio5 = new Audio5js({
                        swf_path: '/swf/audio5/audio5js.swf',
                        throw_errors: true,
                        format_time: true,
                        ready: function(player) {

                            this.on('ended', $.soundsplayer.audioStop, this);

                            this.on('progress', function(load_percent) {
                                $.soundsplayer.progressupdate(load_percent);
                            }, self);

                            this.on('timeupdate', function(position, duration) {
                                $.soundsplayer.timeupdate(position);
                            }, this);

                            $(document).on('click', 'i.playsound', $.soundsplayer.play);
                            $(document).on('click', 'i.playsoundstop', $.soundsplayer.stop);
                        }
                    });
        },

        timeupdate: function(position) {
            $.soundsplayer.playsoundtimeElem.html(position);
        },

        progressupdate: function(loadPercent) {
            $.soundsplayer.playsoundtimeElem.html(loadPercent + "%");
        },

        audioEnded: function(e) {
            $.soundsplayer.audioEnding = false;
            $.soundsplayer.audioEnded = true;
        },          

        play: function(e) {
            console.log("play");
            console.log(e);

            var audio5 = $.soundsplayer.audio5;
            console.log($.soundsplayer.elem);

            // nejdrive zastavime bezici playback
            if (audio5.playing || $.soundsplayer.elem) {
                // vyhodime z teto funkce
                $.soundsplayer.stop();                  
                $.soundsplayer.play(e);
            }
            else {              
                console.log("jedu");
                var elem = $(this);
                $.soundsplayer.elem = elem;
                //console.log($.soundsplayer.elem);

                var parent = elem.parent();
                $.soundsplayer.playsoundtimeElem = $($(parent).find('.playsoundtime')[0]);
                //console.log($.soundsplayer.playsoundtimeElem);

                // zamen play za stop
                elem.removeClass('playsound');
                elem.removeClass('fa-play');
                elem.addClass('playsoundstop fa-stop');

                var url = elem.data('stream');              
                console.log(url);
                audio5.load(url);
                audio5.play();
                audio5.volume(1);
            }
        },

        stop: function(e) {
            console.log("stop");
            console.log(e);

            var elem = $.soundsplayer.elem;             
            // zamen stop za play
            elem.removeClass('playsoundstop');
            elem.removeClass('fa-stop');
            elem.addClass('playsound fa-play');

            var playsoundtimeElem = $.soundsplayer.playsoundtimeElem;
            playsoundtimeElem.html("");

            $.soundsplayer.elem = null;
            $.soundsplayer.playsoundtimeElem = null;

            console.log("porad stop stop");
            console.log($.soundsplayer.elem);

            $.soundsplayer.audioEnding = true;
            $.soundsplayer.audioEnded = false;              

            var audio5 = $.soundsplayer.audio5;
            console.log(audio5);
            audio5.seek(0);
            audio5.pause();
        }
    }
});

})(jQuery);

´´´

Stop method

Please add .stop() method.
Need to play online radio

Multiple players

Hey pal,

Thanks for this great lib, it is exactly what I was looking for..

But, I need 2 simultaneous audio players on my APP. For this I was creating 2 instances of Audio5js object, and here is the problem: Apparently the two instances uses the same 'HTML Audio' object, therefore, they are loading and playing exactly the same file.

Maybe this is occuring by my mistake, or maybe isn't your objective to have a multi instance player, but if can review this error, I'll be thankful.

Best regards

Internet Explorer 8 and 9 "Script Not Implemented" on 'Quick Demo' page

Unfortunately Audio5js does not load in Internet Explorer 8 and 9 (at least) on this page http://zohararad.github.io/audio5js/ (and in my usage scenario with same error).

IE console says:

SCRIPT16385: Not implemented

audio5.min.js, line 2 character 1979
SCRIPT5009: 'Audio5js' is undefined
audio5js, line 450 character 7

When I click on "Load Audio" then nothing happens, text does not change and control elements do not load like they do on other browsers.

Thought I would highlight this since docs said it was tested on IE8+, hopefully it is an easy issue to fix.

The two demos don't work in IE 8 on Windows 7

It shows me the flowing errors:
TypeError: the object does not support “bind” attribute or function is undefined
SCRIPT1002: Syntax Error

`this.seek()` function doesnt work!

Hi,
i using BackboneJS for build a web audio player with this library,
i write a method for move to start:

stopMusic: function () {
    if (this.playing) {
        this.seek(0)
    }
}

and its doesnt work! but everything like this.pause(); method works fine! but this.seek(0); doesnt! and there is no error in console.

Audio5js no longer playing after updating to latest Chrome 36.0.1985.125

After updating the the latest version of Chrome (36.0.1985.125) I'm getting the following error:

No issue with latest versions of Firefox and Safari. Seems to do something with incorrectly falling back to flash instead of using HTML5 audio?

Excellent audio player, hopefully this can be figured out soon.

Volume on Safari Mobile

Setting the volume doesn't seem to be working on Safari Mobile. My code works fine on desktop browsers (Tested with chrome and safari), but the same code doesn't work on Safari iOS7.

IE11 on Windows 7 - 'play' event only fires once

It appears that IE11 on Windows 7 only fires the 'play' event when you first play the audio. If you have the audio play more than once, it no longer broadcasts a play event which breaks the tracking of play / pause in audiojs.

My workaround solution was to replace the 'play' listener with 'playing'. IE11 appears to fire this event every time audio.play() is called. Chrome and Firefox also work with using the 'playing' event.

Flash timeupdate frequence

Hi,
It seems timeupdate from the flash player isn't really acurate :
In the beginning of the song, the duration varies during 5-10 secs before it stabilizes

Moreover sometimes it seems, that it is possible to break the flash module. It stops sending event and it cannot be controled anymore. It happens when there are errors on the callbacks listenings to events for exemple. And more strangely firefox doesn't fires errors when there are errors in the listeners functions

I'm using Firefox 18 for my tests.

Thanks

How to set swf path in angularjs service

TheAudioService can be easily injected in any controller or service but how can the audio instance initialization parameters (i.e. swfPath) be set?

Getting uncaught exception Error in Actionscript in Firefox on Mac

[01:55:39.492] uncaught exception: Error in Actionscript. Use a try/catch block to find error.

Getting above error here http://jsbin.com/ogaqus/4/edit

Firefox 20.0 on Mac OS X 10.8.2

Cannot play MP3 file from blob in Firefox

I was trying to play an MP3 file on Firefox, loading it as a blob.

player = new Audio5js({swf_path: "swf/audio5js.swf", throw_errors: true, format_time: false});
player.load('blob:2f927413-235d-c540-8c74-32425c1cc4b5')
player.play()

This doesn't play the blob and throws an error:
Error: Error in Actionscript. Use a try/catch block to find error.

The same works on Chrome, as it uses the HTML5 audio player, but since Firefox HTML5 audio doesn't support MP3, it falls back to the SWF player. It seems the SWF player has a problem playing blobs. Is this something that you would be able to fix?

Issue testing angular demo

Hi,

I'm trying to run the angular demos but on both of them I get the following error

Error: this.audio is undefined
FlashAudioPlayer.prototype.play@file:///home/lucy/Downloads/audio5js-master/src/audio5.js:430
Audio5js.prototype.play@file:///home/lucy/Downloads/audio5js-master/src/audio5.js:828
Audio5js.prototype.playPause@file:///home/lucy/Downloads/audio5js-master/src/audio5.js:843
Mc/u/<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:70
dc[c]</</</<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:141
Sc/this.$get</e.prototype.$eval@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:86
Sc/this.$get</e.prototype.$apply@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:86
dc[c]</</<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:140
pc/c/<@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:22
m@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:6
pc/c@http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js:22
"

Also on a side note is there anyway to state that you don't want a flash fallback?

Thanks

Seek function doesn't work on flash engine

Nice work zohararad ! That's a really great cross navigator player !

But I think I found a bug : the seek function for flash player doesn't seem to work

seek: function (position) {
      try {
        this.audio.seekTo(position);
        this.position = position;
      } catch (e) {}
    }

on line 387
it catches an exception when. Works well for html engine :)

.mp4 isn't supposed to be .m4a?

(or at least also m4a?)

yup, i was right http://en.wikipedia.org/wiki/MPEG-4_Part_14#.MP4_versus_.M4A

Audio won't play twice in chrome

Hi,
I'm having the following problem: when playing an audio file in chrome, it will play/pause correctly, but once I reach the 'ended' state, the file won't play again (I can't reach the .on('timeupdate' ...) method). This doesn't happen on Firefox, and I'm supposing the navigator must reload the audio file each time I press the play button.
Forcing the load in the on('play'...) method, I then am unable to pause the track, which is also the problem in Firefox.
I'm using AngularJS, and have tried including the ngAudio5.js module, but it doesn't seem to help. Have I forgotten to do something?

Audio5js's Flash cuts during a song

Hi,

This problem only happens in Firefox with Flash Player, HTML5 in IE10 works just fine.

At 2:29 of this song: http://www62.zippyshare.com/v/91387527/file.html, when using audio5js.min.js's seek function, the song finishes, cutting out the ending of the song (it should be 3:08 mins long). It's happened to quite a few songs. If you need more examples, just ask. If I don't use the seek function it will play the entire song to the ending, so it seems to be a problem with the seek function.

Thanks.

Legal disclaimer: I don't own that song, it's download may be used for research/educational purposes only.

zohararad / audio5js Goto Github PK

audio5js's People

Contributors

Stargazers

Watchers

Forkers

audio5js's Issues

Recommend Projects

Recommend Topics

Recommend Org