From f12039fd1efd6d98c33138314e5db478c412c34b Mon Sep 17 00:00:00 2001
From: Isaiah Odhner <isaiahodhner@gmail.com>
Date: Wed, 13 Jun 2018 22:28:36 -0400
Subject: [PATCH] Draw outline with WebGL

It works!
---
 wip/libtess-example.html |  8 +++++++-
 wip/src/webgl-draw.js    | 10 +++++++---
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/wip/libtess-example.html b/wip/libtess-example.html
index 928f18f..62b2a34 100644
--- a/wip/libtess-example.html
+++ b/wip/libtess-example.html
@@ -45,7 +45,13 @@
         polyTriangles = triangulate(contours);
         initArrayBuffer(polyTriangles);
 
-        draw(filledMode);
+        draw(filledMode, [0.1, 0.8, 0.08, 1.0]);
+
+        for(var i=0; i<contours.length; i++){
+          var contour = contours[i];
+          initArrayBuffer(contour);
+          draw(false, [0, 0, 0, 1.0]);
+        }
       }
 
       function generateFunkyFreshLoop(count, ccw, radius, noiseSize) {
diff --git a/wip/src/webgl-draw.js b/wip/src/webgl-draw.js
index f9f8a99..36e0210 100644
--- a/wip/src/webgl-draw.js
+++ b/wip/src/webgl-draw.js
@@ -3,6 +3,7 @@
 var gl;
 var polyProgram;
 var positionLoc;
+var colorLoc;
 var polygonArrayBuffer;
 var triangleCount = 0;
 
@@ -15,9 +16,12 @@ function initWebGL(canvas) {
   polyProgram = createShaderProgram();
   positionLoc = gl.getAttribLocation(polyProgram, 'position');
   gl.enableVertexAttribArray(positionLoc);
+  colorLoc = gl.getUniformLocation(polyProgram, 'color');
 }
 
-function draw(fillPolygon) {
+// TODO: to be consistent, maybe this should be setColor and then draw but whatever
+function draw(fillPolygon, color) {
+  gl.uniform4fv(colorLoc, color);
   var renderType = fillPolygon ? gl.TRIANGLES : gl.LINE_LOOP;
   gl.drawArrays(renderType, 0, triangleCount);
 }
@@ -56,9 +60,9 @@ function createShaderProgram() {
   // create fragment shader
   var fragmentSrc = [
     'precision mediump float;',
+    'uniform vec4 color;',
     'void main() {',
-    '  /* set all pixels to green */',
-    '  gl_FragColor = vec4(.1, .8, 0.08, 1.);',
+    '  gl_FragColor = color;',
     '}'
   ].join('');
   var fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);