[FIX] web,*: time format from user's language

Before this fix, the chatter always showed dates of messages in military time format.

This was not the expected behavior, as the user could have had customize
the date and time format in the settings of the current language.

Steps to reproduce the issue:

1. Set Odoo in English
2. Settings > Translations > Languages > English
   2.1. Set Date Format to %m/%d/%Y
   2.2. Set Time Format to %I:%M:%S %p
3. CRM > (Select any opportunity with at least one message) > Mouse hover on elapsed time (e.g. "an hour ago")

Expected:

- It shows the customized time format (e.g. 11/07/2017 5:33:36 PM)

Results:

- It shows the military time format (e.g. Tue Nov 07 2017 17:33:36 GMT+0100)

opw-781647

addons/account/static/src/js/reconciliation/reconciliation_renderer.js

@@ -113,7 +113,7 @@ var StatementRenderer = Widget.extend(FieldManagerMixin, {
         if (state.valuenow === state.valuemax && !this.$('.done_message').length) {
             var dt = Date.now()-this.time;
             var $done = $(qweb.render("reconciliation.done", {
-                'duration': moment(dt).utc().format(time.strftime_to_moment_format(_t.database.parameters.time_format)),
+                'duration': moment(dt).utc().format(time.getLangTimeFormat()),
                 'number': state.valuenow,
                 'timePerTransaction': Math.round(dt/1000/state.valuemax),
                 'context': state.context,

addons/mail/static/src/js/activity.js

@@ -20,8 +20,7 @@ var setDelayLabel = function(activities){
     var today = moment().startOf('day');
     _.each(activities, function(activity){
         var to_display = '';
-        var deadline = moment(activity.date_deadline + ' 00:00:00');
-        var diff = deadline.diff(today, 'days', true); // true means no rounding
+        var diff = activity.date_deadline.diff(today, 'days', true); // true means no rounding
         if(diff === 0){
             to_display = _t('Today');
         }else{
@@ -72,10 +71,17 @@ var AbstractActivityField = AbstractField.extend({
                 });
         }
         return $.when(fetch_def).then(function (results) {
+            // convert create_date and date_deadline to moments
+            _.each(results, function (activity) {
+                activity.create_date = moment(time.auto_str_to_date(activity.create_date));
+                activity.date_deadline = moment(time.auto_str_to_date(activity.date_deadline));
+            });
+
             // filter out activities that are no longer linked to this record
             self.activities = _.filter(self.activities.concat(results || []), function (activity) {
                 return _.contains(self.value.res_ids, activity.id);
             });
+
             // sort activities by due date
             self.activities = _.sortBy(self.activities, 'date_deadline');
         });
@@ -122,7 +128,6 @@ var Activity = AbstractActivityField.extend({
         var fetch_def = this.dp.add(this._readActivities());
         return fetch_def.then(function () {
             _.each(self.activities, function (activity) {
-                activity.time_ago = moment(time.auto_str_to_date(activity.create_date)).fromNow();
                 if (activity.note) {
                     activity.note = utils.parse_and_transform(activity.note, utils.add_link);
                 }
@@ -135,6 +140,7 @@ var Activity = AbstractActivityField.extend({
                     nbPlannedActivities: nbActivities.planned,
                     nbTodayActivities: nbActivities.today,
                     nbOverdueActivities: nbActivities.overdue,
+                    date_format: time.getLangDatetimeFormat(),
                 }));
             } else {
                 self.$el.empty();

addons/mail/static/src/js/thread.js

@@ -2,6 +2,7 @@ odoo.define('mail.ChatThread', function (require) {
 "use strict";
 
 var core = require('web.core');
+var time = require('web.time');
 var DocumentViewer = require('mail.DocumentViewer');
 var Widget = require('web.Widget');
 
@@ -111,6 +112,7 @@ var Thread = Widget.extend({
             messages: msgs,
             options: options,
             ORDER: ORDER,
+            date_format: time.getLangDatetimeFormat(),
         }));
 
         this.attachments = _.uniq(_.flatten(_.map(messages, 'attachment_ids')));

addons/mail/static/src/xml/activity.xml

@@ -40,13 +40,13 @@
                                     </dd>
                                     <dt>Created on</dt>
                                     <dd class="mb8">
-                                        <t t-esc="moment(activity.create_date)"/>
+                                        <t t-esc="activity.create_date.format(date_format)"/>
                                     </dd>
                                     <dt>Assigned to</dt>
                                     <dd class="mb8">
                                         <img t-attf-src="/web/image#{activity.user_id[0] >= 0 ? ('/res.users/' + activity.user_id[0] + '/image_small') : ''}" height="18" width="18" class="img-circle mr4" t-att-title="activity.create_uid[1]"/>
                                         <b><t t-esc="activity.user_id[1]"/></b>
-                                        <em>, due on </em><span t-attf-class="o_activity_color_#{activity.state}"><t t-esc="moment(activity.date_deadline)"/></span>
+                                        <em>, due on </em><span t-attf-class="o_activity_color_#{activity.state}"><t t-esc="activity.date_deadline.format(date_format)"/></span>
                                     </dd>
                                 </dl>
                             </div>

addons/mail/static/src/xml/thread.xml

@@ -145,7 +145,7 @@
                         t-att-src="message.avatar_src"
                         class="o_thread_message_avatar img-circle"/>
                 </t>
-                <span t-if="!message.display_author" t-att-title="message.date" class="o_thread_message_side_date">
+                <span t-if="!message.display_author" t-att-title="message.date.format(date_format)" class="o_thread_message_side_date">
                     <t t-esc="message.date.format('hh:mm')"/>
                 </span>
                 <i t-if="!message.display_author and options.display_stars and message.message_type != 'notification'"
@@ -172,7 +172,7 @@
                         <t t-esc="message.displayed_author"/>
                     </strong>
 
-                    - <small class="o_mail_timestamp" t-att-title="message.date"><t t-esc="message.hour"/></small>
+                    - <small class="o_mail_timestamp" t-att-title="message.date.format(date_format)"><t t-esc="message.hour"/></small>
                     <t t-if="message.model and (message.model != 'mail.channel') and options.display_document_link">
                         <a t-att-href="message.url" t-att-data-oe-model="message.model" t-att-data-oe-id="message.res_id" class="o_document_link">on <t t-esc="message.record_name"/></a>
                     </t>

addons/survey/static/src/js/survey.js

@@ -181,9 +181,8 @@ if(!the_form.length) {
     // frontend does not load moment locale at all.
     // so wait until DOM ready with locale then init datetimepicker
     ready_with_locale.then(function(){
-        var l10n = _t.database.parameters;
         $('.form-control.date').datetimepicker({
-            format : time.strftime_to_moment_format(l10n.date_format),
+            format : time.getLangDateFormat(),
             minDate: moment({ y: 1900 }),
             maxDate: moment().add(200, "y"),
             calendarWeeks: true,

addons/web/static/src/js/core/time.js

@@ -279,6 +279,27 @@ var normalize_format_table = {
 };
 var inverse_normalize_format_table = _.invert(normalize_format_table);
 
+/**
+ * Get date format of the user's language
+ */
+function getLangDateFormat() {
+    return this.strftime_to_moment_format(_t.database.parameters.date_format);
+}
+
+/**
+ * Get time format of the user's language
+ */
+function getLangTimeFormat() {
+    return this.strftime_to_moment_format(_t.database.parameters.time_format);
+}
+
+/**
+ * Get date time format of the user's language
+ */
+function getLangDatetimeFormat() {
+    return this.strftime_to_moment_format(_t.database.parameters.date_format + " " + _t.database.parameters.time_format);
+}
+
 
 
 return {
@@ -293,6 +314,9 @@ return {
     auto_date_to_str: auto_date_to_str,
     strftime_to_moment_format: strftime_to_moment_format,
     moment_to_strftime_format: moment_to_strftime_format,
+    getLangDateFormat: getLangDateFormat,
+    getLangTimeFormat: getLangTimeFormat,
+    getLangDatetimeFormat: getLangDatetimeFormat,
 };
 
 });

addons/web/static/src/js/fields/field_utils.js

@@ -97,8 +97,7 @@ function formatDate(value, field, options) {
             value = value.clone().add(session.getTZOffset(value), 'minutes');
         }
     }
-    var l10n = core._t.database.parameters;
-    var date_format = time.strftime_to_moment_format(l10n.date_format);
+    var date_format = time.getLangDateFormat();
     return value.format(date_format);
 }
 
@@ -122,11 +121,7 @@ function formatDateTime(value, field, options) {
     if (!options || !('timezone' in options) || options.timezone) {
         value = value.clone().add(session.getTZOffset(value), 'minutes');
     }
-    var l10n = core._t.database.parameters;
-    var date_format = time.strftime_to_moment_format(l10n.date_format);
-    var time_format = time.strftime_to_moment_format(l10n.time_format);
-    var datetime_format = date_format + ' ' + time_format;
-    return value.format(datetime_format);
+    return value.format(time.getLangDatetimeFormat());
 }
 
 /**
@@ -349,7 +344,7 @@ function parseDate(value, field, options) {
     if (!value) {
         return false;
     }
-    var datePattern = time.strftime_to_moment_format(core._t.database.parameters.date_format);
+    var datePattern = time.getLangDateFormat();
     var datePatternWoZero = datePattern.replace('MM','M').replace('DD','D');
     var date;
     if (options && options.isUTC) {
@@ -388,8 +383,8 @@ function parseDateTime(value, field, options) {
     if (!value) {
         return false;
     }
-    var datePattern = time.strftime_to_moment_format(core._t.database.parameters.date_format),
-        timePattern = time.strftime_to_moment_format(core._t.database.parameters.time_format);
+    var datePattern = time.getLangDateFormat(),
+        timePattern = time.getLangTimeFormat();
     var datePatternWoZero = datePattern.replace('MM','M').replace('DD','D'),
         timePatternWoZero = timePattern.replace('HH','H').replace('mm','m').replace('ss','s');
     var pattern1 = datePattern + ' ' + timePattern;

addons/web/static/src/js/views/calendar/calendar_model.js

@@ -382,8 +382,8 @@ return AbstractModel.extend({
             allDayText: _t("All day"),
             views: {
                 week: {
-                    columnFormat: 'ddd ' + time.strftime_to_moment_format(_t.database.parameters.date_format),
-                    titleFormat: time.strftime_to_moment_format(_t.database.parameters.time_format),
+                    columnFormat: 'ddd ' + time.getLangDateFormat(),
+                    titleFormat: time.getLangTimeFormat(),
                 }
             },
             monthNames: moment.months(),

addons/web/static/src/js/widgets/date_picker.js

@@ -26,7 +26,7 @@ var DateWidget = Widget.extend({
 
         this.name = parent.name;
         this.options = _.defaults(options || {}, {
-            format : time.strftime_to_moment_format((this.type_of_date === 'datetime')? (l10n.date_format + ' ' + l10n.time_format) : l10n.date_format),
+            format : this.type_of_date === 'datetime' ? time.getLangDatetimeFormat() : time.getLangDateFormat(),
             minDate: moment({ y: 1900 }),
             maxDate: moment().add(200, "y"),
             calendarWeeks: true,

addons/website/static/src/js/menu/content.js

@@ -140,7 +140,7 @@ var PagePropertiesDialog = widget.Dialog.extend({
                down: 'fa fa-chevron-down',
               },
            locale : moment.locale(),
-           format : time.strftime_to_moment_format(l10n.date_format +' '+ l10n.time_format),
+           format : time.getLangDatetimeFormat(),
            widgetPositioning : {
               horizontal: 'auto',
               vertical: 'top',

addons/website_form/static/src/js/website_form.js

@@ -40,12 +40,12 @@ odoo.define('website_form.animation', function (require) {
                     down: 'fa fa-chevron-down',
                    },
                 locale : moment.locale(),
-                format : time.strftime_to_moment_format(l10n.date_format +' '+ l10n.time_format),
+                format : time.getLangDatetimeFormat(),
             };
             this.$target.find('.o_website_form_datetime').datetimepicker(datepickers_options);
 
             // Adapt options to date-only pickers
-            datepickers_options.format = time.strftime_to_moment_format(l10n.date_format);
+            datepickers_options.format = time.getLangDateFormat();
             this.$target.find('.o_website_form_date').datetimepicker(datepickers_options);
 
             return this._super.apply(this, arguments);
@@ -209,8 +209,8 @@ odoo.define('website_form.animation', function (require) {
 
         // This is a stripped down version of format.js parse_value function
         parse_date: function (value, type_of_date, value_if_empty) {
-            var date_pattern = time.strftime_to_moment_format(_t.database.parameters.date_format),
-                time_pattern = time.strftime_to_moment_format(_t.database.parameters.time_format);
+            var date_pattern = time.getLangDateFormat(),
+                time_pattern = time.getLangTimeFormat();
             var date_pattern_wo_zero = date_pattern.replace('MM','M').replace('DD','D'),
                 time_pattern_wo_zero = time_pattern.replace('HH','H').replace('mm','m').replace('ss','s');
             switch (type_of_date) {