100 lines
2.0 KiB
JavaScript
100 lines
2.0 KiB
JavaScript
|
var CoreView = require('backbone/core-view');
|
||
|
|
var $ = require('jquery');
|
||
|
|
var _ = require('underscore');
|
||
|
|
var renderLoading = require('builder/components/loading/render-loading');
|
||
|
|
var ENTER_KEY_CODE = 13;
|
||
|
|
var REQUIRED_OPTS = [
|
||
|
|
'template',
|
||
|
|
'runAction',
|
||
|
|
'modalModel'
|
||
|
|
];
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Confirmation modal dialog
|
||
|
|
*/
|
||
|
|
|
||
|
|
module.exports = CoreView.extend({
|
||
|
|
className: 'Dialog-content',
|
||
|
|
|
||
|
|
events: {
|
||
|
|
'click .js-confirm': '_onConfirm',
|
||
|
|
'click .js-cancel': '_onCancel'
|
||
|
|
},
|
||
|
|
|
||
|
|
initialize: function (opts) {
|
||
|
|
_.each(REQUIRED_OPTS, function (item) {
|
||
|
|
if (!opts[item]) throw new Error(item + ' is required');
|
||
|
|
this['_' + item] = opts[item];
|
||
|
|
}, this);
|
||
|
|
|
||
|
|
if (opts.loadingTitle) {
|
||
|
|
this._hasLoading = true;
|
||
|
|
this._loadingTitle = opts.loadingTitle;
|
||
|
|
}
|
||
|
|
|
||
|
|
if (opts.renderOpts) {
|
||
|
|
this._hasRenderOpts = true;
|
||
|
|
this._renderOpts = opts.renderOpts;
|
||
|
|
}
|
||
|
|
|
||
|
|
this._onKeyDown = this._onKeyDown.bind(this);
|
||
|
|
this._initBinds();
|
||
|
|
},
|
||
|
|
|
||
|
|
render: function () {
|
||
|
|
this.clearSubViews();
|
||
|
|
|
||
|
|
var html = this._hasRenderOpts ? this._template(this._renderOpts) : this._template();
|
||
|
|
this.$el.html(html);
|
||
|
|
|
||
|
|
return this;
|
||
|
|
},
|
||
|
|
|
||
|
|
_initBinds: function () {
|
||
|
|
$(document).bind('keydown', this._onKeyDown);
|
||
|
|
},
|
||
|
|
|
||
|
|
_disableBinds: function () {
|
||
|
|
$(document).unbind('keydown', this._onKeyDown);
|
||
|
|
},
|
||
|
|
|
||
|
|
_onKeyDown: function (ev) {
|
||
|
|
var keyCode = ev.which;
|
||
|
|
if (keyCode === ENTER_KEY_CODE) {
|
||
|
|
this._onConfirm();
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
_renderLoadingView: function () {
|
||
|
|
this.$el.html(
|
||
|
|
renderLoading({
|
||
|
|
title: this._loadingTitle
|
||
|
|
})
|
||
|
|
);
|
||
|
|
},
|
||
|
|
|
||
|
|
_$content: function () {
|
||
|
|
return this.$('.js-content');
|
||
|
|
},
|
||
|
|
|
||
|
|
_onConfirm: function () {
|
||
|
|
if (this._hasLoading) {
|
||
|
|
this._renderLoadingView();
|
||
|
|
} else {
|
||
|
|
this._modalModel.destroy();
|
||
|
|
}
|
||
|
|
|
||
|
|
this._runAction();
|
||
|
|
},
|
||
|
|
|
||
|
|
_onCancel: function () {
|
||
|
|
this._modalModel.destroy();
|
||
|
|
},
|
||
|
|
|
||
|
|
clean: function () {
|
||
|
|
this._disableBinds();
|
||
|
|
CoreView.prototype.clean.apply(this);
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|