JSFiddle - React, Tailwind, and code Playground
by jeanlescure
JavaScript
var canvas = document.createElement("canvas");
var context = canvas.getContext("2d");
var txt = "Raise Hand";
context.textBaseline = "top";
context.font = "14px 'Arial'";
context.textBaseline = "alphabetic";
context.fillStyle = "#BADA55";
context.fillRect(125,1,62,20);
context.fillStyle = "#069";
context.fillText(txt, 2, 15);
context.fillStyle = "rgba(102, 0, 204, 0.7)";
context.fillText(txt, 4, 17);
function bin2hex(s){
var i;
var l;
var o = '';
var n;
s += '';
for (i = 0, l = s.length; i < l; i++){
n = s.charCodeAt(i).toString(16);
o += n.length < 2 ? '0' + n : n;
}
return o;
}
PADCHAR = '=';
ALPHA = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
function makeDOMException(){
var e;
var tmp;
try{
return new DOMException(DOMException.INVALID_CHARACTER_ERR);
}catch (tmp){
var ex = new Error("DOM Exception 5");
ex.code = ex.number = 5;
ex.name = ex.description = "INVALID_CHARACTER_ERR";
ex.toString = function() { return 'Error: ' + ex.name + ': ' + ex.message; };
return ex;
}
}
function getbyte64(s,i) {
var idx = ALPHA.indexOf(s.charAt(i));
if (idx === -1) {
throw makeDOMException();
}
return idx;
}
function atob(s){
s = '' + s;
var pads;
var i;
var b10;
var imax = s.length;
if (imax === 0){
return s;
}
if (imax % 4 !== 0){
throw makeDOMException();
}
pads = 0
if (s.charAt(imax - 1) === PADCHAR){
pads = 1;
if (s.charAt(imax - 2) === PADCHAR){
pads = 2;
}
imax -= 4;
}
var x = [];
for (i = 0; i < imax; i += 4){
b10 = (getbyte64(s,i) << 18) | (getbyte64(s,i+1) << 12) | (getbyte64(s,i+2) << 6) | getbyte64(s,i+3);
x.push(String.fromCharCode(b10 >> 16, (b10 >> 8) & 0xff, b10 & 0xff));
}
switch (pads) {
case 1:
b10 = (getbyte64(s,i) << 18) | (getbyte64(s,i+1) << 12) | (getbyte64(s,i+2) << 6);
x.push(String.fromCharCode(b10 >> 16, (b10 >> 8) & 0xff));
break;
case 2:
b10 =...