hedera-web/js/htk/dialog/index.js

162 lines
2.7 KiB
JavaScript

require('./style.scss');
var Popup = require('../popup');
/**
* Class to show message dialogs with buttons.
*/
var Dialog = new Class();
module.exports = Dialog;
var Button =
{
OK : 1 << 1
,ACCEPT : 1 << 2
,CANCEL : 1 << 3
,RETRY : 1 << 4
,YES : 1 << 5
,NO : 1 << 6
};
var labels =
[{
response: Button.NO
,label: 'No'
},{
response: Button.CANCEL
,label: 'Cancel'
},{
response: Button.RETRY
,label: 'Retry'
},{
response: Button.ACCEPT
,label: 'Accept'
},{
response: Button.OK
,label: 'Ok'
},{
response: Button.YES
,label: 'Yes'
}];
Button.CANCEL_ACCEPT = Button.CANCEL | Button.ACCEPT;
Button.RETRY_CANCEL = Button.RETRY | Button.CANCEL;
Button.YES_NO = Button.YES | Button.NO;
Dialog.extend({
Button: Button
});
Dialog.implement({
Extends: Popup
,Tag: 'htk-dialog'
,Properties:
{
/**
* The message displayed to the user.
*/
message:
{
type: String
,set(x) {
this._message = x;
}
,get() {
return this._message;
}
}
/**
* The dialog icon.
*/
,icon:
{
type: String
,set(x) {
this._icon = x;
}
,get() {
return this._icon;
}
}
/**
* The dialog buttons.
*/
,buttons:
{
enumType: Button
,set(x) {
this._buttons = x;
}
,get() {
return this._buttons;
}
}
}
,_modal: true
,_icon: 'info'
,_buttons: Button.ACCEPT
,open() {
Popup.prototype.open.call(this);
// Dialog body
var root = this.createElement('div');
root.className = 'htk-dialog';
var body = this.createElement('div');
root.appendChild(body);
if (this._icon) {
var icon = new Htk.Icon({
doc: this.doc,
icon: this._icon
});
body.appendChild(icon.node);
}
var p = this.createElement('p');
body.appendChild(p);
if (this._message)
p.appendChild(this.createTextNode(this._message));
var clear = this.createElement('div');
clear.style.clear = 'both';
body.appendChild(clear);
// Button bar
var buttonBar = this._buttonBar = this.createElement('div');
buttonBar.className = 'button-bar';
root.appendChild(buttonBar);
var i = labels.length;
while (i--)
if (this._buttons & labels[i].response)
this.createButton(_(labels[i].label), labels[i].response);
var clear = this.createElement('div');
clear.style.clear = 'both';
root.appendChild(clear);
this.childNode = root;
}
,hide(response) {
if (!this._isOpen) return;
Popup.prototype.hide.call(this);
this.emit('response', response);
}
,createButton(label, response) {
var button = this.createElement('button');
button.className = 'thin';
button.appendChild(this.createTextNode(label));
button.addEventListener('click',
this.hide.bind(this, response));
this._buttonBar.appendChild(button);
}
});