JSFiddle - React, Tailwind, and code Playground

by cmatskas

HTML

<input type="button" id="btnStartTimer" name="StartTimer" value="Start" />
<input type="hidden" id="hdnInterval" name="Interval" value="50" />
<p>
    <label>Show Timer:</label>
    <label id="lblOutput"></label>
</p>

JavaScript

$(document).ready(function () {
    $('#btnStartTimer').on("click", function (e) {
        e.preventDefault();
        var interval = $('#hdnInterval').val();
        var timer = new myTimer(0, interfal, "lblOutput", null);
        timer.go();
    });
});

function myTimer(startVal, interval, outputId, dataField) {
    this.value = startVal;
    this.OutputCntrl = document.getElementById(outputId);
    this.currentTimeOut = null;
    this.interval = interval;
    this.stopped = false;
    this.data = null;
    var formEls = document.documentElement;
    if (dataField) {
        for (var i = 0; i < formEls.length - 1; i++) {
            if (formEls[i].name == dataField) {
                this.data = formEls[i];
                i = formEls.length + 1;
            }
        }
    }

    myTimer.prototype.go = function () {
        if (this.value > 0 && this.stopped === false) {
            this.value = (this.value - this.interval);
            if (this.data) {
                this.data.value = this.value;
            }
            var current = this.value;
            this.OutputCntrl.innerHTML = this.Hours(current) + ':' + this.Minutes(current) + ':' + this.Seconds(current);
            this.currentTimeOut = setTimeout("Timer.go()", this.interval);
        } else {
            alert('Time Out!');
            //window.location('Index.aspx');
        }
    };
    myTimer.prototype.stop = function () {
        this.stopped = true;
        if (this.currentTimeOut !== null) {
            clearTimeout(this.currentTimeout);
        }
    };
    myTimer.prototype.Hours = function (value) {
        return Math.floor(value / 3600000);
    };
    myTimer.prototype.Minutes = function (value) {
        return Math.floor((value - (this.Hours(value) * 3600000)) / 60000);
    };
    myTimer.prototype.Seconds = function (value) {
        var hoursMillSecs = (this.Hours(value) * 3600000);
        var minutesMillSecs = (this.Minutes(value) * 60000);
        var total = (hoursMillSecs...