1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
var AmpersandView = require('ampersand-view'),
SidebarView = require('./sidebar'),
ChartView = require('./chart'),
$ = require('jquery'),
debug = require('debug')('view:app');
var AppView = module.exports = AmpersandView.extend({
template: require('./templates/app.jade'),
props: {
chartView: 'object',
menuOpen: {
type: 'boolean',
default: false
}
},
events: {
'click .navbar-right label': 'navButtonClicked',
'click [data-hook=menu-toggle]': 'menuToggled'
},
bindings: {
'model.chart.subSampled': {
type: 'toggle',
hook: 'sample-warning'
},
'menuOpen': {
type: 'booleanClass',
selector: '#wrapper',
name: 'active'
}
},
subviews: {
sidebar: {
hook: 'sidebar',
waitFor: 'model.sidebar',
prepareView: function (el) {
return new SidebarView({
el: el,
model: this.model.sidebar
})
}
},
chart: {
hook: 'chart',
waitFor: 'model.chart',
prepareView: function (el) {
this.chartView = new ChartView({
el: el,
model: this.model.chart
});
return this.chartView;
}
}
},
statChanged: function (stat, options) {
this.model.chart.recalcXDomain = true;
this.chartView.render();
},
render: function () {
this.renderWithTemplate(this.model);
},
navButtonClicked: function (event) {
var $input = $(event.target).find('input');
var name = $input.attr('name');
var value = $input.val();
this.model.chart[name] = value;
this.model.chart.recalcXDomain = (name === 'xSetting');
this.chartView.render();
},
menuToggled: function (event) {
this.toggle('menuOpen');
}
});
|
