JS equality operator grids
by SecretDeveloper
HTML
<canvas id="gridCanvas" width="1920" height="1080" />
JavaScript
var compareDouble = function(left, right) { return left == right; };
var compareTriple = function(left, right) { return left === right; };
var compareNotDouble = function(left, right) { return left != right; };
var compareNotTriple = function(left, right) { return left !== right; };
var compareLess = function(left, right) { return left < right; };
var compareGreater = function(left, right) { return left > right; };
var compareLessOrEqual = function(left, right) { return left <= right; };
var compareGreaterOrEqual = function(left, right) { return left >= right; };
var vals = [
["false", function() { return false; }],
["0", function() { return 0; }],
['""', function() { return ""; }],
["[[]]", function() { return [[]]; }],
["[]", function() { return []; }],
['"0"', function() { return "0"; }],
["[0]", function() { return [0]; }],
["[1]", function() { return [1]; }],
['"1"', function() { return "1"; }],
["1",function() { return 1; }],
["true", function() { return true; }],
["-1", function() { return -1; }],
['"-1"', function() { return "-1"; }],
["null", function() { return null; }],
["undefined", function() { return undefined; }],
["Infinity", function() { return Infinity; }],
["-Infinity", function() { return -Infinity; }],
['"false"', function() { return "false"; }],
['"true"', function() { return "true"; }],
["{}", function() { return {}; }],
["NaN", function() { return NaN; }]
];
var canvas = document.getElementById("gridCanvas");
var ctx = canvas.getContext("2d");
var height = canvas.height;
var width = canvas.width;
var size = 18; // SIZE of grid squares
var padding = 60; // padding space for labels
var top = -20; // offset from top
var left = 20; // offset from left
var leftPadding = width/4;
var topPadding = 100;
var config = {
background : "#404040",
title :"#FFD800",
label : "#FFD800",
positive : "#4CB200",
negative : "#CD0800",
stroke : "#404040",
...