DIYgod mirror
Go to file
Eric Robinson 8a1f19ec57 Duplicate pause event logic into the abort event
It appears that the "pause" event is never triggered if you call `audio.pause()` on a playing audio element and then immediately set `audio.src`. The "abort" event, however, _is_ called in this case.

Because the "pause" event isn't raised, the APlayer code that resets the pause button state doesn't trigger. This leaves the APlayer in a state where the pause button is still showing but the audio element _isn't_ actually playing. Because `APlayer.toggle()` (which is called by the Play/Pause button) does not check the state of the audio element, and instead checks the state of the UI, we end up in a situation where the pause button is visible but we're not playing. The call to Toggle, then, calls `APlayer.pause()` which checks to see if it's already paused or not. Because the audio element is already paused, the call is ignored and the event never triggers (which would reset the button UI).

This [temporary] "fix" resolves the issue by intercepting the "abort" event that is triggered when the "pause" event is aborted. It then runs the same logic as the "pause" event, checking to see if the playback button is in a "paused" state and, if so, resetting it to a "play" button state.

_In theory_, the checks at the beginning of the `pauseHandler` arrow function should be enough to safeguard any other unrelated calls to "abort".
2017-12-12 16:38:41 -05:00
.github add ISSUE_TEMPLATE 2017-03-08 18:50:13 +08:00
demo better demo page 2017-03-27 11:05:38 +08:00
dist Add build results to the repo 2017-12-12 14:00:35 -05:00
src Duplicate pause event logic into the abort event 2017-12-12 16:38:41 -05:00
.gitignore chore(gitignore): ignore npm-debug.log 2016-04-25 21:48:45 +08:00
.travis.yml upgrade node version in travis-ci 2017-02-06 12:27:15 +08:00
LICENSE update README and LICENSE 2017-07-23 23:19:25 +08:00
README.md README: Related Projects & Who use APlayer & Sponsor 2017-11-30 00:29:53 +08:00
package.json update README and LICENSE 2017-07-23 23:19:25 +08:00
postcss.config.js use yarn, upgrade to webpack2 2017-02-06 12:12:25 +08:00
webpack.config.js use yarn, upgrade to webpack2 2017-02-06 12:12:25 +08:00
yarn.lock switch to next song in mobile, close #138 2017-06-08 00:16:56 +08:00

README.md

ADPlayer

APlayer

Wow, such a lovely HTML5 music player

npm npm devDependency Status npm Travis donate

Sponsor

Introduction

image

APlayer is a lovely HTML5 music player to help people build audio easily.

APlayer supports:

  • Media formats
    • MP4 H.264 (AAC or MP3)
    • WAVE PCM
    • Ogg Theora Vorbis
  • Features
    • Playlist
    • Lyrics

Using APlayer on your project? Let me know!

Demo

Docs

Install

$ npm install aplayer --save

Quick Start

<div id="aplayer1" class="aplayer"></div>
<script src="dist/APlayer.min.js"></script>
var ap = new APlayer({
    element: document.getElementById('aplayer1'),
    music: {
        title: 'Preparation',
        author: 'Hans Zimmer/Richard Harvey',
        url: 'Preparation.mp3',
    }
});

Usage

Read the Docs

Join the Discussion

Who use APlayer?

CDN

Donate

Sponsor

Author

APlayer © DIYgod, Released under the MIT License.
Authored and maintained by DIYgod with help from contributors (list).

Blog @Anotherhome · GitHub @DIYgod · Twitter @DIYgod · Weibo @DIYgod酱 · Telegram Channel @awesomeDIYgod