Polymer 1.0 - How to use 'page' to route app and change URL

Question

Working from the Polymer 1.0 Starter Kit, I'd like to set up a new route, but I need to fire it from a function in my app.js file rather than through routing.html

app._loadProject = function(e) {
  // do stuff here
  // after finished, route to our 'project' section in the app
  app.route = 'project';
};

This works for the most part. The application is routed to the 'project' <section>. However, the URL does not update to reflect this, so in cases where the user reloads the page, they find themselves on a different 'section' than the one they were just on - not the friendliest scenario.

Is there a more proper way to route with 'page' that doesn't break browser navigation?

Answer 1

Do your thing in app.js:

app._loadProject = function(e) {
  // do stuff here
  // after finished, route to our 'project' section in the app
  page.show('/project'); // same as page('/project')
};

Add a rule in routing.html:

page('/project', project);
...
function project() {
  app.route = 'project';
}