101 lines
2.5 KiB
JavaScript
101 lines
2.5 KiB
JavaScript
|
var Backbone = require('backbone');
|
||
|
var CoreView = require('backbone/core-view');
|
||
|
var template = require('./dataset-actions.tpl');
|
||
|
var UndoButtons = require('builder/components/undo-redo/undo-redo-view');
|
||
|
var checkAndBuildOpts = require('builder/helpers/required-opts');
|
||
|
|
||
|
var REQUIRED_OPTS = [
|
||
|
'mapAction',
|
||
|
'previewAction',
|
||
|
'trackModel',
|
||
|
'editorModel',
|
||
|
'queryGeometryModel',
|
||
|
'querySchemaModel',
|
||
|
'onApply',
|
||
|
'onClear',
|
||
|
'clearSQLModel',
|
||
|
'applyButtonStatusModel'
|
||
|
];
|
||
|
|
||
|
module.exports = CoreView.extend({
|
||
|
className: 'Dataset-options-actions',
|
||
|
|
||
|
events: {
|
||
|
'click .js-createMap': '_onCreateMap',
|
||
|
'click .js-previewMap': '_onPreviewMap'
|
||
|
},
|
||
|
|
||
|
initialize: function (opts) {
|
||
|
checkAndBuildOpts(opts, REQUIRED_OPTS, this);
|
||
|
|
||
|
this._initViewState();
|
||
|
this.listenTo(this._queryGeometryModel, 'change:status', this._setViewState);
|
||
|
this.listenTo(this._querySchemaModel, 'change:status', this._updateApplyLoadingButtonLoading);
|
||
|
this.listenTo(this._viewState, 'change', this.render);
|
||
|
},
|
||
|
|
||
|
render: function () {
|
||
|
this.clearSubViews();
|
||
|
this.$el.html(
|
||
|
template({
|
||
|
hasGeometry: this._viewState.get('hasGeom'),
|
||
|
canCreateMap: true
|
||
|
})
|
||
|
);
|
||
|
this._initViews();
|
||
|
return this;
|
||
|
},
|
||
|
|
||
|
_initViewState: function () {
|
||
|
this._viewState = new Backbone.Model({
|
||
|
hasGeom: true
|
||
|
});
|
||
|
this._setViewState();
|
||
|
},
|
||
|
|
||
|
_initViews: function () {
|
||
|
var view = new UndoButtons({
|
||
|
className: 'u-rSpace--xl',
|
||
|
trackModel: this._trackModel,
|
||
|
editorModel: this._editorModel,
|
||
|
clearModel: this._clearSQLModel,
|
||
|
applyStatusModel: this._applyButtonStatusModel,
|
||
|
applyButton: true,
|
||
|
clearButton: true,
|
||
|
onApplyClick: this._handleApply.bind(this),
|
||
|
onClearClick: this._handleClear.bind(this)
|
||
|
});
|
||
|
|
||
|
this.$('.js-createMap').before(view.render().el);
|
||
|
this.addView(view);
|
||
|
},
|
||
|
|
||
|
_handleApply: function () {
|
||
|
if (this._onApply) { this._onApply(); }
|
||
|
},
|
||
|
|
||
|
_handleClear: function () {
|
||
|
if (this._onClear) { this._onClear(); }
|
||
|
},
|
||
|
|
||
|
_onCreateMap: function () {
|
||
|
if (this._mapAction) { this._mapAction(); }
|
||
|
},
|
||
|
|
||
|
_onPreviewMap: function () {
|
||
|
if (this._previewAction) { this._previewAction(); }
|
||
|
},
|
||
|
|
||
|
_updateApplyLoadingButtonLoading: function () {
|
||
|
this._applyButtonStatusModel.set('loading', this._querySchemaModel.isFetching());
|
||
|
},
|
||
|
|
||
|
_setViewState: function () {
|
||
|
var self = this;
|
||
|
this._queryGeometryModel.hasValueAsync()
|
||
|
.then(function (hasGeom) {
|
||
|
self._viewState.set('hasGeom', hasGeom);
|
||
|
});
|
||
|
}
|
||
|
});
|