JSFiddle - React, Tailwind, and code Playground

by MightyPork

HTML

num <input type="number" id="num" value="37">
<button onclick="num2text()">→</button>
<button onclick="text2num()">←</button>
<input type="text" id="text" value="two"> text

JavaScript

var ty = ['twenty', 'thirty', 'fourty', 'fifty', 'sizty', 'seventy', 'eighty', 'ninety', 'hundred'];
var one = ['zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight', 'nine', 'ten', 'eleven', 'twelve', 'thirteen', 'fourteen', 'fifteen', 'sixteen', 'seventeen', 'eighteen', 'nineteen'];

var out = [];

function toWords(n) {
    if (n == 100) return ty[8];
    if (n < 20) return one[n];
    var out = ty[Math.floor(n/10)-2];
    if (n%10!=0)  out += ' ' + one[n%10];
    return out;
}

function toNum(w) {
    if (typeof w != 'string') return 0;
    w = w.toLowerCase();
    console.log(w);
    if (ty.indexOf(w) !== -1) return (2+ty.indexOf(w))*10;
    if (one.indexOf(w) !== -1) return one.indexOf(w);
    
    if (w.indexOf(' ') !== -1) {
        // halves
        var halves = w.split(' ');
        return toNum(halves[0]) + toNum(halves[1]);
    }
    
    throw 'Failed to parse num.';   
}

function num2text() {
    var num = 1 * document.getElementById('num').value;
    if(!isFinite(num)) num = 0;
    document.getElementById('text').value = toWords(num);
}

function text2num() {
    var txt = document.getElementById('text').value;
    document.getElementById('num').value = toNum(txt);
}