JSFiddle - React, Tailwind, and code Playground

by mauricederegt

HTML

<div class="tm">00:00:00</div>
<div class="p">START</div>
<div class="b4">PAUSE</div>
<div class="b3">RESTART</div>

JavaScript

var bR, bS, tM, oT, tI, hS;
var counts = [], bM = [], pP = [];
var pA = false, mP = 1;

$(document).ready(function() {
    setScale();
    $(window).resize(setScale);
    if (!('ontouchstart' in document)) {
        $('body').addClass('pc');
    }
    $('#p').click(function() {
        gameStart();
    });
    //New
    $('.b4').click(function() {
        clearInterval(tI);
    });
    $('#r').click(function() {
        //tI = setInterval("setTimer()", 1000);
    });
});

//Set timer
function setTimer() {
    var n = new Date();
    tM.text(getTimeText(n.getTime() - oT.getTime()));
}

//Build timer
function getTimeText(v) {
    var vH = Math.floor(v / 3600000);
    var vM = Math.floor((v - (vH * 3600000)) / 60000);
    var vS = Math.floor((v - (vH * 3600000) - (vM * 60000)) / 1000);
    return set2Digit(vH) + ':' + set2Digit(vM) + ':' + set2Digit(vS);
}

function set2Digit(ov) {
    var os = '0' + ov;
    return os.substr(os.length - 2, 2);
}

//Set the timer, high score, hint and reset
function gameStart() {
    setBlocks();
    tM = $('#a1 div.tm');
    hS = $('#a1 div.hs');
    oT = new Date();
    tI = setInterval("setTimer()", 1000);
    setHs();
    $('.ht').click(hint);
    $('.b3').click(reset);
}