Merge pull request #5582 from owncloud/files-previewcaching

Append file etag to preview URLs
This commit is contained in:
Thomas Müller 2013-11-05 01:21:51 -08:00
commit 3488202f67
11 changed files with 81 additions and 48 deletions

View File

@ -89,7 +89,7 @@ if($source) {
$meta = \OC\Files\Filesystem::getFileInfo($target);
$mime=$meta['mimetype'];
$id = $meta['fileid'];
$eventSource->send('success', array('mime'=>$mime, 'size'=>\OC\Files\Filesystem::filesize($target), 'id' => $id));
$eventSource->send('success', array('mime'=>$mime, 'size'=>\OC\Files\Filesystem::filesize($target), 'id' => $id, 'etag' => $meta['etag']));
} else {
$eventSource->send('error', $l10n->t('Error while downloading %s to %s', array($source, $target)));
}
@ -119,6 +119,7 @@ if($source) {
'mime' => $mime,
'size' => $size,
'content' => $content,
'etag' => $meta['etag'],
)));
exit();
}

View File

@ -132,6 +132,7 @@ if (strpos($dir, '..') === false) {
'size' => $meta['size'],
'id' => $meta['fileid'],
'name' => basename($target),
'etag' => $meta['etag'],
'originalname' => $files['tmp_name'][$i],
'uploadMaxFilesize' => $maxUploadFileSize,
'maxHumanFilesize' => $maxHumanFileSize,
@ -158,6 +159,7 @@ if (strpos($dir, '..') === false) {
'size' => $meta['size'],
'id' => $meta['fileid'],
'name' => basename($target),
'etag' => $meta['etag'],
'originalname' => $files['tmp_name'][$i],
'uploadMaxFilesize' => $maxUploadFileSize,
'maxHumanFilesize' => $maxHumanFileSize,

View File

@ -320,8 +320,9 @@ table.dragshadow {
width:auto;
}
table.dragshadow td.filename {
padding-left:36px;
padding-left:60px;
padding-right:16px;
height: 36px;
}
table.dragshadow td.size {
padding-right:8px;

View File

@ -575,11 +575,12 @@ $(document).ready(function() {
tr.attr('data-size', result.data.size);
tr.attr('data-mime', result.data.mime);
tr.attr('data-id', result.data.id);
tr.attr('data-etag', result.data.etag);
tr.find('.filesize').text(humanFileSize(result.data.size));
var path = getPathForPreview(name);
lazyLoadPreview(path, result.data.mime, function(previewpath) {
Files.lazyLoadPreview(path, result.data.mime, function(previewpath) {
tr.find('td.filename').attr('style','background-image:url('+previewpath+')');
});
}, null, null, result.data.etag);
FileActions.display(tr.find('td.filename'), true);
} else {
OC.dialogs.alert(result.data.message, t('core', 'Could not create file'));
@ -641,9 +642,9 @@ $(document).ready(function() {
tr.data('mime', mime).data('id', id);
tr.attr('data-id', id);
var path = $('#dir').val()+'/'+localName;
lazyLoadPreview(path, mime, function(previewpath) {
Files.lazyLoadPreview(path, mime, function(previewpath) {
tr.find('td.filename').attr('style', 'background-image:url('+previewpath+')');
});
}, null, null, data.etag);
FileActions.display(tr.find('td.filename'), true);
});
eventSource.listen('error',function(error) {

View File

@ -329,9 +329,9 @@ var FileList={
tr.attr('data-id', id);
}
var path = getPathForPreview(name);
lazyLoadPreview(path, mime, function(previewpath) {
Files.lazyLoadPreview(path, mime, function(previewpath) {
tr.find('td.filename').attr('style','background-image:url('+previewpath+')');
});
}, null, null, tr.attr('data-etag'));
tr.find('td.filename').draggable(dragOptions);
},
isLoading:function(name) {
@ -867,7 +867,7 @@ $(document).ready(function() {
data.context = FileList.addFile(file.name, file.size, date, false, false, param);
// update file data
data.context.attr('data-mime',file.mime).attr('data-id',file.id);
data.context.attr('data-mime',file.mime).attr('data-id',file.id).attr('data-etag', file.etag);
var permissions = data.context.data('permissions');
if (permissions !== file.permissions) {
@ -877,9 +877,9 @@ $(document).ready(function() {
FileActions.display(data.context.find('td.filename'), true);
var path = getPathForPreview(file.name);
lazyLoadPreview(path, file.mime, function(previewpath) {
Files.lazyLoadPreview(path, file.mime, function(previewpath) {
data.context.find('td.filename').attr('style','background-image:url('+previewpath+')');
});
}, null, null, file.etag);
}
}
});

View File

@ -20,6 +20,17 @@ Files={
}
},
/**
* Fix path name by removing double slash at the beginning, if any
*/
fixPath: function(fileName) {
if (fileName.substr(0, 2) == '//') {
return fileName.substr(1);
}
return fileName;
},
isFileNameValid:function (name) {
if (name === '.') {
throw t('files', '\'.\' is an invalid file name.');
@ -457,9 +468,9 @@ var createDragShadow = function(event) {
newtr.find('td.filename').attr('style','background-image:url('+OC.imagePath('core', 'filetypes/folder.png')+')');
} else {
var path = getPathForPreview(elem.name);
lazyLoadPreview(path, elem.mime, function(previewpath) {
Files.lazyLoadPreview(path, elem.mime, function(previewpath) {
newtr.find('td.filename').attr('style','background-image:url('+previewpath+')');
});
}, null, null, elem.etag);
}
});
@ -469,7 +480,7 @@ var createDragShadow = function(event) {
//options for file drag/drop
var dragOptions={
revert: 'invalid', revertDuration: 300,
opacity: 0.7, zIndex: 100, appendTo: 'body', cursorAt: { left: -5, top: -5 },
opacity: 0.7, zIndex: 100, appendTo: 'body', cursorAt: { left: 24, top: 18 },
helper: createDragShadow, cursor: 'move',
stop: function(event, ui) {
$('#fileList tr td.filename').addClass('ui-draggable');
@ -615,7 +626,8 @@ function getSelectedFilesTrash(property) {
name:$(element).attr('data-file'),
mime:$(element).data('mime'),
type:$(element).data('type'),
size:$(element).data('size')
size:$(element).data('size'),
etag:$(element).data('etag')
};
if (property) {
files.push(file[property]);
@ -626,26 +638,28 @@ function getSelectedFilesTrash(property) {
return files;
}
function getMimeIcon(mime, ready) {
if (getMimeIcon.cache[mime]) {
ready(getMimeIcon.cache[mime]);
Files.getMimeIcon = function(mime, ready) {
if (Files.getMimeIcon.cache[mime]) {
ready(Files.getMimeIcon.cache[mime]);
} else {
$.get( OC.filePath('files','ajax','mimeicon.php'), {mime: mime}, function(path) {
getMimeIcon.cache[mime]=path;
ready(getMimeIcon.cache[mime]);
Files.getMimeIcon.cache[mime]=path;
ready(Files.getMimeIcon.cache[mime]);
});
}
}
getMimeIcon.cache={};
Files.getMimeIcon.cache={};
function getPathForPreview(name) {
var path = $('#dir').val() + '/' + name;
return path;
}
function lazyLoadPreview(path, mime, ready, width, height) {
Files.lazyLoadPreview = function(path, mime, ready, width, height, etag) {
// get mime icon url
getMimeIcon(mime, function(iconURL) {
Files.getMimeIcon(mime, function(iconURL) {
var urlSpec = {};
var previewURL;
ready(iconURL); // set mimeicon URL
// now try getting a preview thumbnail URL
@ -655,25 +669,38 @@ function lazyLoadPreview(path, mime, ready, width, height) {
if ( ! height ) {
height = $('#filestable').data('preview-y');
}
if ( $('#publicUploadButtonMock').length ) {
var previewURL = OC.Router.generate('core_ajax_public_preview', {file: path, x:width, y:height, t:$('#dirToken').val()});
} else {
var previewURL = OC.Router.generate('core_ajax_preview', {file: path, x:width, y:height});
}
$.get(previewURL, function() {
previewURL = previewURL.replace('(', '%28');
previewURL = previewURL.replace(')', '%29');
previewURL += '&reload=true';
// note: the order of arguments must match the one
// from the server's template so that the browser
// knows it's the same file for caching
urlSpec.x = width;
urlSpec.y = height;
urlSpec.file = Files.fixPath(path);
// preload image to prevent delay
// this will make the browser cache the image
var img = new Image();
img.onload = function(){
//set preview thumbnail URL
ready(previewURL);
}
img.src = previewURL;
});
if (etag){
// use etag as cache buster
urlSpec.c = etag;
}
else {
console.warn('Files.lazyLoadPreview(): missing etag argument');
}
if ( $('#publicUploadButtonMock').length ) {
urlSpec.t = $('#dirToken').val();
previewURL = OC.Router.generate('core_ajax_public_preview', urlSpec);
} else {
previewURL = OC.Router.generate('core_ajax_preview', urlSpec);
}
previewURL = previewURL.replace('(', '%28');
previewURL = previewURL.replace(')', '%29');
// preload image to prevent delay
// this will make the browser cache the image
var img = new Image();
img.onload = function(){
//set preview thumbnail URL
ready(previewURL);
}
img.src = previewURL;
});
}

View File

@ -40,7 +40,7 @@ class Helper
if($file['isPreviewAvailable']) {
$pathForPreview = $file['directory'] . '/' . $file['name'];
return \OC_Helper::previewIcon($pathForPreview);
return \OC_Helper::previewIcon($pathForPreview) . '&c=' . $file['etag'];
}
return \OC_Helper::mimetypeIcon($file['mimetype']);
}

View File

@ -16,6 +16,7 @@ $totalsize = 0; ?>
data-type="<?php ($file['type'] == 'dir')?p('dir'):p('file')?>"
data-mime="<?php p($file['mimetype'])?>"
data-size="<?php p($file['size']);?>"
data-etag="<?php p($file['etag']);?>"
data-permissions="<?php p($file['permissions']); ?>">
<?php if($file['isPreviewAvailable']): ?>
<td class="filename svg preview-icon"

View File

@ -28,7 +28,7 @@ function determineIcon($file, $sharingRoot, $sharingToken) {
$relativePath = substr($file['path'], 6);
$relativePath = substr($relativePath, strlen($sharingRoot));
if($file['isPreviewAvailable']) {
return OCP\publicPreview_icon($relativePath, $sharingToken);
return OCP\publicPreview_icon($relativePath, $sharingToken) . '&c=' . $file['etag'];
}
return OCP\mimetype_icon($file['mimetype']);
}

View File

@ -294,14 +294,14 @@ var OCdialogs = {
conflict.find('.replacement .mtime').text(formatDate(replacement.lastModifiedDate));
}
var path = getPathForPreview(original.name);
lazyLoadPreview(path, original.mime, function(previewpath){
Files.lazyLoadPreview(path, original.mime, function(previewpath){
conflict.find('.original .icon').css('background-image','url('+previewpath+')');
}, 96, 96);
}, 96, 96, original.etag);
getCroppedPreview(replacement).then(
function(path){
conflict.find('.replacement .icon').css('background-image','url(' + path + ')');
}, function(){
getMimeIcon(replacement.type,function(path){
Files.getMimeIcon(replacement.type,function(path){
conflict.find('.replacement .icon').css('background-image','url(' + path + ')');
});
}

View File

@ -231,11 +231,11 @@ class OC_Helper {
* Returns the path to the preview of the file.
*/
public static function previewIcon($path) {
return self::linkToRoute( 'core_ajax_preview', array('x' => 36, 'y' => 36, 'file' => urlencode($path) ));
return self::linkToRoute( 'core_ajax_preview', array('x' => 36, 'y' => 36, 'file' => $path ));
}
public static function publicPreviewIcon( $path, $token ) {
return self::linkToRoute( 'core_ajax_public_preview', array('x' => 36, 'y' => 36, 'file' => urlencode($path), 't' => $token));
return self::linkToRoute( 'core_ajax_public_preview', array('x' => 36, 'y' => 36, 'file' => $path, 't' => $token));
}
/**