CODEWITHSUNDEEP
javascriptjquery
Mendy Shechter
Mendy Shechter

Reputation: 43

javascript call to function and wait until jquery fadeout will finish than return true

i have this 2 functions, i want to call to Scnd function an wait until he finish the jquery fadeout

async function f() {
    let promise = new Promise((resolve, reject) => {
        let mystart = jewishTable.myLoop('play', time);
        setTimeout(function () {
            if (mystart == true) {
                console.log(mystart);
                resolve("done!")
            }
        }, 500);
    });
    let result = await promise;
    slider.stopPlay("playNext", "jewishinfo");
} f();

2)

jewishTable = {
myLoop: function myLoop (action, time) {
    if(action == 'play'){
        $('#jewisTable').fadeIn();

        setTimeout(function(){
          $('#jewisTable').fadeOut()
        }, time);
        return true      
    }
}

}

i want to return true ONLY after fadeOut is finish than call to another function

Upvotes: 0

Views: 547

Answers (2)

trincot
trincot

Reputation: 350290

You don't need to create a promise with new Promise. jQuery can return the promise for you, and also has a delay method for implementing the delay between the fade-in and fade-out animations:

var time = 1000;
var jewishTable = {
    myLoop: function myLoop (action, time) {
        if(action == 'play'){
            return $('#jewisTable').fadeIn(1000).delay(time).fadeOut(1000).promise();
        }
        return Promise.reject("unsupported action");
    }
}

async function f() {
    await jewishTable.myLoop('play', time);
    console.log("ready for next function...");
    $("#alldone").show();
    //slider.stopPlay("playNext", "jewishinfo");
} f();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="jewisTable" style="display:none">The table fades in and out...</div>
<div id="alldone" style="display:none">All done</div>

Upvotes: 1

Dan Nagle
Dan Nagle

Reputation: 5425

The .fadeOut() method takes two parameters. The first is the duration which defaults to 400ms, the second is an optional callback to call when the animation is complete.

So try:

 $('#jewisTable').fadeOut(400, function() {
   // This is the callback called when `fadeOut()` is complete
 });

Upvotes: 0

Related Questions