Android drawImage to canvas from paused video
I'm having a really weird problem and I can't tell if it's an Android issue or something.
Basically I have a video that is playing and every time a pause is selected, I want to take a screenshot using the HTML5 canvas technique drawImage()
and add it to the canvas. This works fine in the first pause, but after I start the video again and in any subsequent pause, it drawImage()
draws the image the first time I stop on the canvas. The code works fine in Chrome / Firefox, but not on my Android device.
I have included the code below, any advice would be great.
document.addEventListener('DOMContentLoaded', function(){
document.getElementById('v').addEventListener('pause',myHandler,false);
function myHandler(e) {
if(!e) { e = window.event; }
//i even remove the canvas from the stage
$( '#c' ).remove();
//and re add a canvas to the dom
$('#canvasdrawer').html('<canvas id="c"></canvas>');
var canvas = document.getElementById('c');
var context = canvas.getContext('2d');
var cw = Math.floor(canvas.clientWidth / 100);
var ch = Math.floor(canvas.clientHeight / 100);
canvas.width = cw;
canvas.height = ch;
setTimeout(function(){
alert("timeout running");
//i have even tried to put it in a timeout to almost force refresh but that doesnt help
context.drawImage(document.getElementById('v'),0,0,cw,ch);
}, 2000);
}
},false);
+3
source to share
No one has answered this question yet
Check out similar questions: