cleanup

remcoder · Dec 3, 2012 · eaa5ca0 · eaa5ca0
1 parent 0c6216e
commit eaa5ca0
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 31 deletions.
diff --git a/app/index.html b/app/index.html
@@ -46,15 +46,20 @@ <h1 class="title">Retrofy me</h1>
         <script src="scripts/webcam.js"></script>
         <script src="components/retrofy/dist/jquery.retrofy.min.js"></script>
         <script type="text/javascript">
-            var $video = $(Webcam.getVideo())
+
+            // TODO: get WxH from webcam
+            Webcam.setSize(640, 480);
+
+            var $video = $(Webcam.getVideoElement())
                 .attr("title", "click to retrofy")
                 .hide();
             $("#video-placeholder").replaceWith($video);
 
-            var $target = $("#target")
-                .attr("title", "click for original");
-            $target[0].width = Webcam.width();
-            $target[0].height = Webcam.height();
+            var $target = $("#target").attr("title", "click for original");
+            var size = Webcam.getSize();
+            $target[0].width = size.width;
+            $target[0].height = size.height;
+
             var targetCtx = $target[0].getContext("2d");
 
             $(".screen-main").click(function() {
@@ -65,6 +70,7 @@ <h1 class="title">Retrofy me</h1>
             var context = new Context();
             var retrofy = new Retrofy(context);
             var d = new Retrofy.Dashboard(context);
+
             Webcam.capture(function(imgData) {
                 retrofy.convertImageData(imgData);
                 targetCtx.putImageData(imgData,0,0);
@@ -75,6 +81,7 @@ <h1 class="title">Retrofy me</h1>
             }
 
             $(".create-snapshot").click(snapshot);
+
         </script>
 
         <!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->

diff --git a/app/scripts/main.js b/app/scripts/main.js
diff --git a/app/scripts/webcam.js b/app/scripts/webcam.js
@@ -17,15 +17,12 @@ var Webcam = function() {
      */
     function logError(err) { if(console && console.log) console.log('Error!', err); return false; }
 
-    /**
-     * Sets the video dimension
-     */
-    function setVideoDimension(width, height) {
+    function setSize(width, height) {
         video.width = videoCanvas.width = videoWidth = width;
         video.height = videoCanvas.height = videoHeight = height;
     }
 
-    function capture(capture) {
+    function capture(captureImgData) {
         if(typeof navigator.getMedia !== 'function') {
             throw new Error('Error: browser does not support getUserMedia');
         }
@@ -36,50 +33,38 @@ var Webcam = function() {
             video.src = url.createObjectURL(localMediaStream);
             video.play();
             video.onloadedmetadata = logError;
-            // videoWidth = video.videoWidth;
-            // videoHeight = video.videoHeight;
 
-            startLoop(15, localMediaStream, capture, video);
+            startCapture(15, localMediaStream, captureImgData, video);
 
         }, logError);
         return true;
     }
 
-    function startLoop(interval, stream, capture, video) {
-        if(typeof interval !== 'number') interval = 20;
-
-        stopRender();
+    function startCapture(interval, stream, captureImgData, video) {
+        stopCapture();
 
         videoTimer = setInterval(function(){
             if(stream) {
                 var w = videoWidth, h = videoHeight;
                 videoCtx.drawImage(video, 0, 0, w, h);
-                capture(videoCtx.getImageData(0, 0, w, h));
+                captureImgData(videoCtx.getImageData(0, 0, w, h));
             }
         }, interval);
     }
 
-    /**
-     * Allow pause and play for ascii rendering
-     */
-    function stopRender() { if(videoTimer) clearInterval(videoTimer); }
+    function stopCapture() { if(videoTimer) clearInterval(videoTimer); }
 
     function snapshot() {
         window.open(videoCanvas.toDataURL(), "_blank");
     }
 
-    // init WxH
-    setVideoDimension(640, 480);
-
     return {
         capture : capture,
-        getVideo : function() { return video; },
-        setVideoDimension: setVideoDimension,
+        getSize : function() { return { width : videoWidth, height : videoHeight} },
+        getVideoElement : function() { return video; },
+        setSize: setSize,
         snapshot : snapshot,
-        width : function() { return videoWidth; },
-        height : function() { return videoHeight; },
-
-        stopRender: stopRender
+        stopCapture: stopCapture
     };
 
 }();