JSFiddle - React, Tailwind, and code Playground

by c_kick

HTML

<input type="button" id="generate" value="Generate">
<div id="generated"></div>
<br/>
<div id="status">Press 'generate'</div>

JavaScript

var Array1 = new Array(
    "Sentence 1 - A ",
    "Sentence 1 - B ",
    "Sentence 1 - C ",
    "Sentence 1 - D ",
    "Sentence 1 - E ",
    "Sentence 1 - F ",
    "Sentence 1 - G "
);

var Array2 = new Array(
    "Sentence 2 - A",
    "Sentence 2 - B",
    "Sentence 2 - C",
    "Sentence 2 - D",
    "Sentence 2 - E",
    "Sentence 2 - F",
    "Sentence 2 - G"
);

var Array3 = new Array(
    "Sentence 3 - A",
    "Sentence 3 - B",
    "Sentence 3 - C",
    "Sentence 3 - D",
    "Sentence 3 - E",
    "Sentence 3 - F",
    "Sentence 3 - G"
);

//define acceptable combinations of arrays
var combo0 = new Array(Array1, Array2); 
var combo1 = new Array(Array1, Array2, Array3);

//define global vars
var i = 0;
var times = 8;
var speed = 140;
var content = '';

//write sentence to box. If counter is a multiple of the 'times' var: append instead of write
function showMessage(msg, counter){
    $('div#generated').html(content+msg);
    if(counter % times === 0) {
        content = $('div#generated').html();
    }
}

//Generate from array 'list', simulating a 'slot machine
function Generate(list, i, callbackFnk) {
    if (!(i >= 0)) { i= 0; }
    setTimeout((function(msg){
        i++;
        return function(){
            if(i % times != 0){
                Generate(list, i, callbackFnk);
            }
            showMessage(msg, i);
            if(i % times === 0 && i>0 && callbackFnk) {
                callbackFnk.call(this, i);
            }
        }
    })(
        list[Math.floor(Math.random() * list.length)]
    ), speed);
}

$(document).ready(function () {

    $('input#generate').click(function(){
        $(this).attr("disabled", true); //disable button
        content = ''; //reset content
        $('div#status').html('Running..'); //show status
        
        Generate(combo0[0], i, function(i) { //generate from first array element of combo0, callback to generating from second array of combo0
            Generate(combo0[1], i, function(i) {
               ...