0
1
Fork 0
hedera-web-mindshore/js/htk/select/index.js

260 lines
4.9 KiB
JavaScript
Raw Normal View History

2022-06-06 08:53:59 +00:00
require('./style.scss');
2022-06-06 12:49:18 +00:00
var ColumnText = require('../columns/text');
2016-09-26 09:28:47 +00:00
2022-05-25 18:04:16 +00:00
module.exports = new Class({
Extends: Htk.Field
2015-07-03 05:49:45 +00:00
,Implements: Db.Iterator
,Tag: 'htk-combo'
2022-05-28 15:49:46 +00:00
,Properties: {
/**
* The model associated to this form.
2022-05-25 18:04:16 +00:00
*/
2022-05-28 15:49:46 +00:00
model: {
type: Db.Model
2022-05-25 18:04:16 +00:00
,set: function(x) {
this.link({_model: x}, {'status-changed-after': this._onModelChange});
this._onModelChange();
}
2022-05-25 18:04:16 +00:00
,get: function() {
return this._model;
}
2015-07-03 05:49:45 +00:00
},
/**
* The row where the form positioned, has -1 if the row is unselected.
2022-05-25 18:04:16 +00:00
*/
2022-05-28 15:49:46 +00:00
row: {
2015-07-03 05:49:45 +00:00
type: Number
2022-05-25 18:04:16 +00:00
,set: function(x) {
2015-07-03 05:49:45 +00:00
if (!this._model || this._model.numRows <= x || x < -1)
x = -1;
if (x == this._row)
return;
this._row = x;
2022-05-25 18:04:16 +00:00
this.iterChanged();
2015-07-03 05:49:45 +00:00
}
2022-05-25 18:04:16 +00:00
,get: function() {
2015-07-03 05:49:45 +00:00
return this._row;
}
},
/**
* The number of rows in the form.
2022-05-25 18:04:16 +00:00
*/
2022-06-06 12:49:18 +00:00
numRows:{
2015-07-03 05:49:45 +00:00
type: Number
2022-05-25 18:04:16 +00:00
,get: function() {
2015-07-03 05:49:45 +00:00
if (this._model)
return this._model.numRows;
return 0;
}
},
/**
* Checks if the form data is ready.
2022-05-25 18:04:16 +00:00
*/
2022-06-06 12:49:18 +00:00
ready:{
2015-07-03 05:49:45 +00:00
type: Boolean
2022-05-25 18:04:16 +00:00
,get: function() {
2015-11-19 13:57:23 +00:00
return this._model && this._model.ready;
2015-07-03 05:49:45 +00:00
}
2015-09-28 11:37:31 +00:00
},
/**
* Checks if the form data is ready.
2022-05-25 18:04:16 +00:00
*/
2022-06-06 12:49:18 +00:00
placeholder:{
2015-09-28 11:37:31 +00:00
type: String
2022-05-25 18:04:16 +00:00
,set: function(x) {
2015-09-28 11:37:31 +00:00
this._placeholder = x;
2022-05-25 18:04:16 +00:00
this._refreshShowText(x);
2015-09-28 11:37:31 +00:00
}
2022-05-25 18:04:16 +00:00
,get: function() {
2015-09-28 11:37:31 +00:00
return this._placeholder;
}
},
/**
* Wether to allow null values.
2022-05-25 18:04:16 +00:00
*/
2022-06-06 12:49:18 +00:00
notNull:{
type: Boolean
2022-05-25 18:04:16 +00:00
,set: function(x) {
this._notNull = x;
}
2022-05-25 18:04:16 +00:00
,get: function() {
return this._notNull;
2015-07-03 05:49:45 +00:00
}
2022-05-28 15:49:46 +00:00
},
/**
* The row object.
*/
$: {
type: Object
,get: function() {
2022-06-06 12:49:18 +00:00
return this._model.getObject(this._row) || {};
}
},
params: {
type: Object
,get: function() {
return this.$;
2022-05-28 15:49:46 +00:00
}
}
}
2015-07-03 05:49:45 +00:00
,_row: -1
,_model: null
,valueColumnIndex: 0
,valueColumnName: null
,showColumnIndex: 1
,showColumnName: null
,_notNull: true
2015-12-10 13:48:43 +00:00
,_webkitRefresh: false
2022-05-25 18:04:16 +00:00
,render: function() {
const button = this.createRoot('button');
2016-08-30 07:43:47 +00:00
button.type = 'button';
2022-06-06 17:13:57 +00:00
button.classList.add('input');
2022-06-06 08:53:59 +00:00
button.addEventListener('mousedown',
e => this._onButtonMouseDown(e));
2022-05-25 18:04:16 +00:00
this.label = this.createElement('span');
button.appendChild(this.label);
2022-06-06 08:53:59 +00:00
const erase = new Htk.Icon({
name: 'close',
title: _('Erase')
});
erase.classList.add('erase');
erase.addEventListener('mousedown',
e => this._onEraseMouseDown(e));
button.appendChild(erase.node);
2022-05-25 18:04:16 +00:00
const dropDown = new Htk.Icon({
name: 'expand_more'
});
button.appendChild(dropDown.node);
}
2022-05-25 18:04:16 +00:00
,_setRow: function(row) {
2015-07-03 05:49:45 +00:00
this._row = row;
2022-05-25 18:04:16 +00:00
this._refreshShowText();
this.iterChanged();
2015-07-03 05:49:45 +00:00
}
2022-06-06 08:53:59 +00:00
,_onEraseMouseDown(event) {
if (event.defaultPrevented) return;
event.preventDefault();
this._setRow(-1);
this.valueChanged(undefined);
}
2015-07-03 05:49:45 +00:00
2022-06-06 08:53:59 +00:00
,_onButtonMouseDown: function(event) {
2022-05-25 18:04:16 +00:00
if (this._popup) {
this._popup.hide();
return;
}
2022-06-06 08:53:59 +00:00
if (event.defaultPrevented) return;
event.preventDefault();
var model = this._model;
2022-05-25 18:04:16 +00:00
var menu = this.createElement('div');
menu.className = 'htk-select-menu';
2022-05-25 18:04:16 +00:00
var grid = new Htk.Grid({showHeader: false});
menu.appendChild(grid.node);
2016-10-16 14:16:08 +00:00
var gridNode = grid.node;
2022-05-25 18:04:16 +00:00
gridNode.addEventListener('click', this._onGridClicked.bind(this, grid));
2022-05-25 18:04:16 +00:00
var column = new ColumnText({columnIndex: this.showColumnIndex});
grid.appendColumn(column);
grid.model = model;
2022-05-25 18:04:16 +00:00
var popup = this._popup = new Htk.Popup({childNode: menu});
popup.on('closed', this._onPopupClose.bind(this));
2022-06-06 08:53:59 +00:00
popup.show(this.node, event);
2022-05-30 01:30:33 +00:00
this.emit('menu-show');
}
2022-05-25 18:04:16 +00:00
,_onGridClicked: function(grid, e) {
2022-10-04 08:17:43 +00:00
let cell;
let target = e.target;
2022-10-04 08:17:43 +00:00
while (target !== grid.tbody) {
cell = target;
target = target.parentNode;
}
2022-10-04 08:17:43 +00:00
if (!cell) return;
let value;
const row = cell.rowIndex - 1;
if (row >= 0)
2022-05-25 18:04:16 +00:00
value = this._model.getByIndex(row, this.valueColumnIndex);
else
value = null;
2022-05-25 18:04:16 +00:00
this._setRow(row);
this.valueChanged(value);
this._popup.hide();
2022-05-25 18:04:16 +00:00
e.stopPropagation();
}
2022-05-25 18:04:16 +00:00
,_onPopupClose: function() {
this._popup = null;
2022-05-30 01:30:33 +00:00
this.emit('menu-hide');
}
2022-05-25 18:04:16 +00:00
,_refreshShowText: function() {
var model = this._model;
if (this._row !== -1)
2022-05-25 18:04:16 +00:00
var showText = model.getByIndex(this._row, this.showColumnIndex);
else if (model && model.status === Db.Model.Status.LOADING)
var showText = _('Loading...');
else if (this._placeholder)
var showText = this._placeholder;
else
var showText = '';
2015-09-28 11:37:31 +00:00
2022-05-25 18:04:16 +00:00
Vn.Node.setText(this.label, showText);
}
2022-05-25 18:04:16 +00:00
,_onModelChange: function() {
var model = this._model;
2022-05-30 01:30:33 +00:00
this.emit('status-changed');
2015-10-14 11:51:43 +00:00
if (this._popup)
2022-05-25 18:04:16 +00:00
this._popup.reset();
2022-05-25 18:04:16 +00:00
if (model && model.ready) {
this._selectOption();
2022-05-30 01:30:33 +00:00
this.emit('ready');
2022-05-25 18:04:16 +00:00
} else
this._setRow(-1);
}
2022-05-25 18:04:16 +00:00
,setEditable: function(editable) {
this.node.disabled = !editable;
}
2022-05-25 18:04:16 +00:00
,_selectOption: function() {
2015-07-03 05:49:45 +00:00
var row;
2015-10-14 11:51:43 +00:00
if (this._model && this._model.ready)
2022-05-25 18:04:16 +00:00
row = this._model.searchByIndex(this.valueColumnIndex, this._value);
2015-07-03 05:49:45 +00:00
else
row = -1;
2022-05-25 18:04:16 +00:00
this._setRow(row);
}
2022-05-28 15:49:46 +00:00
,putValue: function() {
2022-05-25 18:04:16 +00:00
this._selectOption();
}
});