Skip to content

Commit 69bae45

Browse files
committed
Use angular-moment for relative timestamps
https://github.com/urish/angular-moment
1 parent 402dd22 commit 69bae45

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+305
-167
lines changed

README.md

-2
Original file line numberDiff line numberDiff line change
@@ -145,7 +145,6 @@ For more details on the expected scope arguments, see the source under [app/scri
145145
146146
* toggle (attribute) - intended for Bootstrap's data-toggle=tooltip and data-toggle=popover, will automatically initialize any tooltips and popovers
147147
* alerts (element) - renders a set of alerts according to the [patternfly style](https://www.patternfly.org/widgets/#alerts)
148-
* relative-timestamp (element) - renders a relative timestamp (ex: '5 minutes ago') based on the current time, auto-updating every 30 seconds
149148
* copy-to-clipboard (element) - creates a copy to clipboard button using clipboard.js
150149
* back (attribute) - when the element is clicked a simulated browser back button event occurs (calls history.back)
151150
* select-on-focus (attribute) - when the element is focused, all text within it will be selected
@@ -158,7 +157,6 @@ For more details on the expected scope arguments, see the source under [app/scri
158157
159158
For more details on the expected arguments, see the source under [app/scripts/filters](app/scripts/filters)
160159
161-
* dateRelative - returns the relative date for a timestamp given the current time (ex: '5 minutes ago')
162160
* ageLessThan - returns whether a timestamp is within a given time amount (ex: 5) and unit (ex: 'minutes'). Refer to the [Moment.js docs](http://momentjs.com/docs/#/manipulating/add/) for the supported units.
163161
* orderObjectsByDate - given an array or hash of k8s or openshift API objects, return an array of the objects sorted by the creationTimestamp. By default orders with oldest first, optional reverse param will return ordered by newest first.
164162
* annotation - for a k8s or OpenShift api object, lets you get any annotation by key

app/index.html

+1
Original file line numberDiff line numberDiff line change
@@ -151,6 +151,7 @@ <h1>JavaScript Required</h1>
151151
<script src="bower_components/angular-key-value-editor/dist/compiled-templates.js"></script>
152152
<script src="bower_components/angular-inview/angular-inview.js"></script>
153153
<script src="bower_components/js-yaml/dist/js-yaml.js"></script>
154+
<script src="bower_components/angular-moment/angular-moment.js"></script>
154155
<!-- endbower -->
155156
<!-- endbuild -->
156157

app/scripts/app.js

+8-8
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,8 @@ angular
2828
'as.sortable',
2929
'ui.select',
3030
'key-value-editor',
31-
'angular-inview'
31+
'angular-inview',
32+
'angularMoment'
3233
])
3334
.config(function ($routeProvider) {
3435
$routeProvider
@@ -415,6 +416,11 @@ angular
415416
.constant('SOURCE_URL_PATTERN', /^((ftp|http|https|git|ssh):\/\/(\w+:{0,1}[^\s@]*@)|git@)?([^\s@]+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/ )
416417
// http://stackoverflow.com/questions/9038625/detect-if-device-is-ios
417418
.constant('IS_IOS', /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream)
419+
.constant('amTimeAgoConfig', {
420+
// Set the title attribute to a localized time format like "September 4 1986 8:30 PM"
421+
// See http://momentjs.com/docs/#/displaying/format/
422+
titleFormat: 'LLL'
423+
})
418424
.config(function($httpProvider, AuthServiceProvider, RedirectLoginServiceProvider, AUTH_CFG, API_CFG, kubernetesContainerSocketProvider) {
419425
$httpProvider.interceptors.push('AuthInterceptor');
420426

@@ -440,14 +446,8 @@ angular
440446
LabelFilter.readPersistedState();
441447
});
442448
})
443-
.run(function(dateRelativeFilter, durationFilter, timeOnlyDurationFromTimestampsFilter) {
449+
.run(function(durationFilter, timeOnlyDurationFromTimestampsFilter) {
444450
// Use setInterval instead of $interval because we're directly manipulating the DOM and don't want scope.$apply overhead
445-
setInterval(function() {
446-
// Set by relative-timestamp directive.
447-
$('.timestamp[data-timestamp]').text(function(i, existing) {
448-
return dateRelativeFilter($(this).attr("data-timestamp"), $(this).attr("data-drop-suffix")) || existing;
449-
});
450-
}, 30 * 1000);
451451
setInterval(function() {
452452
// Set by duration-until-now directive.
453453
$('.duration[data-timestamp]').text(function(i, existing) {

app/scripts/directives/date.js

-10
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,6 @@
11
'use strict';
22

33
angular.module('openshiftConsole')
4-
.directive("relativeTimestamp", function() {
5-
return {
6-
restrict: 'E',
7-
scope: {
8-
timestamp: '=',
9-
dropSuffix: '=?'
10-
},
11-
template: '<span data-timestamp="{{timestamp}}" data-drop-suffix="{{dropSuffix}}" class="timestamp" title="{{timestamp | date : \'short\'}}">{{timestamp | dateRelative : dropSuffix}}</span>'
12-
};
13-
})
144
.directive("timeOnlyDurationUntilNow", function() {
155
return {
166
restrict: 'E',

app/scripts/filters/date.js

-9
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,6 @@
11
'use strict';
22

33
angular.module('openshiftConsole')
4-
.filter('dateRelative', function() {
5-
// dropSuffix will tell moment whether to include the "ago" text
6-
return function(timestamp, dropSuffix) {
7-
if (!timestamp) {
8-
return timestamp;
9-
}
10-
return moment(timestamp).fromNow(dropSuffix);
11-
};
12-
})
134
.filter('duration', function() {
145
return function(timestampLhs, timestampRhs, omitSingle, precision) {
156
if (!timestampLhs) {

app/views/_overview-deployment.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@
5050
</div>
5151

5252
<div class="component meta-data">
53-
<relative-timestamp timestamp="rc.metadata.creationTimestamp"></relative-timestamp
53+
<span am-time-ago="rc.metadata.creationTimestamp"></span
5454
><span ng-if="rc.causes.length"
5555
><span>
5656
<span class="deployment-trigger" ng-repeat="cause in rc.causes">
@@ -78,7 +78,7 @@
7878
</div>
7979
</div>
8080
<div class="component meta-data">
81-
created <relative-timestamp timestamp="rc.metadata.creationTimestamp"></relative-timestamp>
81+
created <span am-time-ago="rc.metadata.creationTimestamp"></span>
8282
</div>
8383
</div>
8484

app/views/_overview-monopod.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
</div>
1515

1616
<div class="component meta-data">
17-
created <relative-timestamp timestamp="pod.metadata.creationTimestamp"></relative-timestamp>
17+
created <span am-time-ago="pod.metadata.creationTimestamp"></span>
1818
</div>
1919

2020
</div>

app/views/_triggers.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
<status-icon status="build.status.phase"></status-icon>
2222
{{build.status.phase}}<span ng-if="(build | isIncompleteBuild) && trigger.imageChangeParams.automatic">. A new deployment will be created automatically once the build completes.</span>
2323
</div>
24-
<relative-timestamp timestamp="build.metadata.creationTimestamp" class="build-timestamp"></relative-timestamp>
24+
<span am-time-ago="build.metadata.creationTimestamp" class="build-timestamp"></span>
2525
<div ng-if="'builds/log' | canI : 'get'" class="build-links">
2626
<a ng-if="!!['New', 'Pending'].indexOf(build.status.phase) && (build | buildLogURL)" ng-href="{{build | buildLogURL}}">View Log</a>
2727
</div>

app/views/browse/_build-details.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ <h3>Status</h3>
1515
<dt>Started:</dt>
1616
<dd>
1717
<span ng-if="build.status.startTimestamp">
18-
<relative-timestamp timestamp="build.status.startTimestamp"></relative-timestamp>
18+
<span am-time-ago="build.status.startTimestamp"></span>
1919
<span><span class="text-muted">&ndash;</span> {{build.status.startTimestamp | date : 'medium'}}</span>
2020
</span>
2121
<span ng-if="!build.status.startTimestamp"><em>not started</em></span>

app/views/browse/build-config.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ <h1>
5454
</li>
5555
</ul>
5656
</div>
57-
<small class="meta" ng-if="buildConfig">created <relative-timestamp timestamp="buildConfig.metadata.creationTimestamp"></relative-timestamp></small>
57+
<small class="meta" ng-if="buildConfig">created <span am-time-ago="buildConfig.metadata.creationTimestamp"></span></small>
5858
</h1>
5959
<labels labels="buildConfig.metadata.labels" clickable="true" kind="builds" title-kind="build configs" project-name="{{buildConfig.metadata.namespace}}" limit="3"></labels>
6060
</div>
@@ -133,10 +133,10 @@ <h2>No builds.</h2>
133133
</div>
134134
<div class="latest-build-timestamp meta text-muted">
135135
<span ng-if="!latestBuild.status.startTimestamp">
136-
created <relative-timestamp timestamp="latestBuild.metadata.creationTimestamp"></relative-timestamp>
136+
created <span am-time-ago="latestBuild.metadata.creationTimestamp"></span>
137137
</span>
138138
<span ng-if="latestBuild.status.startTimestamp">
139-
started <relative-timestamp timestamp="latestBuild.status.startTimestamp"></relative-timestamp>
139+
started <span am-time-ago="latestBuild.status.startTimestamp"></span>
140140
</span>
141141
</div>
142142

@@ -175,7 +175,7 @@ <h2>No builds.</h2>
175175
</div>
176176
</td>
177177
<td data-title="Created">
178-
<relative-timestamp timestamp="build.metadata.creationTimestamp"></relative-timestamp>
178+
<span am-time-ago="build.metadata.creationTimestamp"></span>
179179
</td>
180180
</tr>
181181
</tbody>

app/views/browse/build.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ <h1>
1919
data-toggle="tooltip"
2020
data-original-title="Building from build configuration {{buildConfig.metadata.name}} has been paused.">
2121
</span>
22-
<small class="meta">created <relative-timestamp timestamp="build.metadata.creationTimestamp"></relative-timestamp></small>
22+
<small class="meta">created <span am-time-ago="build.metadata.creationTimestamp"></span></small>
2323
<div class="pull-right dropdown" ng-hide="!('builds' | canIDoAny)">
2424
<!-- Primary Actions -->
2525
<button class="btn btn-default hidden-xs"

app/views/browse/config-map.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ <h1>
4040
</ul>
4141
</div>
4242
{{configMap.metadata.name}}
43-
<small class="meta">created <relative-timestamp timestamp="configMap.metadata.creationTimestamp"></relative-timestamp></small>
43+
<small class="meta">created <span am-time-ago="configMap.metadata.creationTimestamp"></span></small>
4444
</h1>
4545
<labels labels="configMap.metadata.labels" clickable="true" kind="config-maps" title-kind="config maps" project-name="{{configMap.metadata.namespace}}" limit="3"></labels>
4646
</div>

app/views/browse/config-maps.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ <h1>Config Maps</h1>
4343
<a href="{{configMap | navigateResourceURL}}">{{configMap.metadata.name}}</a>
4444
</td>
4545
<td data-title="Created">
46-
<relative-timestamp timestamp="configMap.metadata.creationTimestamp"></relative-timestamp>
46+
<span am-time-ago="configMap.metadata.creationTimestamp"></span>
4747
</td>
4848
<td data-title="Labels">
4949
<em ng-if="(configMap.metadata.labels | hashSize) === 0">none</em>

app/views/browse/deployment-config.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,7 @@ <h1>
8585
</ul>
8686
</div>
8787
<!-- <span ng-if="deploymentConfig.status.details.message" class="pficon pficon-warning-triangle-o" style="cursor: help;" data-toggle="popover" data-trigger="hover" dynamic-content="{{deploymentConfig.status.details.message}}"></span> -->
88-
<small class="meta" ng-if="deploymentConfig">created <relative-timestamp timestamp="deploymentConfig.metadata.creationTimestamp"></relative-timestamp></small>
88+
<small class="meta" ng-if="deploymentConfig">created <span am-time-ago="deploymentConfig.metadata.creationTimestamp"></span></small>
8989
</h1>
9090
<labels labels="deploymentConfig.metadata.labels" clickable="true" kind="deployments" title-kind="deployment configs" project-name="{{deploymentConfig.metadata.namespace}}" limit="3"></labels>
9191
</div>
@@ -262,7 +262,7 @@ <h3>Triggers</h3>
262262
</div>
263263
</td>
264264
<td data-title="Created">
265-
<relative-timestamp timestamp="deployment.metadata.creationTimestamp"></relative-timestamp>
265+
<span am-time-ago="deployment.metadata.creationTimestamp"></span>
266266
</td>
267267
<td data-title="Trigger">
268268
<span ng-if="!deployment.causes.length">Unknown</span>

app/views/browse/deployment.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ <h1>
6464
</li>
6565
</ul>
6666
</div>
67-
<small class="meta" ng-if="deployment">created <relative-timestamp timestamp="deployment.metadata.creationTimestamp"></relative-timestamp></small>
67+
<small class="meta" ng-if="deployment">created <span am-time-ago="deployment.metadata.creationTimestamp"></span></small>
6868
</h1>
6969
<labels labels="deployment.metadata.labels" clickable="true" kind="deployments" project-name="{{deployment.metadata.namespace}}" limit="3"></labels>
7070
</div>
@@ -230,7 +230,7 @@ <h3>Replica Sets</h3>
230230
<span ng-if="replicaSet.status.replicas !== replicaSet.spec.replicas">{{replicaSet.status.replicas}}/</span>{{replicaSet.spec.replicas}} replica<span ng-if="replicaSet.spec.replicas != 1">s</span>
231231
</td>
232232
<td data-title="Created">
233-
<relative-timestamp timestamp="replicaSet.metadata.creationTimestamp"></relative-timestamp>
233+
<span am-time-ago="replicaSet.metadata.creationTimestamp"></span>
234234
</td>
235235
</tr>
236236
</tbody>

app/views/browse/imagestream.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ <h1>
3434
</li>
3535
</ul>
3636
</div>
37-
<small class="meta">created <relative-timestamp timestamp="imageStream.metadata.creationTimestamp"></relative-timestamp></small>
37+
<small class="meta">created <span am-time-ago="imageStream.metadata.creationTimestamp"></span></small>
3838
</h1>
3939
<labels labels="imageStream.metadata.labels" clickable="true" kind="images" project-name="{{imageStream.metadata.namespace}}" limit="3"></labels>
4040
</div>
@@ -110,7 +110,7 @@ <h1>
110110
</td>
111111
<td data-title="Created">
112112
<span ng-if="tag.status.items.length && tag.status.items[0].image">
113-
<relative-timestamp timestamp="tag.status.items[0].created"></relative-timestamp>
113+
<span am-time-ago="tag.status.items[0].created"></span>
114114
</span>
115115
</td>
116116
<td data-title="Pull Spec">
@@ -132,7 +132,7 @@ <h1>
132132
<short-id id="{{item.image | imageName}}"></short-id>
133133
</td>
134134
<td data-title="Created">
135-
<relative-timestamp timestamp="item.created"></relative-timestamp>
135+
<span am-time-ago="item.created"></span>
136136
</td>
137137
<td data-title="Pull Spec">
138138
<div ng-if="item.dockerImageReference" ng-attr-title="{{item.dockerImageReference}}" class="td-long-string">

app/views/browse/persistent-volume-claim.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ <h1>
1818
</span>
1919
<span ng-if="!pvc.spec.resources.requests['storage']">waiting for allocation,</span>
2020
</small>
21-
<small class="meta">created <relative-timestamp timestamp="pvc.metadata.creationTimestamp"></relative-timestamp></small>
21+
<small class="meta">created <span am-time-ago="pvc.metadata.creationTimestamp"></span></small>
2222
<div class="pull-right dropdown" ng-hide="!('persistentVolumeClaims' | canIDoAny)">
2323
<button type="button" class="dropdown-toggle btn btn-default actions-dropdown-btn hidden-xs" data-toggle="dropdown">
2424
Actions

app/views/browse/pod.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ <h1>
4242
<span ng-if="pod | isTroubledPod">
4343
<pod-warnings pod="pod"></pod-warnings>
4444
</span>
45-
<small class="meta">created <relative-timestamp timestamp="pod.metadata.creationTimestamp"></relative-timestamp></small>
45+
<small class="meta">created <span am-time-ago="pod.metadata.creationTimestamp"></span></small>
4646
</h1>
4747
<labels labels="pod.metadata.labels" clickable="true" kind="pods" project-name="{{pod.metadata.namespace}}" limit="3"></labels>
4848
</div>

app/views/browse/replica-set.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ <h1>
2222
aria-hidden="true">
2323
</span>
2424
<span ng-if="deploymentConfigMissing" class="sr-only">Warning: The deployment's deployment config is missing.</span>
25-
<small class="meta">created <relative-timestamp timestamp="replicaSet.metadata.creationTimestamp"></relative-timestamp></small>
25+
<small class="meta">created <span am-time-ago="replicaSet.metadata.creationTimestamp"></span></small>
2626

2727
<!-- Actions -->
2828
<ng-include ng-if="kind === 'ReplicaSet'"

app/views/browse/route.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ <h1>
1616
route="route"
1717
service="services[route.spec.to.name]">
1818
</route-warnings>
19-
<small class="meta">created <relative-timestamp timestamp="route.metadata.creationTimestamp"></relative-timestamp></small>
19+
<small class="meta">created <span am-time-ago="route.metadata.creationTimestamp"></span></small>
2020
<div class="pull-right dropdown" ng-hide="!('routes' | canIDoAny)">
2121
<button type="button" class="dropdown-toggle btn btn-default actions-dropdown-btn hidden-xs" data-toggle="dropdown">
2222
Actions
@@ -73,10 +73,10 @@ <h1>
7373
<span ng-init="admittedCondition = (ingress | routeIngressCondition : 'Admitted')">
7474
<span ng-if="!admittedCondition">admission status unknown for router '{{ingress.routerName}}'</span>
7575
<span ng-if="admittedCondition.status === 'True'">
76-
exposed on router '{{ingress.routerName}}' <relative-timestamp timestamp="admittedCondition.lastTransitionTime"></relative-timestamp>
76+
exposed on router '{{ingress.routerName}}' <span am-time-ago="admittedCondition.lastTransitionTime"></span>
7777
</span>
7878
<span ng-if="admittedCondition.status === 'False'">
79-
rejected by router '{{ingress.routerName}}' <relative-timestamp timestamp="admittedCondition.lastTransitionTime"></relative-timestamp>
79+
rejected by router '{{ingress.routerName}}' <span am-time-ago="admittedCondition.lastTransitionTime"></span>
8080
</span>
8181
</span>
8282
</div>

app/views/browse/secret.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ <h1>
3333
</ul>
3434
</div>
3535
{{secret.metadata.name}}
36-
<small class="meta">created <relative-timestamp timestamp="secret.metadata.creationTimestamp"></relative-timestamp></small>
36+
<small class="meta">created <span am-time-ago="secret.metadata.creationTimestamp"></span></small>
3737
</h1>
3838
</div>
3939
</div>

app/views/browse/service.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ <h1>
3838
</li>
3939
</ul>
4040
</div>
41-
<small class="meta">created <relative-timestamp timestamp="service.metadata.creationTimestamp"></relative-timestamp></small>
41+
<small class="meta">created <span am-time-ago="service.metadata.creationTimestamp"></span></small>
4242
</h1>
4343
<labels labels="service.metadata.labels" clickable="true" kind="services" project-name="{{service.metadata.namespace}}" limit="3"></labels>
4444
</div>

app/views/builds.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,7 @@ <h1>Builds</h1>
7878
</div>
7979
</td>
8080
<td data-title="Created">
81-
<relative-timestamp timestamp="latestBuild.metadata.creationTimestamp"></relative-timestamp>
81+
<span am-time-ago="latestBuild.metadata.creationTimestamp"></span>
8282
</td>
8383
<td data-title="Type">{{latestBuild.spec.strategy.type | startCase}}</td>
8484
<td data-title="Source" class="word-break-all">

0 commit comments

Comments
 (0)