xiaoxue_admin
/
DPlayer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

generate screenshot by blob and createObjectURL

This commit is contained in:
DIYgod 2018-02-23 22:56:14 +08:00
parent 94f8dea831
commit d3847a30a0
No known key found for this signature in database
GPG Key ID: EC0B76A252D3EF67
2 changed files with 15 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/js/controller.js
View File

@ -200,14 +200,23 @@ class Controller {
initScreenshotButton () {
if (this.player.options.screenshot) {
this.player.template.camareButton.addEventListener('click', () => {
const canvas = document.createElement("canvas");
const canvas = document.createElement('canvas');
canvas.width = this.player.video.videoWidth;
canvas.height = this.player.video.videoHeight;
canvas.getContext('2d').drawImage(this.player.video, 0, 0, canvas.width, canvas.height);
const dataURL = canvas.toDataURL();
this.player.template.camareButton.href = dataURL;
this.player.template.camareButton.download = "DPlayer.png";
let dataURL;
canvas.toBlob((blob) => {
dataURL = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = dataURL;
link.download = 'DPlayer.png';
link.style.display = 'none';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(dataURL);
});
this.player.events.trigger('screenshot', dataURL);
});

4
src/template/player.art
View File

@ -111,9 +111,9 @@
</div>
{{ /if }}
{{ if options.screenshot }}
<a href="#" class="dplayer-icon dplayer-camera-icon" data-balloon="{{ tran('Screenshot') }}" data-balloon-pos="up">
<div class="dplayer-icon dplayer-camera-icon" data-balloon="{{ tran('Screenshot') }}" data-balloon-pos="up">
<span class="dplayer-icon-content">{{@ icons.camera }}</span>
</a>
</div>
{{ /if }}
<div class="dplayer-comment">
<button class="dplayer-icon dplayer-comment-icon" data-balloon="{{ tran('Send danmaku') }}" data-balloon-pos="up">