js　videoタグ　canvas変換　画像生成

<style>canvas{border:1px solid #ccc;}</style>
<video id="video" width="384" height="216" autoplay>
	<source src="bird2.mp4">
</video>
<button id="createImage">画像生成</button>
<canvas id="canvas" width="384" height="216"></canvas>

window.addEventListener('DOMContentLoaded', function() {
	videoControll();
}, false);


function videoControll() {
	var video = document.getElementById('video'),
			createImage = document.getElementById('createImage'),
			canvas = document.getElementById('canvas');
	createImage.addEventListener('click', function() {
		canvas.getContext('2d').drawImage(video, 0, 0, 384, 216);
	}, false);
}