61 lines
1.7 KiB
JavaScript
61 lines
1.7 KiB
JavaScript
var AmpersandView = require('ampersand-view'),
|
|
PanelView = require('./panel'),
|
|
_ = require('lodash'),
|
|
debug = require('debug')('view:sidebar');
|
|
|
|
var SidebarView = module.exports = AmpersandView.extend({
|
|
props: {
|
|
panelViews: 'object'
|
|
},
|
|
template: require('./templates/sidebar.jade'),
|
|
events: {
|
|
'click [data-hook=button]': 'clearClicked',
|
|
'input [data-hook=input]': 'inputChanged'
|
|
},
|
|
bindings: {
|
|
'model.search.content': {
|
|
type: 'value',
|
|
hook: 'input'
|
|
}
|
|
},
|
|
render: function () {
|
|
this.renderWithTemplate(this.model);
|
|
this.panelViews = this.renderCollection(this.model.panels, PanelView, this.queryByHook('panels'));
|
|
},
|
|
closeAndReset: function () {
|
|
_.each(this.panelViews.views, function (view) {
|
|
view.collapsibleClose();
|
|
view.resetStats();
|
|
});
|
|
},
|
|
clearClicked: function () {
|
|
this.model.search.content = '';
|
|
this.closeAndReset();
|
|
this.queryByHook('button').blur();
|
|
},
|
|
filterPanels: function (search) {
|
|
_.each(this.panelViews.views, function (view) {
|
|
view.filterStats(search);
|
|
});
|
|
},
|
|
statChanged: function(stat, options) {
|
|
this.parent.statChanged(stat, options);
|
|
if (options.all) {
|
|
// inform all other panels that they need to update their indicators
|
|
_.each(this.panelViews.views, function (pv) {
|
|
pv.statChanged(stat, {all: false, propagate: false});
|
|
});
|
|
}
|
|
},
|
|
inputChanged: _.debounce(function () {
|
|
var content = this.queryByHook('input').value;
|
|
this.model.search.content = content;
|
|
|
|
if (content.trim() === '') {
|
|
this.closeAndReset();
|
|
} else {
|
|
this.filterPanels(content);
|
|
}
|
|
}, 200, {leading: false, trailing: true})
|
|
});
|