Introduction to ArtPlayer
masterArtPlayer.js is a modern, full-featured HTML5 video player designed for high performance and extensive customization.
ArtPlayer.js Documentation
repository·master·Indexed 26 days ago
https://github.com/zhw2590582/artplayerArtPlayer.js is a modern, full-featured HTML5 video player ecosystem. It includes a core player and a wide array of specialized plugins for enhanced media playback, including support for ads (VAST), ambient light, ASR, Danmuku (bullet chat), HLS/DASH control, Chromecast, multiple subtitles, and automatic thumbnail generation. The project provides integration examples for React and Vue 3 using Vite.
What's inside ArtPlayer
Use artplayer-proxy-canvas
masterartplayer-proxy-canvas provides a canvas proxy for ArtPlayer. You can view a live demo of its functionality at the official ArtPlayer website.
https://artplayer.org/?libs=./uncompiled/artplayer-proxy-canvas/index.js&example=canvasUse artplayer-proxy-mediabunny for m3u8 playback
masterThe
artplayer-proxy-mediabunnypackage provides a proxy for ArtPlayer that enablesm3u8playback by leveraging Mediabunny's HLS input support. You can view a live demonstration of this integration at the official ArtPlayer demo site.https://artplayer.org/?libs=./uncompiled/artplayer-proxy-mediabunny/index.js&example=mediabunnyUse artplayer-tool-thumbnail for ArtPlayer
masterThe
artplayer-tool-thumbnailpackage is a utility tool designed to generate thumbnails for ArtPlayer. You can view a live demonstration of its functionality at the official ArtPlayer website.https://artplayer.org/?libs=./uncompiled/artplayer-tool-thumbnail/index.js&example=thumbnailInstall and use artplayer-plugin-ambilight
masterTheartplayer-plugin-ambilightis an ambient light effect plugin for ArtPlayer. It creates an ambient light effect around the video player based on the video content.Use the artplayer-plugin-danmuku-mask plugin
masterTheartplayer-plugin-danmuku-maskis a plugin for ArtPlayer designed to provide a danmuku (bullet chat) mask. You can view a live demo of its functionality to understand how it integrates with the player.Use artplayer-plugin-chapter
masterThe
artplayer-plugin-chapteris a plugin for ArtPlayer that enables chapter support. You can view a live demo of the plugin in action at the official ArtPlayer website.https://artplayer.org/?libs=./uncompiled/artplayer-plugin-chapter/index.js&example=chapterUse artplayer-plugin-vtt-thumbnail
masterThe
artplayer-plugin-vtt-thumbnailis a plugin for ArtPlayer that enables video thumbnail previews using a VTT (WebVTT) file. This allows users to see preview images when scrubbing through the video seek bar.You can view a live demo of the plugin in action at the official ArtPlayer website.
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-vtt-thumbnail/index.js&example=vtt.thumbnailInstall and use artplayer-plugin-document-pip
masterThe
artplayer-plugin-document-pipis a plugin for ArtPlayer that enables Document Picture-in-Picture (PiP) functionality. This allows the video player to be moved into a dedicated floating window using the browser's Document Picture-in-Picture API.You can view a live demo of the plugin in action at the official ArtPlayer website.
https://artplayer.org/?libs=./uncompiled/artplayer-plugin-document-pip/index.js&example=document.pipInstall and use artplayer-plugin-asr
masterThe
artplayer-plugin-asris an Automatic Speech Recognition (ASR) plugin for ArtPlayer. You can view a live demonstration of its capabilities at the official ArtPlayer demo site.https://artplayer.org/?libs=./uncompiled/artplayer-plugin-asr/index.js&example=asrInstall and use artplayer-plugin-ads
masterThe
artplayer-plugin-adsis a plugin for ArtPlayer designed to handle advertisements within the player. You can view a live demonstration of the plugin in action at the official ArtPlayer demo site.https://artplayer.org/?libs=./uncompiled/artplayer-plugin-ads/index.js&example=adsInstall and use artplayer-plugin-dash-control
masterTheartplayer-plugin-dash-controlprovides DASH (Dynamic Adaptive Streaming over HTTP) control capabilities for ArtPlayer. It is designed to work alongsidedash.jsto manage DASH playback features within the ArtPlayer interface.