JSFiddle - React, Tailwind, and code Playground

by electronoob

HTML

<canvas id=can width=700 height=300></canvas>

CSS

canvas {
  margin-top: 100px;
  border: 2px solid white;
}

JavaScript

//morsecode dictionary test
/*****
I stole the lookup table from morsemidi
******/
ctx = can.getContext("2d");
var font = "\"Courier New\", Courier, monospace";
var size = 64;
var charpad = size / 2;
var currentWord;
var currentWordWidths = [];
var currentWordMorse;
var tightness = 3;
var blur = 4;
var find =  ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","1","2","3","4","5","6","7","8","9","0",".",",",":","?","'","-","/","(",")","\"","=","_","%",";","{FRC}","{SN}","{ERR}","{AS}","{COM}","{AR}","{SK}","{SOS}"];


var replace = [".-","-...","-.-.","-..",".","..-.","--.","....","..",".---","-.-",".-..","--","-.","---",".--.","--.-",".-.","...","-","..-","...-",".--","-..-","-.--","--..",".----","..---","...--","....-",".....","-....","--...","---..","----.","-----",".-.-.-","--..--","---...","..--..",".----.","-....-","-..-.","-.--.","-.--.-",".-..-.","-...-","..--.-",".--.-.-.","-.-.-.",".-..-","...-.","........",".-...","-.-.-",".-.-.","...-.-","...---..."];

var words =...