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

74 lines
1.5 KiB
JavaScript

require('./style.scss');
var Calendar = require('../calendar');
module.exports = new Class({
Extends: Htk.Field
,Tag: 'htk-date-chooser'
,format: _('%a, %e %b %Y')
,calendar: null
,ignoreCalendarChange: false
,render: function() {
const node = this.createRoot('button');
node.classList.add('input');
node.addEventListener('click', this._onClick.bind(this));
this.label = this.createElement('span');
node.appendChild(this.label);
const dropDown = new Htk.Icon({
name: 'expand_more'
});
node.appendChild(dropDown.node);
this.setEditable(this._editable);
}
,putValue: function(value) {
var dateString;
if (value instanceof Date)
dateString = Vn.Date.strftime(value, this.format);
else
dateString = '';
Vn.Node.setText(this.label, dateString);
}
,setEditable: function(editable) {
if (this.calendar) {
this.calendar.disconnectByInstance(this);
this.calendar = null;
}
if (editable) {
this.calendar = new Calendar();
this.calendar.on('changed', this._onCalendarChange.bind(this));
this.popup = new Htk.Popup();
this.popup.child = this.calendar;
}
}
,_onCalendarChange: function(calendar) {
if (this.ignoreCalendarChange)
return;
this.popup.hide();
var newDate = calendar.value;
this.putValue(newDate);
this.valueChanged(newDate);
}
,_onClick: function() {
this.ignoreCalendarChange = true;
this.calendar.value = this._value;
this.calendar.goToSelectedMonth();
this.ignoreCalendarChange = false;
this.popup.show(this.node);
}
});