New Twiddle

application.controller.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName:'Ember Twiddle'
});

application.route.js

import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    loading(transition, route) {
      console.log('Route loading');
      $('body').css({ cursor : 'wait'});

      this.router.one('didTransition', function()       {
        console.log('DidTransition.');
        $('body').css({ cursor: 'default' });
      });

      return true; // Bubble the loading event
    }
  }
});

application.template.hbs

<h1>Welcome to {{appName}}</h1>
<br>
<br>
{{outlet}}
{{link-to 'Go to heavy route' 'heavy'}}
<br>
<br>

heavy.route.js

import Ember from 'ember';

export default Ember.Route.extend({
  model() {
  	return new Promise((resolve) => {
    	Ember.run.later(this, () => {
      	resolve();
      }, 1500);
    });
  }
});

heavy.template.hbs

This is heavy route.

router.js

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
  this.route('heavy');
});

export default Router;

twiddle.json

{
  "version": "0.4.10",
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.js",
    "ember": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.9/ember.debug.js",
    "ember-data": "https://cdnjs.cloudflare.com/ajax/libs/ember-data.js/1.13.11/ember-data.js",
    "ember-template-compiler": "https://cdnjs.cloudflare.com/ajax/libs/ember.js/1.13.9/ember-template-compiler.js"
  }
}