Skip to content

Commit

Permalink
Fix map page popstate / mobile nav menu bug
Browse files Browse the repository at this point in the history
Previously, pressing the mobile menu icon would change the location
hash, which fired a history popstate event with an empty state object,
causing trouble for our map page JavaScript.

Now, pressing the mobile menu icon triggers a pushState, instead of
changing the location hash. This means our map page popstate logic is
unaffected, but mobile users can still use their browser's Back button
to escape out of the mobile menu.
  • Loading branch information
zarino authored and dracos committed Jul 11, 2016
1 parent 898a645 commit f0af106
Showing 1 changed file with 15 additions and 1 deletion.
16 changes: 15 additions & 1 deletion web/cobrands/fixmystreet/fixmystreet.js
Expand Up @@ -313,7 +313,18 @@ $.extend(fixmystreet.set_up, {
e.preventDefault();
var offset = $('#main-nav').offset().top;
$('html, body').animate({scrollTop:offset}, 1000);
window.location.hash = 'main-nav';

// Registering a pushState here means that mobile users can
// press their browser's Back button to return out of the
// mobile menu (easier than scrolling all the way back up
// the page). However, to show the map page popstate listener
// that this was a special state, we set hashchange to true in
// the event state, so we can detect it, and ignore it, later.
if ('pushState' in history) {
history.pushState({
hashchange: true
}, null);
}
});
},

Expand Down Expand Up @@ -513,6 +524,9 @@ $.extend(fixmystreet.set_up, {
fixmystreet.display.report(e.state.reportPageUrl, e.state.reportId);
} else if ('newReportAtLonlat' in e.state) {
fixmystreet.display.begin_report(e.state.newReportAtLonlat, false);
} else if ('hashchange' in e.state) {
// This popstate was just here because the hash changed.
// (eg: mobile nav click.) We want to ignore it.
}
});
}
Expand Down

0 comments on commit f0af106

Please sign in to comment.