Commit f8ed8fbe authored by Michael Jobst's avatar Michael Jobst Committed by Vincent Petry
Browse files

Display changes in file versions tab view and detailsView (#26511)

* Display changes in file versions tab view and detailsView

* versions tab enhancements

enhanced js test file
removed css superscript attribute for version size

* Replaced spaces with tabs
parent 1390c414
......@@ -98,10 +98,18 @@
#app-sidebar .file-details {
color: #999;
}
#app-sidebar .file-details img {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
opacity: .5;
}
#app-sidebar .file-details img:hover,
#app-sidebar .file-details img:focus{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
opacity: 1;
}
#app-sidebar .action-favorite {
vertical-align: text-bottom;
padding: 10px;
......
.versionsTabView .clear-float {
clear: both;
}
.versionsTabView li {
width: 100%;
cursor: default;
......@@ -12,25 +13,30 @@
border-bottom: none;
}
.versionsTabView li > * {
.versionsTabView a,
.versionsTabView div > span {
vertical-align: middle;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: .5;
}
.versionsTabView li > a,
.versionsTabView li > span {
.versionsTabView li a{
padding: 15px 10px 11px;
}
.versionsTabView li > *:hover,
.versionsTabView li > *:focus {
.versionsTabView a:hover,
.versionsTabView a:focus {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}
.versionsTabView .preview-container {
display: inline-block;
vertical-align: top;
}
.versionsTabView img {
cursor: pointer;
padding-right: 4px;
......@@ -38,7 +44,10 @@
.versionsTabView img.preview {
cursor: default;
opacity: 1;
}
.versionsTabView .version-container {
display: inline-block;
}
.versionsTabView .versiondate {
......@@ -46,6 +55,14 @@
vertical-align: super;
}
.versionsTabView .version-details {
text-align: left;
}
.versionsTabView .version-details > span {
padding: 0 10px;
}
.versionsTabView .revertVersion {
cursor: pointer;
float: right;
......
......@@ -11,13 +11,26 @@
(function() {
var TEMPLATE_ITEM =
'<li data-revision="{{timestamp}}">' +
'<div>' +
'<div class="preview-container">' +
'<img class="preview" src="{{previewUrl}}"/>' +
'</div>' +
'<div class="version-container">' +
'<div>' +
'<a href="{{downloadUrl}}" class="downloadVersion"><img src="{{downloadIconUrl}}" />' +
'<span class="versiondate has-tooltip" title="{{formattedTimestamp}}">{{relativeTimestamp}}</span>' +
'</a>' +
'</div>' +
'{{#hasDetails}}' +
'<div class="version-details">' +
'<span class="size has-tooltip" title="{{altSize}}">{{humanReadableSize}}</span>' +
'</div>' +
'{{/hasDetails}}' +
'</div>' +
'{{#canRevert}}' +
'<a href="#" class="revertVersion" title="{{revertLabel}}"><img src="{{revertIconUrl}}" /></a>' +
'{{/canRevert}}' +
'</div>' +
'</li>';
var TEMPLATE =
......@@ -180,9 +193,13 @@
_formatItem: function(version) {
var timestamp = version.get('timestamp') * 1000;
var size = version.has('size') ? version.get('size') : 0;
return _.extend({
formattedTimestamp: OC.Util.formatDate(timestamp),
relativeTimestamp: OC.Util.relativeModifiedDate(timestamp),
humanReadableSize: OC.Util.humanFileSize(size, true),
altSize: n('files', '%n byte', '%n bytes', size),
hasDetails: version.has('size'),
downloadUrl: version.getDownloadUrl(),
downloadIconUrl: OC.imagePath('core', 'actions/download'),
revertIconUrl: OC.imagePath('core', 'actions/history'),
......
......@@ -78,12 +78,14 @@ describe('OCA.Versions.VersionsTabView', function() {
var $item = $versions.eq(0);
expect($item.find('.downloadVersion').attr('href')).toEqual(version1.getDownloadUrl());
expect($item.find('.versiondate').text()).toEqual('seconds ago');
expect($item.find('.size').text()).toEqual('< 1 KB');
expect($item.find('.revertVersion').length).toEqual(1);
expect($item.find('.preview').attr('src')).toEqual(version1.getPreviewUrl());
$item = $versions.eq(1);
expect($item.find('.downloadVersion').attr('href')).toEqual(version2.getDownloadUrl());
expect($item.find('.versiondate').text()).toEqual('2 days ago');
expect($item.find('.size').text()).toEqual('< 1 KB');
expect($item.find('.revertVersion').length).toEqual(1);
expect($item.find('.preview').attr('src')).toEqual(version2.getPreviewUrl());
});
......@@ -231,4 +233,3 @@ describe('OCA.Versions.VersionsTabView', function() {
});
});
});
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment