From 992977d6c6273eaa646279db63ac5460abcc366b Mon Sep 17 00:00:00 2001
From: Christopher Willis-Ford <cwillisf@media.mit.edu>
Date: Wed, 30 Jan 2019 10:58:10 -0800
Subject: [PATCH] Add debug canvas support to isTouching CPU path

---
 src/RenderWebGL.js | 30 ++++++++++++++++++++----------
 1 file changed, 20 insertions(+), 10 deletions(-)

diff --git a/src/RenderWebGL.js b/src/RenderWebGL.js
index f9de5bb..a661b15 100644
--- a/src/RenderWebGL.js
+++ b/src/RenderWebGL.js
@@ -736,6 +736,12 @@ class RenderWebGL extends EventEmitter {
             (this._forceGPU ? 0 : Infinity) :
             __cpuTouchingColorPixelCount;
 
+        const debugCanvasContext = this._debugCanvas && this._debugCanvas.getContext('2d');
+        if (debugCanvasContext) {
+            this._debugCanvas.width = bounds.width;
+            this._debugCanvas.height = bounds.height;
+        }
+
         // if there are just too many pixels to CPU render efficiently, we need to let readPixels happen
         if (bounds.width * bounds.height * (candidates.length + 1) >= maxPixelsForCPU) {
             this._isTouchingColorGpuStart(drawableID, candidates.map(({id}) => id).reverse(), bounds, color3b, mask3b);
@@ -746,23 +752,27 @@ class RenderWebGL extends EventEmitter {
         const color = __touchingColor;
         const hasMask = Boolean(mask3b);
 
+        // Scratch Space - +y is top
         for (let y = bounds.bottom; y <= bounds.top; y++) {
             if (bounds.width * (y - bounds.bottom) * (candidates.length + 1) >= maxPixelsForCPU) {
                 return this._isTouchingColorGpuFin(bounds, color3b, y - bounds.bottom);
             }
-            // Scratch Space - +y is top
             for (let x = bounds.left; x <= bounds.right; x++) {
                 point[1] = y;
                 point[0] = x;
-                if (
-                    // if we use a mask, check our sample color
-                    (hasMask ?
-                        maskMatches(Drawable.sampleColor4b(point, drawable, color), mask3b) :
-                        drawable.isTouching(point)) &&
-                    // and the target color is drawn at this pixel
-                    colorMatches(RenderWebGL.sampleColor3b(point, candidates, color), color3b, 0)
-                ) {
-                    return true;
+                // if we use a mask, check our sample color...
+                if (hasMask ?
+                    maskMatches(Drawable.sampleColor4b(point, drawable, color), mask3b) :
+                    drawable.isTouching(point)) {
+                    RenderWebGL.sampleColor3b(point, candidates, color);
+                    if (debugCanvasContext) {
+                        debugCanvasContext.fillStyle = `rgb(${color[0]},${color[1]},${color[2]})`;
+                        debugCanvasContext.fillRect(x - bounds.left, bounds.bottom - y, 1, 1);
+                    }
+                    // ...and the target color is drawn at this pixel
+                    if (colorMatches(color, color3b, 0)) {
+                        return true;
+                    }
                 }
             }
         }