JSFiddle - React, Tailwind, and code Playground

by WilsonPage

HTML

<button>Click me every 3 seconds or else!</button>

CSS

html{
 text-align:center;   
}


button{
    margin-top:200px;
    padding:20px;
}

JavaScript

var watchdog = function(pingMethod, interval, onTimeout){
    var countdown = setTimeout(onTimeout, interval);
    
    return function(){
        
        // clear countdown
        clearTimeout(countdown);
        
        // reset the countdown timer
        countdown = setTimeout(onTimeout, interval);
    
        // call the pingMethod with the arguments
        // passed into this function. 
        return pingMethod.apply(this, arguments);    
    }
};



var button = $('button');


function add(a, b) {
    return (a + b);
}


// create a watched version of add()
var addWatched = watchdog(add, 3000, function(){
   
    // disable the button
    button
    .attr('disabled', true)
    .text('You lost the fun game :(');
});


// bind a click even to reset the countdown
button.on('click', function(){
    
    // run the function and log the result
    console.log(addWatched(1, 2));  
    
});