Javascript-форум - Повтор фото (getUserMedia(),HTML5 Canvas)

Здравствуйте,есть скрипт,который делает захват видео с вебкамеры и делает с нее фотографию.
Используется getUserMedia() для видео и Canvas для снятия фотографии.
Все работает,фотография делается после нажатия кнопки "Фотогрфировать". Но мне нужно чтобы после нажатия кнопки "Запустить" фотография делалась автоматически каждые N секунд.

Пытался сделать так
setInterval(captureMe,1000);

Но ничего не получилось..
В общем пример: http://aspex.wen.ru
Исходник:

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title></title>
        <style>
body{text-align:center;font-family:arial;font-family:"Abel",Helvetica,sans-serif}.stuff{display:none}.item{display:inline-block;width:300px;margin:20px 10px;background:#fff;padding:10px 0px}.item span{padding-bottom:15px;display:block;font-size:36px;color:#646464}video,canvas{width:266px;height:200px;background:rgba(0,0,0,.1)}input{display:block;width:100%}img{width:128px;height:96px;margin:6px}video{transform:scaleX(-1);-o-transform:scaleX(-1);-ms-transform:scaleX(-1);-moz-transform:scaleX(-1);-webkit-transform:scaleX(-1)}#allow{min-height:40px;line-height:40px;font-size:20px;color:#fff;border:2px solid #fff;background:#e67e22}.button{display:inline-block;cursor:pointer;padding:.75em 1em;-webkit-border-radius:2px;border-radius:2px;font:1.25em "Abel",Helvetica,sans-serif;color:rgba(255,255,255,1);background:#62ac15;text-shadow:0 -1px 0 #5b8111;border:none;outline:none;display:none}.button:hover{background:#6fba22;-webkit-transition:all 200ms cubic-bezier(.42,0,.58,1) 10ms;-moz-transition:all 200ms cubic-bezier(.42,0,.58,1) 10ms;-o-transition:all 200ms cubic-bezier(.42,0,.58,1) 10ms;transition:all 200ms cubic-bezier(.42,0,.58,1) 10ms}.button:active{-webkit-box-shadow:0 1px 4px 0 #416917 inset;box-shadow:0 1px 4px 0 #416917 inset}#buttonStart{margin-top:200px}@media only screen and (max-width:680px){.item2{display:none}}</style>
        <link async href="http://fonts.googleapis.com/css?family=Abel" data-generated="http://enjoycss.com" rel="stylesheet" type="text/css"/>

        <script>

          window.onload = function(){
            var canvas = document.getElementById('canvas');
            var video = document.getElementById('video');
            var button = document.getElementById('button');
            var allow = document.getElementById('allow');
            var buttonStart = document.getElementById('buttonStart');
            var stuff = document.getElementById('stuff');

            var context = canvas.getContext('2d');
            var videoStreamUrl = false;

            buttonStart.style.display = 'block';

            buttonStart.addEventListener('click', function(){



                buttonStart.style.display = 'none';
                stuff.style.display = 'block';

                button.addEventListener('click', captureMe);


                // navigator.getUserMedia  и   window.URL.createObjectURL (смутные времена браузерных противоречий 2012 :) )
                navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
                window.URL.createObjectURL = window.URL.createObjectURL || window.URL.webkitCreateObjectURL || window.URL.mozCreateObjectURL || window.URL.msCreateObjectURL;
                console.log('request',navigator.getUserMedia);
                // запрашиваем разрешение на доступ к поточному видео камеры
                navigator.getUserMedia({video: true}, function(stream) {
                  // разрешение от пользователя получено
                  // скрываем подсказку
                  allow.style.display = "none";
                  // получаем url поточного видео
                  videoStreamUrl = window.URL.createObjectURL(stream);
                  // устанавливаем как источник для  video
                  video.src = videoStreamUrl;
                  button.style.display = 'block';
                }, function(){
                  console.log('что-то не так с видеостримом :P');
                });
            });

            var captureMe = function(){
                //alert(1)
              if(!videoStreamUrl) alert('То-ли вы не нажали "разрешить" в верху окна, то-ли что-то не так с вашим видео стримом')
              // переворачиваем канвас зеркально по горизонтали
              context.translate(canvas.width, 0);
              context.scale(-1, 1);
              // отрисовываем на канвасе текущий кадр видео
              context.drawImage(video, 0, 0, video.width, video.height);
              // получаем data: url изображения на c canvas
              var base64dataUrl = canvas.toDataURL('image/png');
              context.setTransform(1, 0, 0, 1, 0, 0); // убираем все кастомные трансформации canvas
              // на этом этапе можно спокойно отправить  base64dataUrl на сервер и сохранить его там как файл (ну или типа того)
              // но мы добавим эти тестовые снимки в наш пример:
              var img = new Image();
              img.src = base64dataUrl;
            }


        }; 

</script>

</head>

<body>

<div class="stuff" id="stuff">
<div id="allow">▲ ▲ ▲ Разрешите использовать камеру ▲ ▲ ▲ <br/> ( Сверху текущей страницы )</div>

<div class="item item1">
<span> HTML5 Видео </span>
<video id="video" width="320" height="240" autoplay="autoplay" ></video>
</div>
<div class="item item2">
<span> Canvas фото </span>
<canvas id="canvas" width="320" height="240" ></canvas>
</div>

<input id="button" type="button" class="button" value="Фотографировать" />
</div>
<input id="buttonStart" type="button" class="button" value="Запустить" />


</body>
</html>