How to cancel a function which was called by another function

Question

I call a function:

$(document).on('click', '#home', function() {
    runfunction2('', ''); // for stopping speech
    runfunction( 956, 0 );
})

from this function I call another function with speech. (https://github.com/vilic/cordova-plugin-tts)

function runfunction( post_id, step ){
    runfunction2('example text', 'starttimer', post_id, step );
}

function runfunction3( text, end, post_id, step ){
 TTS.speak({
    text: text,
    locale: 'de-DE',
    rate: 1.5
}, function () {

    if ( end == "startrec" ) {
        console.log("startrec gestartet");              

        mediaPlay3.play();

        setTimeout(function() {
            mediaPlay3.stop();      
            startRecognition( post_id, step );          
        }, 1000); 

        setTimeout( function(){ 
            // Do something after 3 second 
            stopRecognition();  
        }  , 4000 );    
    } else if ( end == "newtry" ){
        console.log("newtry gestartet");

        mediaPlay3.play();

        setTimeout(function() {
            mediaPlay3.stop();          
            startRecognition( post_id, step );          
        }, 1000); 

        setTimeout( function(){ 
            // Do something after 3 second
            stopRecognition();
        }  , 4000);                 
    } else if ( end == "starttimer" ){
            timer(post_id, step );
    } else {
        //
    }
}

If I click during the process the home-button again I want to start it from the beginning. The problem is that the first function is not yet finished and is running in the background (still calling the second function). But I want to cancel it all and let everything run from the beginning. How is that possible?

It's certainly possible, but you will have to create the cancellation logic yourself, it's not a 'built in' action of a JS function. Exactly how you do that will depend on what logic is being executed, and you've not shown that, so no one can really give you a definitive answer. — Rory McCrossan, Oct 04 '17 at 11:03

score 1 · Accepted Answer · answered Oct 04 '17 at 11:41

below codes is simulate thread and you can use this code for this. HTML:

<button type="button" class="btn btn-primary" id="btnStart">Start</button>
<button type="button" class="btn btn-default" id="btnCancel">Cancel</button>

JS:

$(document).ready(function () {
    $('#btnStart').on('click', infinityFunction);
    $('#btnCancel').on('click', cancelProcess);

});
var busy = false;
var cancelled = false;

var processor = [];
var countN = 0;
function infinityFunction() {
    if(cancelled){

        if(processor.length > 0){
            clearTimeout(processor[0]);
            processor.splice(0,1);
        }
        busy = false;
        cancelled = false;
        countN = 0;
        return;
    }
    if(!busy) {
        busy = true;
        console.log('Processing some code :'+countN);
        countN++;
        if(processor.length > 0){
            clearTimeout(processor[0]);
            processor.splice(0,1);
        }
        var myProcessor = setInterval(infinityFunction, 1000);
        busy = false;
        processor.push(myProcessor);
        console.log(processor);

    }else{
        console.log('I am busy now');

    }

}

function cancelProcess() {
    cancelled = true;
}

How to cancel a function which was called by another function

1 Answers1