JSFiddle - React, Tailwind, and code Playground

by fresheyeball

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.js"></script>
<button id="stop">Toggle</button>
<div id="out"></div>

CoffeeScript

class Foo 
    constructor : ->
        @output = document.getElementById 'out'
        @toggle = document.getElementById 'stop'
        @timer  = null
        @start()
        @toggle.addEventListener 'click', =>
            if @timer then @stop() else @start()

    debounced : _.debounce ->
        @output.innerHTML += "DEBOUNCED <br/>"
    , 300, leading : true, trailing : false
    
    start : ->
        @debounced()
        @timer = setInterval =>    
            @output.innerHTML += "called <br/>"
            @debounced()
        , 200
        
    stop : ->
        clearInterval @timer
        @timer = null

foo = new Foo()