GuerillaStudio/souvenir
GuerillaStudio/souvenir
1
0
Fork 0
mirror of https://github.com/GuerillaStudio/souvenir.git synced 2024-11-08 10:11:52 +00:00
Code Issues Releases Activity Actions

fix capture

Browse source
This commit is contained in:
wryk 2019-03-10 05:37:22 +01:00
parent 5ae8e036ae
commit cbe8785f99
1 changed files with 46 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

88
src/services/capture.js
View file

@ -7,16 +7,18 @@ const FRAMES_PER_SECOND = 10
const WIDTH = 200
const HEIGHT = WIDTH
const video = document.createElement('video')
const canvas = document.createElement('canvas')
const canvasContext = canvas.getContext('2d')
canvas.width = WIDTH
canvas.height = HEIGHT
export function capture (commit, mediaStream, duration) {
return new Promise((resolve, reject) => {
const video = document.createElement('video')
video.autoplay = true
const canvas = document.createElement('canvas')
canvas.width = WIDTH
canvas.height = HEIGHT
const canvasContext = canvas.getContext('2d')
const totalFrames = duration / 1000 * FRAMES_PER_SECOND
if (totalFrames < 1) {
@ -27,47 +29,49 @@ export function capture (commit, mediaStream, duration) {
video.srcObject = mediaStream
const soureRectangle = crop(makeRectangle(0, 0, video.videoWidth, video.videoHeight))
const destinationRectangle = makeRectangle(0, 0, canvas.width, canvas.height)
video.addEventListener('canplay', () => {
const soureRectangle = crop(makeRectangle(0, 0, video.videoWidth, video.videoHeight))
const destinationRectangle = makeRectangle(0, 0, canvas.width, canvas.height)
const imageDataList = []
const imageDataList = []
const intervalId = setInterval(() => {
if (imageDataList.length < totalFrames) {
console.log(`Capturing frame ${imageDataList.length} / ${totalFrames}`)
const intervalId = setInterval(() => {
if (imageDataList.length < totalFrames) {
console.log(`Capturing frame ${imageDataList.length + 1} / ${totalFrames}`)
canvasContext.drawImage(
video,
soureRectangle.x,
soureRectangle.y,
soureRectangle.width,
soureRectangle.height,
destinationRectangle.x,
destinationRectangle.y,
destinationRectangle.width,
destinationRectangle.height
)
canvasContext.drawImage(
video,
soureRectangle.x,
soureRectangle.y,
soureRectangle.width,
soureRectangle.height,
destinationRectangle.x,
destinationRectangle.y,
destinationRectangle.width,
destinationRectangle.height
)
const imageData = canvasContext.getImageData(
destinationRectangle.x,
destinationRectangle.y,
destinationRectangle.width,
destinationRectangle.height
)
const imageData = canvasContext.getImageData(
destinationRectangle.x,
destinationRectangle.y,
destinationRectangle.width,
destinationRectangle.height
)
imageDataList.push(imageData)
imageDataList.push(imageData)
commit('updateCaptureState', imageDataList.length / totalFrames * 100)
} else {
clearInterval(intervalId)
commit('updateCaptureState', imageDataList.length / totalFrames * 100)
} else {
clearInterval(intervalId)
resolve({
imageDataList,
imageWidth: WIDTH,
imageHeight: HEIGHT,
delayTime
})
}
}, delayTime)
resolve({
imageDataList,
imageWidth: WIDTH,
imageHeight: HEIGHT,
delayTime
})
}
}, delayTime)
})
})
}