mirror of
https://github.com/DIYgod/DPlayer
synced 2024-11-22 18:56:54 +00:00
3.2 KiB
3.2 KiB
DPlayer
Wow, such a lovely HTML5 danmaku video player
Introduction
Notice: This player is still under development.
Install
$ npm install dplayer --save
Usage
HTML
<link rel="stylesheet" href="DPlayer.min.css">
<!-- ... -->
<div id="player1" class="dplayer"></div>
<!-- ... -->
<script src="DPlayer.min.js"></script>
JS
var dp = new DPlayer(option);
dp.init();
Options
var option = {
element: document.getElementById('player1'), // Optional, player element
autoplay: false, // Optional, autoplay video, not supported by mobile browsers
theme: '#FADFA3', // Optional, theme color, default: #b7daff
loop: true, // Optional, loop play music, default: true
video: { // Required, video info
url: '若能绽放光芒.mp4', // Required, video url
pic: '若能绽放光芒.png' // Optional, music picture
},
danmaku: { // Optional, showing danmaku
id: '9E2E3368B56CDBB4', // Required, danmaku id, MUST BE UNIQUE
api: 'https://dplayer.daoapp.io/', // Required, danmaku api
token: 'tokendemo' // Optional, danmaku token for api
}
}
API
dp.init()
dp.play()
dp.pause()
Event binding
dp.on(event, handler)
event
:
play
: Triggered when DPlayer start playpause
: Triggered when DPlayer pausedcanplay
: Triggered when enough data is available that DPlayer can be playedplaying
: Triggered periodically when DPlayer is playingended
: Triggered when DPlayer endederror
: Triggered when an error occurs
Work with module bundler
var DPlayer = require('DPlayer');
var dp = new DPlayer({
// ...
});
Run in development
$ npm install
$ npm run dev
Make a release
$ npm install
$ npm run build
Related Projects
Todo
-
中英文切换
-
微博登录
-
锁定IP规则
-
icon 动画
LICENSE
MIT © DIYgod