- Updated the way properties from the shim instance and its prototype are retrieved. - Replaced the for-in loop with a Set to ensure all properties, including inherited ones, are considered. - Excluded the 'constructor' property from being added to the canvas. refactor: remove unused utility functions and streamline event handling - Deleted `videoEvents.js`, `clamp.js`, and `sleep.js` as they were not utilized. - Introduced a new `EventTarget` class to manage event listeners more efficiently. - Enhanced `MediaBunnyEngine`, `AudioEngine`, `VideoEngine`, and `VideoShim` to utilize the new event system. - Updated type definitions in `artplayer-proxy-mediabunny.d.ts` to include new configuration options. - Added comprehensive architecture documentation to clarify the structure and flow of the MediaBunny engine. - Refactored the codebase for improved readability and maintainability, including better naming conventions and JSDoc comments.
ArtPlayer.js
🎨 ArtPlayer.js is a modern and full featured HTML5 video player
・ Online Editor ・ API Document ・ Danmuku ・ Changelog ・ 🤖LLMs ・
Home Page
Mobile Demo
Features
ArtPlayer.js is an easy-to-use and feature-rich HTML5 video player, and most of the player's functional controls support customization, which makes it easy to connect with your business logic. In addition, it directly supports .vtt, .ass and .srt subtitle formats. Integration with other dependencies such as flv.js, hls.js, dash.js, etc. is also very simple. The code is highly decoupled, the structure and logic are clear, and it is easy to track errors and add new features.
Install
Install with npm:
$ npm install artplayer
Or install with yarn:
$ yarn add artplayer
import Artplayer from 'artplayer'
Or umd build also available:
<script src="path/to/artplayer.js"></script>
Or from CDN:
<!-- jsdelivr -->
<script src="https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js"></script>
<!-- unpkg -->
<script src="https://unpkg.com/artplayer/dist/artplayer.js"></script>
Will expose the global variable to window.Artplayer.
Usage
<div class="artplayer-app"></div>
let art = new Artplayer({
container: '.artplayer-app',
url: 'path/to/video.mp4',
})
Plugins
- artplayer-plugin-danmuku
- artplayer-plugin-iframe
- artplayer-plugin-hls-control
- artplayer-plugin-dash-control
- artplayer-plugin-vtt-thumbnail
- artplayer-plugin-multiple-subtitles
- artplayer-plugin-libass
- artplayer-plugin-chromecast
- artplayer-plugin-vast
- artplayer-plugin-chapter
- artplayer-plugin-auto-thumbnail
- artplayer-plugin-ambilight
- artplayer-plugin-document-pip
- artplayer-plugin-danmuku-mask (WIP)
- artplayer-plugin-ads (WIP)
- artplayer-plugin-asr (WIP)
- artplayer-plugin-liquid-glass (WIP)
Libraries
Proxys
- Canvas
- Mediabunny (WIP)
Changelog
Contributing
Donations
We accept donations through these channels:
QQ Group
License
MIT © Harvey Zack



