From 056e43717eaefec6c1d51c5fa50216122f4eecb1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Krier?= <ced@b2ck.com>
Date: Sun, 27 Sep 2020 12:29:38 +0200
Subject: [PATCH] Use ISO string format for timeseries graph

c3 does not support moment but only string with a specific format.
We implement .toString on the moment prototype because form widgets does not
use Sao.Date nor Sao.DateTime. This ensures that calling .toString will always
return the ISO format.
And finally the x field type is retrieved from the model instead of the
attribute which is no more filled since changeset 2fc36d9e359b

issue9539
review296221002
---
 src/sao.js        | 31 +++++++++++++++++++++----------
 src/view/graph.js | 10 +++++++---
 tests/sao.js      | 21 +++++++++++++++++++++
 3 files changed, 49 insertions(+), 13 deletions(-)

diff --git a/src/sao.js b/src/sao.js
index d63a8420e6..3d26e9a7fb 100644
--- a/src/sao.js
+++ b/src/sao.js
@@ -168,6 +168,27 @@ var Sao = {};
 
     Sao.Decimal = Number;
 
+    var _moment_to_string = moment.prototype.toString;
+    moment.prototype.toString = function() {
+        if (this.isDate) {
+            return this.format('YYYY-MM-DD');
+        } else if (this.isDateTime) {
+            if (this.milliseconds()) {
+                return this.format('YYYY-MM-DD HH:mm:ss.SSSSSS');
+            } else {
+                return this.format('YYYY-MM-DD HH:mm:ss');
+            }
+        } else if (this.isTime) {
+            if (this.milliseconds()) {
+                return this.format('HH:mm:ss.SSSSSS');
+            } else {
+                return this.format('HH:mm:ss');
+            }
+        } else {
+            return _moment_to_string.call(this);
+        }
+    };
+
     Sao.Date = function(year, month, day, utc) {
         var date;
         if (month === undefined) {
@@ -185,9 +206,6 @@ var Sao = {};
         date.date(day);
         date.set({hour: 0, minute: 0, second: 0, millisecond: 0});
         date.isDate = true;
-        date.toString = function() {
-            return this.format('YYYY-MM-DD');
-        };
         return date;
     };
 
@@ -234,13 +252,6 @@ var Sao = {};
             datetime.milliseconds(millisecond);
         }
         datetime.isDateTime = true;
-        datetime.toString = function() {
-            if (this.milliseconds()) {
-                return this.format('YYYY-MM-DD HH:mm:ss.SSSSSS');
-            } else {
-                return this.format('YYYY-MM-DD HH:mm:ss');
-            }
-        };
         datetime.local();
         return datetime;
     };
diff --git a/src/view/graph.js b/src/view/graph.js
index e388c6cb09..7427cdf1b6 100644
--- a/src/view/graph.js
+++ b/src/view/graph.js
@@ -98,7 +98,7 @@
                     var x = record.field_get_client(this.xfield.name);
                     // c3 does not support moment
                     if (x && (x.isDate || x.isDateTime)) {
-                        x = x.toDate();
+                        x = x.toString();
                     }
                     data.columns[0][index + 1] = x;
                     this._add_id(x, record.id);
@@ -177,18 +177,21 @@
             c3_config.data.x = 'labels';
             c3_config.data.onclick = this.action.bind(this);
 
-            var type = this.xfield.type;
+            var type = this.view.screen.model.fields[this.xfield.name]
+                .description.type;
             if ((type == 'date') || (type == 'datetime')) {
                 var format_func, date_format, time_format;
                 date_format = Sao.common.date_format(
                     this.view.screen.context.date_format);
                 time_format = '%X';
                 if (type == 'datetime') {
+                    c3_config.data.xFormat = '%Y-%m-%d %H:%M:%S';
                     format_func = function(dt) {
                         return Sao.common.format_datetime(date_format,
                                 time_format, moment(dt));
                     };
                 } else {
+                    c3_config.data.xFormat = '%Y-%m-%d';
                     format_func = function(dt) {
                         return Sao.common.format_date(date_format, moment(dt));
                     };
@@ -286,7 +289,8 @@
             delete config.axis;
             delete config.data.x;
             var format_func;
-            var type = this.xfield.type;
+            var type = this.view.screen.model.fields[this.xfield.name]
+                .description.type;
             if ((type == 'date') || (type == 'datetime')) {
                 var date_format = Sao.common.date_format(
                     this.view.screen.context.date_format);
diff --git a/tests/sao.js b/tests/sao.js
index 1806554ac6..c62f8b1c76 100644
--- a/tests/sao.js
+++ b/tests/sao.js
@@ -2918,6 +2918,27 @@
             ["Active: False", "Active: True"]));
     });
 
+    QUnit.test('Date.toString', function() {
+        QUnit.strictEqual(Sao.Date(2020, 8, 11).toString(), '2020-09-11');
+    });
+
+    QUnit.test('DateTime.toString', function() {
+        QUnit.strictEqual(
+            Sao.DateTime(2020, 8, 11, 10, 30, 42).toString(),
+            '2020-09-11 10:30:42');
+
+        QUnit.strictEqual(
+            Sao.DateTime(2020, 8, 11, 10, 30, 42, 123).toString(),
+            '2020-09-11 10:30:42.123000');
+    });
+
+    QUnit.test('Time.toString', function() {
+        QUnit.strictEqual(Sao.Time(10, 30, 42).toString(), '10:30:42');
+
+        QUnit.strictEqual(
+            Sao.Time(10, 30, 42, 123).toString(), '10:30:42.123000');
+    });
+
     QUnit.test('HTML Sanitization', function() {
         var examples = [
             ["Test", "Test"],