mirrors/DPlayer
1
0
Fork 0
mirror of https://github.com/DIYgod/DPlayer synced 2024-11-22 18:56:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

work with backend v3

Browse Source
This commit is contained in:
DIYgod 2018-07-04 01:12:46 +08:00
parent d1d068ffb9
commit 046e8ee6b4
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
6 changed files with 48 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
demo/demo.js
View File

@ -29,7 +29,7 @@ function initPlayers () {
},
danmaku: {
id: '9E2E3368B56CDBB4',
api: 'https://api.prprpr.me/dplayer/'
api: 'https://dan.prprpr.me/'
}
});
@ -60,7 +60,7 @@ function initPlayers () {
},
danmaku: {
id: '9E2E3368B56CDBB4',
api: 'https://api.prprpr.me/dplayer/',
api: 'https://dan.prprpr.me/',
token: 'tokendemo',
maximum: 3000,
user: 'DIYgod',
@ -209,7 +209,7 @@ function switchDPlayer () {
type: 'auto',
}, {
id: '5rGf5Y2X55qu6Z2p',
api: 'https://api.prprpr.me/dplayer/',
api: 'https://dan.prprpr.me/',
maximum: 3000,
user: 'DIYgod'
});
@ -221,7 +221,7 @@ function switchDPlayer () {
type: 'auto'
}, {
id: '9E2E3368B56CDBB42',
api: 'https://api.prprpr.me/dplayer/',
api: 'https://dan.prprpr.me/',
maximum: 3000,
user: 'DIYgod'
});

2
src/js/api.js
View File

@ -44,7 +44,7 @@ export default {
read: (endpoint, callback) => {
SendXMLHttpRequest(endpoint, null, (xhr, response) => {
callback(null, response.danmaku);
callback(null, response.data);
}, (xhr, response) => {
callback({ status: xhr.status, response });
}, (xhr) => {

6
src/js/comment.js
View File

@ -1,3 +1,5 @@
import utils from './utils';
class Comment {
constructor (player) {
this.player = player;
@ -81,8 +83,8 @@ class Comment {
this.player.danmaku.send({
text: this.player.template.commentInput.value,
color: this.player.container.querySelector('.dplayer-comment-setting-color input:checked').value,
type: this.player.container.querySelector('.dplayer-comment-setting-type input:checked').value
color: utils.color2Number(this.player.container.querySelector('.dplayer-comment-setting-color input:checked').value),
type: parseInt(this.player.container.querySelector('.dplayer-comment-setting-type input:checked').value),
}, () => {
this.player.template.commentInput.value = '';
this.hide();

21
src/js/danmaku.js
View File

@ -1,3 +1,5 @@
import utils from './utils';
class Danmaku {
constructor (options) {
this.options = options;
@ -21,10 +23,10 @@ class Danmaku {
load () {
let apiurl;
if (this.options.api.maximum) {
apiurl = `${this.options.api.address}v2/?id=${this.options.api.id}&max=${this.options.api.maximum}`;
apiurl = `${this.options.api.address}v3/?id=${this.options.api.id}&max=${this.options.api.maximum}`;
}
else {
apiurl = `${this.options.api.address}v2/?id=${this.options.api.id}`;
apiurl = `${this.options.api.address}v3/?id=${this.options.api.id}`;
}
const endpoints = (this.options.api.addition || []).slice(0);
endpoints.push(apiurl);
@ -67,11 +69,10 @@ class Danmaku {
results[i] = [];
}
else {
const typeMap = ['right', 'top', 'bottom'];
if (data) {
results[i] = data.map((item) => ({
time: item[0],
type: typeMap[item[1]],
type: item[1],
color: item[2],
author: item[3],
text: item[4]
@ -94,14 +95,14 @@ class Danmaku {
send (dan, callback) {
const danmakuData = {
token: this.options.api.token,
player: this.options.api.id,
id: this.options.api.id,
author: this.options.api.user,
time: this.options.time(),
text: dan.text,
color: dan.color,
type: dan.type
};
this.options.apiBackend.send(this.options.api.address + 'v2/', danmakuData, callback);
this.options.apiBackend.send(this.options.api.address + 'v3/', danmakuData, callback);
this.dan.splice(this.danIndex, 0, danmakuData);
this.danIndex++;
@ -208,11 +209,9 @@ class Danmaku {
const docFragment = document.createDocumentFragment();
for (let i = 0; i < dan.length; i++) {
if (!dan[i].type) {
dan[i].type = 'right';
}
dan[i].type = utils.number2Type(dan[i].type);
if (!dan[i].color) {
dan[i].color = '#fff';
dan[i].color = 16777215;
}
const item = document.createElement('div');
item.classList.add('dplayer-danmaku-item');
@ -224,7 +223,7 @@ class Danmaku {
item.innerHTML = dan[i].text;
}
item.style.opacity = this._opacity;
item.style.color = dan[i].color;
item.style.color = utils.number2Color(dan[i].color);
item.addEventListener('animationend', () => {
this.container.removeChild(item);
});

27
src/js/utils.js
View File

@ -88,7 +88,32 @@ const utils = {
dragStart: isMobile ? 'touchstart' : 'mousedown',
dragMove: isMobile ? 'touchmove' : 'mousemove',
dragEnd: isMobile ? 'touchend' : 'mouseup'
}
},
color2Number: (color) => {
if (color[0] === '#') {
color = color.substr(1);
}
if (color.length === 3) {
color = `${color[0]}${color[0]}${color[1]}${color[1]}${color[2]}${color[2]}`;
}
return parseInt(color, 16) + 0x000000 & 0xffffff;
},
number2Color: (number) => '#' + ('00000' + number.toString(16)).slice(-6),
number2Type: (number) => {
switch (number) {
case 0:
return 'right';
case 1:
return 'top';
case 2:
return 'bottom';
default:
return 'right';
}
},
};
export default utils;

6
src/template/player.art
View File

@ -55,15 +55,15 @@
<div class="dplayer-comment-setting-type">
<div class="dplayer-comment-setting-title">{{ tran('Set danmaku type') }}</div>
<label>
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="top">
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="1">
<span>{{ tran('Top') }}</span>
</label>
<label>
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="right" checked>
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="0" checked>
<span>{{ tran('Rolling') }}</span>
</label>
<label>
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="bottom">
<input type="radio" name="dplayer-danmaku-type-{{ index }}" value="2">
<span>{{ tran('Bottom') }}</span>
</label>
</div>