Add thumbnails to framework apps

This commit is contained in:
yflory
2017-10-26 12:31:16 +02:00
parent bf817f20ee
commit 6f020b67ca
9 changed files with 116 additions and 32 deletions

View File

@@ -58,13 +58,15 @@ min-height: auto;
}
.cp-app-drive-element-name {
width: 100%;
height: 48px;
margin: 8px 0;
height: 24px;
margin: 0;
display: inline-block;
font-size: 14px;
//align-items: center;
//justify-content: center;
overflow: hidden;
//text-overflow: ellipsis;
white-space: nowrap;
text-overflow: ellipsis;
word-wrap: break-word;
}
.cp-app-drive-element-truncated {
@@ -83,8 +85,8 @@ min-height: auto;
.fa {
display: block;
margin: auto;
font-size: 48px;
margin: 8px 0;
font-size: 64px;
margin: 18px 0;
text-align: center;
&.listonly {
display: none;
@@ -518,10 +520,15 @@ span {
}
}
.cp-app-drive-element-thumbnail {
max-width: 64px;
max-height: 64px;
max-width: 100px;
max-height: 100px;
& ~ .fa {
display: none;
display: inline;
font-size: 17px;
position: absolute;
top: 3px;
left: 3px;
margin: 0;
}
}
}

View File

@@ -1145,6 +1145,10 @@ define([
if (!data) { return void logError("No data for the file", element); }
var hrefData = Cryptpad.parsePadUrl(data.href);
if (hrefData.type) {
$span.addClass('cp-border-color-'+hrefData.type);
}
var $state = $('<span>', {'class': 'cp-app-drive-element-state'});
if (hrefData.hashData && hrefData.hashData.mode === 'view') {
var $ro = $readonlyIcon.clone().appendTo($state);
@@ -1161,6 +1165,7 @@ define([
var $name = $('<span>', {'class': 'cp-app-drive-element-name'}).text(name);
$span.append($name);
$span.append($state);
$span.attr('title', name);
var type = Messages.type[hrefData.type] || hrefData.type;
common.displayThumbnail(data.href, $span, function ($thumb) {
@@ -1199,6 +1204,7 @@ define([
var $files = $('<span>', {
'class': 'cp-app-drive-element-files cp-app-drive-element-list'
}).text(files);
$span.attr('title', key);
$span.append($name).append($state).append($subfolders).append($files);
};
@@ -2197,7 +2203,7 @@ define([
}
$content.append($info).append($dirContent);
var $truncated = $('<span>', {'class': 'cp-app-drive-element-truncated'}).text('...');
/*var $truncated = $('<span>', {'class': 'cp-app-drive-element-truncated'}).text('...');
$content.find('.cp-app-drive-element').each(function (idx, el) {
var $name = $(el).find('.cp-app-drive-element-name');
if ($name.length === 0) { return; }
@@ -2206,7 +2212,7 @@ define([
$tr.attr('title', $name.text());
$(el).append($tr);
}
});
});*/
$content.scrollTop(s);
appStatus.ready(true);