JSFiddle - React, Tailwind, and code Playground

by Paul Esch-Laurent

HTML

<div id="debug"></div>
<div id="output"></div>

CSS

#debug {
    color: red;
    font-weight: bold;
}

#output {
    font-family: monospace;
    color: #333;
}

JavaScript

var num = getRandomIntInclusive(80,92)+8;

out(num+"<br>");
var ctr = 8;

for (i = 0; i < num; i++) {
        if (Math.random() > .5)
            attempt();
        else {
            meh();
        }
  			
  			if (ctr>0 && Math.random()>.8) {
          out("<br>");
          ctr--;
          i++;
        }
  			
}
                       
function getRandomIntInclusive(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function out(input) {
    document.getElementById("output").innerHTML += input;
}

function contains( el, arr ) {
   for (var i in arr) {
       if (arr[i] === el) return true;
   }
   return false;
}

function attempt() {
    //out("an attempt<br>");
 	var vals = [];
    
    var n = getRandomIntInclusive(1,9);
    
    vals.push(n);
    
    while (vals.length < 9) {
     	n = getRandomIntInclusive(1,9);
        if (!contains(n,vals))
            vals.push(n);
    }
    
    for (r = 0; r < 3; r++) {
        for (c = 0; c < 3; c++) {
            if (c == 0)
                out(vals.pop(c));
            else
                out(" "+vals.pop(c));
        }
        out("<br>");
    }
}

function meh() {
    //out("no attempt<br>");
    for (var i = 0; i < 3; i++) {
         for (var j = 0; j < 3; j++) {
            var n = getRandomIntInclusive(1,9);
            if (j == 0)
                out(n);
            else
                out(" " + n);
    	}
        out("<br>");
	}
}