JSFiddle - React, Tailwind, and code Playground

by Rolf

HTML

<fieldset id="control">
<label><span>Seed string:</span><input name="seed" value="Hello World. "></label>
<label><span>Duplications:</span><input name="dups" value="20"></label>
<button onclick="runtest()">GO</button>
</fieldset>
<output id="out">
</output>

CSS

html, body { margin: 0; padding: 0; }
body {
   height: 100vh;
   display: flex; flex-direction: column; 
}
label { display: flex; margin-bottom:0.5em;}
label span { flex: 0 0 6em;}
label input { flex: 1 0 auto; }
#control {  flex: 0 0 auto; background-color: #ffc; padding: 0.5em;}
#out { flex: 1 0 auto; font: 0.9rem monospace; background-color: #ddd;}
#out.active { background-color: #fdd; }
#out.done { background-color: #dfd; }

JavaScript

console.clear();
var Rost64 = {
    b64a: 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=',
    decode: function(str){
        str = str.replace(/\n/g, '');
        var binlen = 3/4 * str.length;
        if(str.length %4){
            alert('Wrong Length Base64 String');
            return;
        }
        if(str.match(/==$/)){
            binlen -= 2;
        }
        else if(str.match(/=$/)){
            binlen -= 1;
        }

        var buffer = new ArrayBuffer(binlen);
        var t = 0;
        var dv = new DataView(buffer);
        for(var i = 0; i < str.length; i += 4){
            var a1 = this.b64a.indexOf(str[i+0]);
            var a2 = this.b64a.indexOf(str[i+1]);
            var a3 = this.b64a.indexOf(str[i+2]);
            var a4 = this.b64a.indexOf(str[i+3]);
            var b1 = (a1 << 2) | (a2 >> 4);
            var b2 = ((a2 & 0x0f) << 4) | (a3 >> 2);
            var b3 = ((a3 & 3) << 6) | a4;


            if(a1 != 64 && a2 != 64) dv.setUint8(t+0, b1);
            if(a2 != 64 && a3 != 64) dv.setUint8(t+1, b2);
            if(a3 != 64 && a4 != 64) dv.setUint8(t+2, b3);
            t += 3;
        }
        return(buffer);
    },

    encode: function(buffer, wrap){
        var xwrap = 0;
        var res64 = "";
        var mod3 = buffer.byteLength % 3;
        if(mod3 == 2){
            buffer = appendBuffer(buffer, new Uint8Array(1));
        }
        else if(mod3 == 1){
            buffer = appendBuffer(buffer, new Uint8Array(2));
        }
        var uha = new Uint8Array(buffer);
        for(var i = 0; i < buffer.byteLength; i += 3){
            var z1 = uha[i+0];
            var z2 = uha[i+1];
            var z3 = uha[i+2];
            var n1 = z1 >> 2;
            var n2 = (z1 & 3) << 4 | (z2 >> 4);
            var n3 = (z2 & 0x0f) << 2 | (z3 >> 6);
            var n4 = z3 & 0x3F;
            res64 = res64.concat(this.b64a[n1] + this.b64a[n2] + this.b64a[n3] + this.b64a[n4]);

            if(wrap){
               ...