There isn't any interactivity on the dashboard, so there's not much for the view controller to do. We'll use it to control the live refresh aspect of the charts:

// app/view/dashboard/DashboardController.js
Ext.define('Instrumatics.view.dashboard.DashboardController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.dashboard-dashboard',
    
    init: function() {
        var data = this.getViewModel().getData(),
            me = this;

        setInterval(function() {
            data.webLogs.load({ addRecords: true });
            data.sqlLogs.load({ addRecords: true });
        }, 1000);
    }
});

It's as simple as this; every second, grab the store powering the live chart and call its load method with the addRecords option set to true. This will cause new records to be appended to the store rather than overwriting old records.

While there's not much code here, there are a couple of discussion points. We could have avoided using a view controller at all for the dashboard and baked this refresh behavior directly in the LiveRequestChart class, maybe setting the refresh rate via a configuration option.

By doing it in the controller, we get the chance to centralize the place in which the refresh rate is set. This isn't a massive win though. There's definitely a case to be made for moving this into the UI class. It's another situation where there's no right or wrong way of doing things; multiple options are available and it's better to pick one and move on than be paralyzed with the choices on offer.

We've got the first page of our application, so let's now move on to the subpages, starting with the web logs.