#66 Show dates with browser timezone/locale

webhooksite · Jul 15, 2019 · 2e7f233 · 2e7f233
1 parent 9ba1f0d
commit 2e7f233
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 9 deletions.
diff --git a/package.json b/package.json
@@ -16,6 +16,7 @@
     "jquery": "^3.1.1",
     "laravel-echo": "^1.3.5",
     "laravel-elixir": "^4.0.0",
+    "moment": "^2.24.0",
     "pretty-data": "^0.40.0",
     "pusher-js": "^4.2.2"
   },

diff --git a/public/css/app.css b/public/css/app.css
diff --git a/public/js/bundle.js b/public/js/bundle.js
diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
@@ -1,4 +1,5 @@
-var prettyData = require('pretty-data').pd;
+let prettyData = require('pretty-data').pd;
+let moment = require('moment');
 
 angular
     .module("app", [
@@ -517,6 +518,14 @@ angular
             return content;
         };
 
+        $scope.localDate = (function (dateTimeString) {
+            return moment.utc(dateTimeString).local().format('lll');
+        });
+
+        $scope.relativeDate = (function (dateTimeString) {
+            return moment.utc(dateTimeString).fromNow();
+        });
+
         // Initialize app. Check whether we need to load a token.
         if ($state.current.name) {
             if ($scope.getSetting('token') && !$stateParams.id) {

diff --git a/resources/views/app.php b/resources/views/app.php
@@ -92,7 +92,7 @@ class="btn btn-xs btn-link">
                             <a ng-click="setCurrentRequest(request)" class="select">
                                 <span class="label label-{{ getLabel(request.method) }}">{{ request.method }}</span>
                                 #{{ request.uuid.substring(0,5) }} {{ request.ip }} <br/>
-                                <small>{{ request.created_at }}</small>
+                                <small>{{ localDate(request.created_at) }}</small>
                             </a>
                             <a ng-click="deleteRequest(request, key)" class="btn btn-danger delete">
                                 X
@@ -246,7 +246,7 @@ class="btn btn-xs" ng-class="redirectUrl ? '' : 'disabled'"
                                     </tr>
                                     <tr>
                                         <td>Date</td>
-                                        <td id="req-date">{{ currentRequest.created_at }}</td>
+                                        <td id="req-date" title="{{ currentRequest.created_at }} UTC">{{ localDate(currentRequest.created_at) }} ({{ relativeDate(currentRequest.created_at) }})</td>
                                     </tr>
                                     <tr>
                                         <td>ID</td>