Periodically update data state - ember.js

Question

I'm creating a browser game that doesn't connect to a server. It stores all the state in Ember Data using the fixture adapter. One part of the game is a user a can click a button and "go on a mission". The mission has a duration. I would like to update the state of the game when the mission duration has elapsed.
I was going about this by periodically updating the mission controller and checking the time until the mission was over and then updating the state with the results. However I noticed that when I navigated to a different route it would destroy the controller. With the controller destroyed I had nothing to update the mission periodically. So even though the duration elapsed it didn't update the state of the game.
I don't understand why the controller is being destroyed? This may be because the controller is an item-controller? This is my first ember app so I may have set up something incorrectly.
Also if there is a better way to go about this I'd love to hear it.

Answer 1

Yes, itemControllers are destroyed, when the route is left:
App = Ember.Application.create();
App.Router.map(function() {
// put your routes here
this.route('other');
});
App.Router.reopen({
location: 'none'
});
App.IndexRoute = Ember.Route.extend({
model: function() {
return ['red', 'yellow', 'blue'];
}
});
App.IndexController = Ember.ArrayController.extend({
_setup: function () {
alert('_setup IndexController')
}.on('init'),
itemController: 'item'
});
App.OtherController = Ember.Controller.extend({
_setup: function () {
alert('_setup OtherController')
}.on('init')
});
App.ItemController = Ember.ObjectController.extend({
_setup: function () {
alert('_setup ItemController')
}.on('init'),
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v1.3.0.js"></script>
<script src="http://builds.emberjs.com/tags/v1.7.0/ember.js"></script>
<script type="text/x-handlebars">
<h2>Welcome to Ember.js</h2>
{{outlet}}
</script>
<script type="text/x-handlebars" data-template-name="index">
<ul>
{{#each item in model}}
<li>{{item}}</li>
{{/each}}
</ul>
{{#link-to 'other'}}Other{{/link-to}}
</script>
<script type="text/x-handlebars" data-template-name="other">
{{#link-to 'index'}}Back{{/link-to}}
</script>
In this case, I'd say create a service object attached to your application controller, that is scheduling updates with Ember.run.later().
Also, please note that the FixtureAdapter is not able to actually store data.