[IMP] web: update datepicker syntax with the new guidelines

This commit is contained in:
Christophe Matthieu
2017-05-15 16:19:47 +02:00
parent 932e887400
commit 5f13b7f019
3 changed files with 104 additions and 45 deletions
@@ -345,7 +345,7 @@ var FieldDate = InputField.extend({
* @private
*/
_doDebouncedAction: function () {
this.datewidget.change_datetime();
this.datewidget.changeDatetime();
},
/**
@@ -354,7 +354,7 @@ var FieldDate = InputField.extend({
* @private
*/
_getValue: function () {
return this.datewidget.get_value();
return this.datewidget.getValue();
},
/**
* @override
@@ -383,7 +383,7 @@ var FieldDate = InputField.extend({
* @private
*/
_renderEdit: function () {
this.datewidget.set_value(this.value);
this.datewidget.setValue(this.value);
this.$input = this.datewidget.$input;
},
@@ -412,7 +412,7 @@ var FieldDateTime = FieldDate.extend({
* @private
*/
_getValue: function () {
var value = this.datewidget.get_value();
var value = this.datewidget.getValue();
return value && value.add(-this.getSession().tzOffset, 'minutes');
},
@@ -435,7 +435,7 @@ var FieldDateTime = FieldDate.extend({
*/
_renderEdit: function () {
var value = this.value && this.value.clone().add(this.getSession().tzOffset, 'minutes');
this.datewidget.set_value(value);
this.datewidget.setValue(value);
this.$input = this.datewidget.$input;
},
+97 -38
View File
@@ -12,10 +12,13 @@ var DateWidget = Widget.extend({
template: "web.datepicker",
type_of_date: "date",
events: {
'dp.change': 'change_datetime',
'dp.show': 'set_datetime_default',
'change .o_datepicker_input': 'change_datetime',
'dp.change': 'changeDatetime',
'dp.show': '_onShow',
'change .o_datepicker_input': 'changeDatetime',
},
/**
* @override
*/
init: function(parent, options) {
this._super.apply(this, arguments);
@@ -41,6 +44,9 @@ var DateWidget = Widget.extend({
keyBinds: null,
});
},
/**
* @override
*/
start: function() {
this.$input = this.$('input.o_datepicker_input');
this.$input.focus(function(e) {
@@ -49,67 +55,120 @@ var DateWidget = Widget.extend({
this.$input.datetimepicker(this.options);
this.picker = this.$input.data('DateTimePicker');
this.$input.click(this.picker.toggle.bind(this.picker));
this.set_readonly(false);
this._setReadonly(false);
},
set_value: function(value) {
this.set({'value': value});
var formatted_value = value ? this.format_client(value) : null;
this.$input.val(formatted_value);
if (this.picker) {
this.picker.date(value || null);
/**
* @override
*/
destroy: function() {
this.picker.destroy();
this._super.apply(this, arguments);
},
//--------------------------------------------------------------------------
// Public
//--------------------------------------------------------------------------
/**
* set datetime value
*/
changeDatetime: function () {
if(this.isValid()) {
this._setValueFromUi();
this.trigger("datetime_changed");
}
},
get_value: function() {
/**
* @returns {Moment|false}
*/
getValue: function () {
var value = this.get('value');
return value && value.clone();
},
set_value_from_ui: function() {
var value = this.$input.val() || false;
this.set_value(this.parse_client(value));
},
set_readonly: function(readonly) {
this.readonly = readonly;
this.$input.prop('readonly', this.readonly);
},
is_valid: function() {
/**
* @returns {boolean}
*/
isValid: function () {
var value = this.$input.val();
if(value === "") {
return true;
} else {
try {
this.parse_client(value);
this._parseClient(value);
return true;
} catch(e) {
return false;
}
}
},
parse_client: function(v) {
return field_utils.parse[this.type_of_date](v, null, {timezone: false});
/**
* @param {Moment|false}
*/
setValue: function (value) {
this.set({'value': value});
var formatted_value = value ? this._formatClient(value) : null;
this.$input.val(formatted_value);
if (this.picker) {
this.picker.date(value || null);
}
},
format_client: function(v) {
//--------------------------------------------------------------------------
// Private
//--------------------------------------------------------------------------
/**
* @private
* @param {Moment}
* @returns {string}
*/
_formatClient: function (v) {
return field_utils.format[this.type_of_date](v, null, {timezone: false});
},
set_datetime_default: function() {
/**
* @private
* @param {string|false}
* @returns {Moment}
*/
_parseClient: function (v) {
return field_utils.parse[this.type_of_date](v, null, {timezone: false});
},
/**
* @private
* @param {boolean}
*/
_setReadonly: function (readonly) {
this.readonly = readonly;
this.$input.prop('readonly', this.readonly);
},
/**
* set the value from the input value
*
* @private
*/
_setValueFromUi: function() {
var value = this.$input.val() || false;
this.setValue(this._parseClient(value));
},
//--------------------------------------------------------------------------
// Handlers
//--------------------------------------------------------------------------
/**
* set the date of the picker by the current date or the today date
*
* @private
*/
_onShow: function () {
//when opening datetimepicker the date and time by default should be the one from
//the input field if any or the current day otherwise
var value = moment().second(0);
if(this.$input.val().length !== 0 && this.is_valid()) {
value = this.parse_client(this.$input.val());
if(this.$input.val().length !== 0 && this.isValid()) {
value = this._parseClient(this.$input.val());
}
this.picker.date(value);
},
change_datetime: function() {
if(this.is_valid()) {
this.set_value_from_ui();
this.trigger("datetime_changed");
}
},
destroy: function() {
this.picker.destroy();
this._super.apply(this, arguments);
},
});
var DateTimeWidget = DateWidget.extend({
@@ -660,9 +660,9 @@ var DomainLeaf = DomainNode.extend({
this.valueWidget = new (selectedField.type === "datetime" ? datepicker.DateTimeWidget : datepicker.DateWidget)(this);
wDefs.push(this.valueWidget.appendTo("<div/>").then((function () {
this.valueWidget.$el.addClass("o_domain_leaf_value_input");
this.valueWidget.set_value(moment(this.value));
this.valueWidget.setValue(moment(this.value));
this.valueWidget.on("datetime_changed", this, function () {
this._changeValue(this.valueWidget.get_value());
this._changeValue(this.valueWidget.getValue());
});
}).bind(this)));
}