Question

I have a call back, that I call back multiple times ( recursively via setTimeOut )…there is only one condition in which I want to capture a return value, that is when the callback is done calling itself back.

However on this condition, when I return something, I don’t get it where I expect to, plus I don’t know where it goes at all. There are two console.log statements marking these points…in the snippet below. One where I send it…and one where I expect it.

        if( MC.C.movePane( pane_element, 0, 0, 0, 'begin' ) ) {
            cover_element.style.display = 'none';
            console.log('I never got it');
        }
        return o_p;
    },
    movePane: function( pane_element, start, end, index, state ) {
        if( ( state === 'begin' ) ) { // init the function
            start = parseInt( window.getComputedStyle( pane_element, null ).getPropertyValue("top"), 10 );
            end = start + 40;
            index = start;
            state = 'down';
            MC.C.movePane( pane_element, start, end, index, 'down' );
        }
        if( ( state === 'down' ) && ( index < end ) ) { // move down
            index += 1;
            pane_element.style.top = ( index ) + 'px';
            setTimeout( function( ){ MC.C.movePane( pane_element, start, end, index, state ); }, 1 );
        }
        else if( ( state === 'down' ) && index === end ) { // hold
            state = 'up';
            setTimeout( function( ){ MC.C.movePane( pane_element, start, end, index, state ); }, 2000 );
        }
        else if( ( state === 'up' ) && ( index > start ) ) { // move up
            index -= 1;
            pane_element.style.top = ( index ) + 'px';
            setTimeout( function( ){ MC.C.movePane( pane_element, start, end, index, state ); }, 1 );
        }
        else if( ( state === 'up' ) && ( index === start ) ) { // all done, return
            console.log('I just returned true');
            return true;
            // document.getElementById( 'po_but_cov' ).style.display='none';
        }
    }
};

Answer 1

If you’re asking how to recover the return value of movePane() when it’s called from setTimeout(), you can’t. setTimeout() makes no provisions for capturing and returning a value. But that’s OK, because by the time the callback executes, the code that called setTimeout() is no longer running — yes?

If you want the callback to communicate that it’s done doing something then — hold onto your hat — you’re going to have to give your callback a callback of its very own. When the callback is though doing its time-delayed thing, it can call that callback, which will do whatever the original code would have done if it had gotten the return value.

Sorry if that makes your head hurt, but that’s just how it works.

It might look something like (sorry if the parens and braces don’t quite match up)

    MC.C.movePane( pane_element, 0, 0, 0, 'begin', function() {
        cover_element.style.display = 'none';
    });
    return o_p;

    // ...
    movePane: function( pane_element, start, end, index, state, myCallback ) {
        // ...
        else if( ( state === 'up' ) && ( index === start ) ) { // all done, return
            console.log('I just returned true');
            // return true;
            myCallback();