Teach CRM.utils.formatDate to also show time
authorColeman Watts <coleman@civicrm.org>
Wed, 24 Jun 2020 00:05:56 +0000 (20:05 -0400)
committerColeman Watts <coleman@civicrm.org>
Sun, 5 Jul 2020 00:35:04 +0000 (20:35 -0400)
js/Common.js
tests/qunit/common-js/test.js [new file with mode: 0644]
tests/qunit/common-js/test.php [new file with mode: 0644]

index 0199e80eb1c5c37574a5699cbf4b8acd53f69f3d..33cefb23f1043c8ed8b59a3e602f12579c0ffa05 100644 (file)
@@ -1615,7 +1615,11 @@ if (!CRM.vars) CRM.vars = {};
     return Math.round(n / scale) * scale;
   };
 
-  // Create a js Date object from a unix timestamp or a yyyy-mm-dd string
+  /**
+   * Create a js Date object from a unix timestamp or a yyyy-mm-dd string
+   * @param input
+   * @returns {Date}
+   */
   CRM.utils.makeDate = function(input) {
     switch (typeof input) {
       case 'object':
@@ -1624,10 +1628,16 @@ if (!CRM.vars) CRM.vars = {};
 
       case 'string':
         // convert iso format with or without dashes
-        if (input.indexOf('-') > 0) {
-          return $.datepicker.parseDate('yy-mm-dd', input.substr(0, 10));
+        input = input.replace(/[- :]/g, '');
+        var output = $.datepicker.parseDate('yymmdd', input.substr(0, 8));
+        if (input.length === 14) {
+          output.setHours(
+            parseInt(input.substr(8, 2), 10),
+            parseInt(input.substr(10, 2), 10),
+            parseInt(input.substr(12, 2), 10)
+          );
         }
-        return $.datepicker.parseDate('yymmdd', input.substr(0, 8));
+        return output;
 
       case 'number':
         // convert unix timestamp
@@ -1636,10 +1646,39 @@ if (!CRM.vars) CRM.vars = {};
     throw 'Invalid input passed to CRM.utils.makeDate';
   };
 
-  // Format a date for output to the user
-  // Input may be a js Date object, a unix timestamp or a yyyy-mm-dd string
-  CRM.utils.formatDate = function(input, outputFormat) {
-    return input ? $.datepicker.formatDate(outputFormat || CRM.config.dateInputFormat, CRM.utils.makeDate(input)) : '';
+  /**
+   * Format a date (and optionally time) for output to the user
+   *
+   * @param {string|int|Date} input
+   *   Input may be a js Date object, a unix timestamp or a 'yyyy-mm-dd' string
+   * @param {string|null} dateFormat
+   *   A string like 'yy-mm-dd' or null to use the system default
+   * @param {int|bool} timeFormat
+   *   Leave empty to omit time from the output (default)
+   *   Or pass 12, 24, or true to use the system default for 12/24hr format
+   * @returns {string}
+   */
+  CRM.utils.formatDate = function(input, dateFormat, timeFormat) {
+    if (!input) {
+      return '';
+    }
+    var date = CRM.utils.makeDate(input),
+      output = $.datepicker.formatDate(dateFormat || CRM.config.dateInputFormat, date);
+    if (timeFormat) {
+      var hour = date.getHours(),
+        min = date.getMinutes(),
+        suf = '';
+      if (timeFormat === 12 || (timeFormat === true && !CRM.config.timeIs24Hr)) {
+        suf = ' ' + (hour < 12 ? ts('AM') : ts('PM'));
+        if (hour === 0 || hour > 12) {
+          hour = Math.abs(hour - 12);
+        }
+      } else if (hour < 10) {
+        hour = '0' + hour;
+      }
+      output += ' ' + hour + ':' + (min < 10 ? '0' : '') + min + suf;
+    }
+    return output;
   };
 
   // Used to set appropriate text color for a given background
diff --git a/tests/qunit/common-js/test.js b/tests/qunit/common-js/test.js
new file mode 100644 (file)
index 0000000..df27eff
--- /dev/null
@@ -0,0 +1,23 @@
+module('dates');
+
+test("format date", function() {
+  var value = CRM.utils.formatDate('2021-05-10', 'mm/dd/yy');
+  equal(value, "05/10/2021", "Expect formatted date");
+});
+
+test("format datetime 12", function() {
+  var value = CRM.utils.formatDate('2021-05-10 12:35:00', 'mm/dd/yy', 12);
+  equal(value, "05/10/2021 12:35 PM", "Expect formatted date time");
+
+  value = CRM.utils.formatDate('2021-05-10 00:35:00', 'mm/dd/yy', 12);
+  equal(value, "05/10/2021 12:35 AM", "Expect formatted date time");
+});
+
+
+test("format datetime 24", function() {
+  var value = CRM.utils.formatDate('2020-05-20 04:25:40', 'mm/dd/yy', 24);
+  equal(value, "05/20/2020 04:25", "Expect formatted date time");
+
+  value = CRM.utils.formatDate('2020-05-20 14:25:40', 'mm/dd/yy', 24);
+  equal(value, "05/20/2020 14:25", "Expect formatted date time");
+});
diff --git a/tests/qunit/common-js/test.php b/tests/qunit/common-js/test.php
new file mode 100644 (file)
index 0000000..7fab71c
--- /dev/null
@@ -0,0 +1,4 @@
+<?php
+// CRM_Core_Resources::singleton()->addScriptFile(...);
+// CRM_Core_Resources::singleton()->addStyleFile(...);
+// CRM_Core_Resources::singleton()->addSetting(...);