diff --git a/src/components/WatchVideo.vue b/src/components/WatchVideo.vue index 2e881a55..25a4a0b0 100644 --- a/src/components/WatchVideo.vue +++ b/src/components/WatchVideo.vue @@ -95,6 +95,9 @@ />
+ @@ -699,6 +702,21 @@ export default { if (paramStr.length > 0) url += "&" + paramStr; this.$router.push(url); }, + downloadCurrentFrame() { + const video = document.querySelector("video"); + const canvas = document.createElement("canvas"); + canvas.width = video.videoWidth; + canvas.height = video.videoHeight; + + const context = canvas.getContext("2d"); + context.drawImage(video, 0, 0, canvas.width, canvas.height); + + let link = document.createElement("a"); + const currentTime = Math.round(video.currentTime * 1000) / 1000; + link.download = `${this.video.title}_${currentTime}s.png`; + link.href = canvas.toDataURL(); + link.click(); + }, }, }; diff --git a/src/locales/en.json b/src/locales/en.json index d35a3913..1b73aeba 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -144,7 +144,8 @@ "okay": "Okay", "show_search_suggestions": "Show search suggestions", "delete_automatically": "Delete automatically after", - "generate_qrcode": "Generate QR Code" + "generate_qrcode": "Generate QR Code", + "download_frame": "Download frame" }, "comment": { "pinned_by": "Pinned by {author}",