JSFiddle - React, Tailwind, and code Playground

by Johnny Turpin

HTML

<script src="http://dl.dropbox.com/u/1131693/bloodrop/sylvester.js"></script>
<div class="logger">
</div>
<div id="canvasborder">
    <canvas id="canvas" width="600" height="600"></canvas>
</div>

CSS

.logger {
    width: 100%;
    height: 200px;
    border: 1px solid #dddddd;
    overflow: scroll;
    font: 12px monospace;
}

#canvasborder {
    width: 600px;
    height: 600px;
    border-color: black;
    border: solid 20px;
}

JavaScript

// various source test patterns - it is assumed that these test patterns are not optimized yet
var bigRedSquare = [[-30000,-30000,0xff0000],[30000,-30000,0xff0000],[30000,30000,0xff0000],[-30000,30000,0xff0000],[-30000,-30000,0xff0000]];
var twoPoints = [[-30000,30000,0xffffff],[-30000,30000,0x000000],[30000,-30000,0xffffff],[30000,-30000,0x000000]];
var angleTest = [[0,0,0xffffff],[4000,4000,0xffffff], [8000,8000,0xffffff]];   

var ildaPattern = [ [ 12984, -32767, 0 ], [ 10412, -32767, 0 ], [ 7840, -32767, 0 ], [ 5271, -32767, 0 ], [ 2703, -32767, 0 ], [ 131, -32767, 0 ], [ -2437, -32767, 0 ], [ -5009, -32767, 0 ], [ -7577, -32767, 0 ], [ -10145, -32767, 0 ], [ -12722, -32767, 0 ], [ -15286, -32767, 0 ], [ -17858, -32767, 0 ], [ -20426, -32767, 16777215 ], [ -22998, -32767, 16777215 ], [ -25566, -32767, 16777215 ], [ -28135, -32767, 16777215 ], [ -30707, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -32767, 16777215 ], [ -32767, -30723, 16777215 ], [ -32767, -28159, 16777215 ], [ -32767, -25603, 16777215 ], [ -32767, -23047, 16777215 ], [ -32767, -20488, 16777215 ], [ -32767, -17932, 16777215 ], [ -32767, -15372, 16777215 ], [ -32767, -10256, 16777215 ], [ -32767, -5140, 16777215 ], [ -32767, -25, 16777215 ], [ -32767, 5091, 16777215 ], [ -32767, 10207, 16777215 ], [ -32767, 15323, 16777215 ], [ -32767, 17883, 16777215 ], [ -32767, 20438, 16777215 ], [ -32767, 22998, 16777215 ], [ -32767, 25554, 16777215 ], [ -32767, 28110, 16777215 ], [ -32767, 30674, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -32767, 32767, 16777215 ], [ -30707, 32767, 16777215 ], [ -28135, 32767, 16777215 ], [ -25566, 32767,...