Merge pull request #1215 from nextcloud/issue-1083-update-live-relative-timestamps

Update relative timestamps for a better "live" feeling
This commit is contained in:
Roeland Jago Douma 2016-09-01 14:13:23 +02:00 committed by GitHub
commit ca7b60ba81
5 changed files with 13 additions and 3 deletions

Binary file not shown.

View file

@ -1202,8 +1202,9 @@
}
td = $('<td></td>').attr({ "class": "date" });
td.append($('<span></span>').attr({
"class": "modified",
"class": "modified live-relative-timestamp",
"title": formatted,
"data-timestamp": mtime,
"style": 'color:rgb('+modifiedColor+','+modifiedColor+','+modifiedColor+')'
}).text(text)
.tooltip({placement: 'top'})

View file

@ -24,7 +24,7 @@
' class="action action-favorite favorite">' +
' <img class="svg" alt="{{starAltText}}" src="{{starIcon}}" />' +
' </a>' +
' {{#if hasSize}}<span class="size" title="{{altSize}}">{{size}}</span>, {{/if}}<span class="date" title="{{altDate}}">{{date}}</span>' +
' {{#if hasSize}}<span class="size" title="{{altSize}}">{{size}}</span>, {{/if}}<span class="date live-relative-timestamp" data-timestamp="{{timestamp}}" title="{{altDate}}">{{date}}</span>' +
' </div>' +
'</div>' +
'<div class="hidden permalink-field">' +
@ -152,6 +152,7 @@
altSize: n('files', '%n byte', '%n bytes', this.model.get('size')),
dateLabel: t('files', 'Modified'),
altDate: OC.Util.formatDate(this.model.get('mtime')),
timestamp: this.model.get('mtime'),
date: OC.Util.relativeModifiedDate(this.model.get('mtime')),
starAltText: isFavorite ? t('files', 'Favorited') : t('files', 'Favorite'),
starIcon: OC.imagePath('core', isFavorite ? 'actions/starred' : 'actions/star'),

View file

@ -15,7 +15,7 @@
'<li data-revision="{{timestamp}}">' +
'<img class="preview" src="{{previewUrl}}"/>' +
'<a href="{{downloadUrl}}" class="downloadVersion"><img src="{{downloadIconUrl}}" />' +
'<span class="versiondate has-tooltip" title="{{formattedTimestamp}}">{{relativeTimestamp}}</span>' +
'<span class="versiondate has-tooltip live-relative-timestamp" data-timestamp="{{millisecondsTimestamp}}" title="{{formattedTimestamp}}">{{relativeTimestamp}}</span>' +
'</a>' +
'{{#canRevert}}' +
'<a href="#" class="revertVersion" title="{{revertLabel}}"><img src="{{revertIconUrl}}" /></a>' +
@ -183,6 +183,7 @@
_formatItem: function(version) {
var timestamp = version.get('timestamp') * 1000;
return _.extend({
millisecondsTimestamp: timestamp,
formattedTimestamp: OC.Util.formatDate(timestamp),
relativeTimestamp: OC.Util.relativeModifiedDate(timestamp),
downloadUrl: version.getDownloadUrl(),

View file

@ -1660,6 +1660,13 @@ function initCore() {
$('body').delegate('#app-content', 'apprendered appresized', adjustControlsWidth);
}
// Update live timestamps every 30 seconds
setInterval(function() {
$('.live-relative-timestamp').each(function() {
$(this).text(OC.Util.relativeModifiedDate(parseInt($(this).attr('data-timestamp'), 10)));
});
}, 30 * 1000);
}
$(document).ready(initCore);