Cancel route using Sammy.js without affecting history

javascript, sammy.js, single-page-application, toastr, url-routing

Solution

In case someone else hits this, here is where I ended up. I decided to use the `context.setLocation` feature of sammy to handle resetting the route.

sammy.before(/.*/, function () {
    // Can cancel the route if this returns false
    var
        context = this,
        response = routeMediator.canLeave();

    if (!isRedirecting && !response.val) {
        isRedirecting = true;
        toastr.warning(response.message); // toastr displays the message
        // Keep hash url the same in address bar
        context.app.setLocation(currentHash);
    }
    else {
        isRedirecting = false;
        currentHash = context.app.getLocation();
    }
    return response.val;
});

Problem

I want to intercept all route changes with Sammy to first check if there is a pending action. I have done this using the `sammy.before` API and I return false to cancel the route. This keeps the user on the 'page' but it still changes the hash in the browsers address bar and adds the route to the browsers' history. If I cancel the route, I dont want it in the address bar nor history, but instead I expect the address to stay the same. Currently, to get around this I can either call window.history.back (yuk) to go back to the original spot in the history or sammy.redirect. Both of which are less than ideal. Is there a way to make sammy truly cancel the route so it stays on the current route/page, leaves the address bar as is, and does not add to the history? If not, is there another routing library that will do this? ``` sammy.before(/.*/, function () { // Can cancel the route if this returns false var response = routeMediator.canLeave(); if (!isRedirecting && !response.val) { isRedirecting = true; // Keep hash url the same in address bar window.history.back(); //this.redirect('#/SpecificPreviousPage'); } else { isRedirecting = false; } return response.val; }); ```

Original source