Ember.js Bootstrap 3 Alerts

alert.js

App.AlertController = Ember.Controller.extend({
	alert: false,
	observeAlert: function() {
		if(this.alert != false){
			$('#flash').addClass('alert alert-' + this.alert[0] + ' alert-dismissable');
			$('#flash span').text(this.alert[1]);
			$('#flash').fadeIn();
		} else {
			$('#flash').hide();
		}
	}.observes('alert')
});

application.hbs

<div id="flash">
  <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
  <strong>Warning!</strong>
  <span></span>
</div>

router.js

App.ApplicationRoute = Ember.Route.extend({
	beforeModel: function() {
		return this.checkLogin = this.checkLogin || this.controllerFor('auth').checkLogin();
	},
	events: {
		willTransition: function() {
			var alertController = this.controllerFor('alert');
			alertController.set('alert', false);
		}
	}
});

App.AuthFilter = Ember.Route.extend({
	beforeModel: function(transition) {
		if(this.controllerFor('auth').get('isGuest')){
			var alertController = this.controllerFor('alert');
			alertController.set('alert', ['warning', 'You must be logged to view this page.']);
			this.transitionTo('login');
		}
	}
});

App.ArticlesIndexRoute = App.AuthFilter.extend({
	// ...
});