How to control the flow in page transition

How to control the flow in page transition

I bind some callbacks to the pagebeforeshow and pageinit events. My pages are accessible directly so I need to do some initialization stuff in the init and also in the beforeshow if a transition back occurs.

We are using a REST backend so we also need to fetch some data within those callbacks.

How can I make sure that the beforeshow event does not trigger after the init is completely done ? 

I would need to do something like this:

$(document).on('pageinit', function (event) {
event.preventDefault()
doSomeAsyncStuff().done(function({
// init page
event.next();
}));
});

$(document).on('pagebeforeshow', function (event) {
event.preventDefault()
doSomeAsyncStuff().done(function({
// prepare page
event.next();
}));
});

How can I achieve this ?