clearTimeout when click anywhere in document

Question

I am using impress.js to make a presentation I have added autoplay successfully but now what i want is whenever someone click's anywhere on the document it should stop

<script>
            ready(function() {
            if (document.getElementById('launched-placeholder'))
            loadPresentation();
            if (!window.presStarted) {
            startPres(document, window);
                var api = impress();
                api.init();
                $(document).on('impress:stepenter', function(e) {
        var currentSlide = $(e.target).attr('id');

        if (currentSlide === 'step-1') {
        setTimeout(api.next, 3000);
        } else if (currentSlide === 'step-2') {
        setTimeout(api.next, 50);
        } else if (currentSlide === 'step-3') {
        setTimeout(api.next, 50);
        } 
</script>

i have tried many things but couldnt get it to work. please help

Answer 1

You should save the reference of setTimeout to be able to clear it:

var myTim1= setTimeout(api.next, 3000);

and not

 setTimeout(api.next, 3000);

then

clearTimeout(myTim1);

On Doc Click Event:

document.onclick=function(){
  clearTimeout(myTim1);

};

Or using jQuery:

 $(document).click(function(){
      clearTimeout(myTim1);

    });