2022-06-06 16:02:17 +00:00
|
|
|
require('./style.scss');
|
2016-09-26 09:28:47 +00:00
|
|
|
|
2022-06-06 08:53:59 +00:00
|
|
|
module.exports = new Class({
|
2015-01-23 13:09:30 +00:00
|
|
|
Extends: Htk.Column
|
|
|
|
,Tag: 'htk-column-spin'
|
2022-06-06 08:53:59 +00:00
|
|
|
,Properties: {
|
2015-01-23 13:09:30 +00:00
|
|
|
/**
|
|
|
|
* The text to append to the number.
|
2022-05-26 06:08:31 +00:00
|
|
|
*/
|
2022-06-06 08:53:59 +00:00
|
|
|
unit:{
|
2015-01-23 13:09:30 +00:00
|
|
|
type: String
|
|
|
|
,value: null
|
|
|
|
},
|
|
|
|
/**
|
|
|
|
* The number of decimal places to display.
|
2022-05-26 06:08:31 +00:00
|
|
|
*/
|
2015-01-23 13:09:30 +00:00
|
|
|
digits: {
|
|
|
|
type: Number
|
|
|
|
,value: 0
|
|
|
|
}
|
|
|
|
}
|
2015-11-26 12:30:04 +00:00
|
|
|
|
2022-11-16 01:46:44 +00:00
|
|
|
,initialize(props) {
|
2015-11-26 12:30:04 +00:00
|
|
|
this._cssClass = 'cell-spin';
|
2022-06-06 16:02:17 +00:00
|
|
|
Htk.Column.prototype.initialize.call(this, props);
|
2015-11-26 12:30:04 +00:00
|
|
|
}
|
|
|
|
|
2022-11-16 01:46:44 +00:00
|
|
|
,renderHeader() {
|
2022-06-06 16:02:17 +00:00
|
|
|
var th = Htk.Column.prototype.renderHeader.call(this, );
|
2015-11-26 12:30:04 +00:00
|
|
|
th.className = 'cell-spin';
|
|
|
|
return th;
|
|
|
|
}
|
2015-01-23 13:09:30 +00:00
|
|
|
|
2022-11-16 01:46:44 +00:00
|
|
|
,render(tr) {
|
2022-06-06 16:02:17 +00:00
|
|
|
var td = Htk.Column.prototype.render.call(this, tr);
|
2015-01-23 13:09:30 +00:00
|
|
|
|
|
|
|
var valueString = null;
|
|
|
|
|
|
|
|
if (this.value !== null && this.value !== undefined)
|
2022-05-26 06:08:31 +00:00
|
|
|
valueString = new Number(this.value).toFixed(this.digits);
|
2015-01-23 13:09:30 +00:00
|
|
|
|
2022-05-26 06:08:31 +00:00
|
|
|
if (this.editable) {
|
|
|
|
var entry = this.createElement('input');
|
2015-01-23 13:09:30 +00:00
|
|
|
entry.type = 'text';
|
2022-05-26 06:08:31 +00:00
|
|
|
entry.addEventListener('change', this.inputChanged.bind(this, tr, entry));
|
|
|
|
td.appendChild(entry);
|
2015-01-23 13:09:30 +00:00
|
|
|
|
|
|
|
if (valueString)
|
|
|
|
entry.value = valueString;
|
2022-05-26 06:08:31 +00:00
|
|
|
} else if (valueString) {
|
2015-01-23 13:09:30 +00:00
|
|
|
if (this.unit)
|
2015-02-01 03:21:54 +00:00
|
|
|
valueString = valueString + this.unit;
|
2015-01-23 13:09:30 +00:00
|
|
|
|
2022-05-26 06:08:31 +00:00
|
|
|
var text = this.createTextNode(valueString);
|
|
|
|
td.appendChild(text);
|
2015-01-23 13:09:30 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
return td;
|
|
|
|
}
|
|
|
|
|
2022-11-16 01:46:44 +00:00
|
|
|
,inputChanged(tr, entry) {
|
2022-05-26 06:08:31 +00:00
|
|
|
this.changed(tr, parseInt(entry.value));
|
2015-01-23 13:09:30 +00:00
|
|
|
}
|
|
|
|
});
|