How does Discourse's login modal work?

When I view “Ember.JS” in browser address, it will auto goto “http://discuss.emberjs.com/” and open the login modal.

This is my template, and router.

<ul class="nav-list">
  <li class="nav-item">{{#link-to 'index' class="pure-button"}}{{t blog.home}}{{/link-to}}</li>
  <li class="nav-item">{{#link-to 'posts' class="pure-button"}}{{t blog.posts}}{{/link-to}}</li>
  <li class="nav-item"><a class="pure-button" {{action login}}>{{t button.login}}</a></li>
<ul>
<div>{{outlet}}</div>

FB.Router.map(function() {
  this.resource('posts', { path: '/posts' })
});

When I click “posts” button, “outlet” will render by postsView; When I click “login” button, “outlet” will render by loginView, but I want do this like Discourse.

How do I write the Handlebars template or How to define the router?

I had found a guide an “http://emberjs.com/guides/cookbook/user_interface_and_interaction/using_modal_dialogs/