Adding a date filter that will format dates in Tower UI

based on the user's locale.

short and long date format filters

adding long date format to appropriate files

in doing a grep for the long date format, i found these files could instead use the londDate filter

Removing short hand abbreviation for dates.

We will now include the year in all our date formats

updating jshint to ignore moment

updating long date filter

.jshintrc

@@ -23,7 +23,8 @@
       "it": false,
       "expect": false,
       "context": false,
-      "describe": false
+      "describe": false,
+      "moment": false
     },
     "strict": false,
     "quotmark": false,

awx/ui/static/js/app.js

@@ -179,7 +179,8 @@ var tower = angular.module('Tower', [
     'CreateCustomInventoryHelper',
     'CustomInventoryListDefinition',
     'AdhocHelper',
-    'features'
+    'features',
+    'longDateFilter'
 ])
 
     .constant('AngularScheduler.partials', urlPrefix + 'lib/angular-scheduler/lib/')

awx/ui/static/js/filters.js

@@ -1,7 +1,9 @@
 import sanitizeFilter from 'tower/filters/sanitize/xss-sanitizer.filter';
 import capitalizeFilter from 'tower/filters/capitalize.filter';
+import longDateFilter from 'tower/filters/dates/long-date.filter';
 
 export {
   sanitizeFilter,
-  capitalizeFilter
+  capitalizeFilter,
+  longDateFilter
 };

awx/ui/static/js/filters/dates/long-date.filter.js

@@ -0,0 +1,6 @@
+angular.module('longDateFilter', []).filter('longDate', function() {
+  return function(input) {
+    var date = moment(input);
+    return date.format('l LTS');
+  };
+});

awx/ui/static/js/forms/LogViewerStatus.js

@@ -38,13 +38,13 @@ export default
                 "started": {
                     label: "Started",
                     type: "date",
-                    "filter": "date:'MM/dd/yy HH:mm:ss'",
+                    "filter": "longDate",
                     readonly: true
                 },
                 "finished": {
                     label: "Finished",
                     type: "date",
-                    "filter": "date:'MM/dd/yy HH:mm:ss'",
+                    "filter": "longDate",
                     readonly: true
                 },
                 "elapsed": {

awx/ui/static/js/helpers/EventViewer.js

@@ -423,10 +423,10 @@ export default
                         else if (key === "start" || key === "end" || key === "created") {
                             if (!/Z$/.test(itm)) {
                                 itm = itm.replace(/\ /,'T') + 'Z';
-                                html += $filter('date')(itm, 'MM/dd/yy HH:mm:ss.sss');
+                                html += $filter('longDate')(itm);
                             }
                             else {
-                                html += $filter('date')(itm, 'MM/dd/yy HH:mm:ss');
+                                html += $filter('longDate')(itm);
                             }
                         }
                         else if (key === "host_name" && event.host_id) {

awx/ui/static/js/lists/AllJobs.js

@@ -52,7 +52,7 @@ export default
                 label: 'Finished',
                 noLink: true,
                 searchable: false,
-                filter: "date:'MM/dd HH:mm:ss'",
+                filter: "longDate",
                 columnClass: "col-lg-2 col-md-2 hidden-xs",
                 key: true,
                 desc: true

awx/ui/static/js/lists/CompletedJobs.js

@@ -9,7 +9,7 @@
 
 
 export default
-    angular.module('CompletedJobsDefinition', ['sanitizeFilter'])
+    angular.module('CompletedJobsDefinition', ['sanitizeFilter', 'longDateFilter'])
     .value( 'CompletedJobsList', {
 
         name: 'completed_jobs',
@@ -51,7 +51,7 @@ export default
                 label: 'Finished',
                 noLink: true,
                 searchable: false,
-                filter: "date:'MM/dd HH:mm:ss'",
+                filter: "longDate",
                 columnClass: "col-lg-2 col-md-2 hidden-xs",
                 key: true,
                 desc: true

awx/ui/static/js/lists/Jobs.js

@@ -57,7 +57,7 @@ export default
                 label: 'Started',
                 noLink: true,
                 searchable: false,
-                filter: "date:'MM/dd HH:mm:ss'",
+                filter: "longDate",
                 columnClass: "col-lg-2 col-md-2 hidden-xs"
             },
             type: {

awx/ui/static/js/lists/PortalJobs.js

@@ -12,7 +12,7 @@
 
 
 export default
-    angular.module('PortalJobsListDefinition', [])
+    angular.module('PortalJobsListDefinition', ['longDateFilter'])
     .value( 'PortalJobsList', {
 
         name: 'portal_jobs',
@@ -58,7 +58,7 @@ export default
                 label: 'Started',
                 noLink: true,
                 searchable: false,
-                filter: "date:'MM/dd HH:mm:ss'",
+                filter: "longDate",
                 columnClass: "col-lg-3 col-md-3 hidden-xs"
             },
             name: {

awx/ui/static/js/lists/Projects.js

@@ -45,7 +45,7 @@ export default
             },
             last_updated: {
                 label: 'Last Updated',
-                filter: "date:'MM/dd/yy HH:mm:ss'",
+                filter: "longDate",
                 columnClass: "col-lg-2 col-md-2 hidden-sm hidden-xs",
                 excludeModal: true,
                 searchable: false,

awx/ui/static/js/lists/ScheduledJobs.js

@@ -9,7 +9,7 @@
 
 
 export default
-    angular.module('ScheduledJobsDefinition', ['sanitizeFilter'])
+    angular.module('ScheduledJobsDefinition', ['sanitizeFilter', 'longDateFilter'])
     .value( 'ScheduledJobsList', {
 
         name: 'schedules',
@@ -36,7 +36,7 @@ export default
                 noLink: true,
                 searchable: false,
                 columnClass: "col-lg-2 col-md-2 hidden-xs",
-                filter: "date:'MM/dd HH:mm:ss'",
+                filter: "longDate",
                 key: true
             },
             type: {

awx/ui/static/js/lists/Schedules.js

@@ -29,19 +29,19 @@ export default
             },
             dtstart: {
                 label: 'First Run',
-                filter: "date:'MM/dd/yy HH:mm:ss'",
+                filter: "longDate",
                 searchable: false,
                 columnClass: "col-md-2 col-sm-3 hidden-xs"
             },
             next_run: {
                 label: 'Next Run',
-                filter: "date:'MM/dd/yy HH:mm:ss'",
+                filter: "longDate",
                 searchable: false,
                 columnClass: "col-md-2 col-sm-3 col-xs-3"
             },
             dtend: {
                 label: 'Final Run',
-                filter: "date:'MM/dd/yy HH:mm:ss'",
+                filter: "longDate",
                 searchable: false,
                 columnClass: "col-md-2 col-sm-3 hidden-xs"
             }

awx/ui/static/js/lists/Streams.js

@@ -29,7 +29,7 @@ export default
                 desc: true,
                 noLink: true,
                 searchable: false,
-                filter: "date:'MM/dd/yy HH:mm:ss'"
+                filter: "longDate",
             },
             user: {
                 label: 'Initiated by',

awx/ui/static/js/widgets/Stream.js

@@ -300,7 +300,7 @@ angular.module('StreamWidget', ['RestServices', 'Utilities', 'StreamListDefiniti
                 scope = generator.inject(form, { mode: 'edit', modal: true, related: false });
                 scope.changes = activity.changes_stringified;
                 scope.user = ((activity.summary_fields.actor) ? activity.summary_fields.actor.username : 'system') +
-                    ' on ' + $filter('date')(activity.timestamp, "MM/dd/yy HH:mm:ss");
+                    ' on ' + $filter('longDate')(activity.timestamp);
                 scope.operation = activity.description_nolink;
 
                 scope.formModalAction = function () {

awx/ui/static/partials/job_detail.html

@@ -45,8 +45,8 @@
                         <div class="form-group" ng-show="job_status.started">
                             <label class="col-lg-2 col-md-2 col-sm-2 col-xs-3 control-label">Timing</label>
                             <div class="col-lg-10 col-md-10 col-sm-10 col-xs-9">
-                                <div ng-show="job_status.started" id="started-time">Started &nbsp;{{ job_status.started | date:'MM/dd/yy HH:mm:ss' }}</div>
+                                <div ng-show="job_status.started" id="started-time">Started &nbsp;{{ job_status.started | longDate }}</div>
-                                <div ng-show="job_status.finished" id="finished-time">Finished &nbsp;{{ job_status.finished | date:'MM/dd/yy HH:mm:ss' }}</div>
+                                <div ng-show="job_status.finished" id="finished-time">Finished &nbsp;{{ job_status.finished | longDate   }}</div>
                                 <div ng-show="job_status.finished" id="elapsed-time">Elapsed &nbsp;{{ job_status.elapsed }}</div>
                             </div>
                         </div>

awx/ui/static/partials/job_stdout_adhoc.html

@@ -44,10 +44,10 @@
                 <div class="col-lg-10 col-md-10 col-sm-10 col-xs-12
                     StandardOutDetails-detailContent">
                     <div ng-show="job.started" id="started-time">
-                        Started &nbsp;{{ job.started | date:'MM/dd/yy HH:mm:ss' }}
+                        Started &nbsp;{{ job.started | longDate }}
                     </div>
                     <div ng-show="job.finished" id="finished-time">
-                        Finished &nbsp;{{ job.finished | date:'MM/dd/yy HH:mm:ss' }}
+                        Finished &nbsp;{{ job.finished | longDate }}
                     </div>
                     <div ng-show="job.finished" id="elapsed-time">
                         Elapsed &nbsp;{{ job.elapsed }} seconds