From e62ca4ea4fc235d7ec767034a80889b2fa331e97 Mon Sep 17 00:00:00 2001 From: Vincent Petry Date: Mon, 28 Oct 2013 11:22:34 +0100 Subject: [PATCH] Append file etag to preview URLs Fixes #5534 --- apps/files/ajax/newfile.php | 3 +- apps/files/ajax/upload.php | 2 + apps/files/js/file-upload.js | 9 ++-- apps/files/js/filelist.js | 10 ++-- apps/files/js/files.js | 82 ++++++++++++++++++++---------- apps/files/lib/helper.php | 2 +- apps/files/templates/part.list.php | 1 + apps/files_sharing/public.php | 2 +- core/js/oc-dialogs.js | 6 +-- lib/private/helper.php | 4 +- 10 files changed, 76 insertions(+), 45 deletions(-) diff --git a/apps/files/ajax/newfile.php b/apps/files/ajax/newfile.php index eed0047fc8..9d9a81ae3d 100644 --- a/apps/files/ajax/newfile.php +++ b/apps/files/ajax/newfile.php @@ -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(); } diff --git a/apps/files/ajax/upload.php b/apps/files/ajax/upload.php index 38c2a053a9..0e905f993a 100644 --- a/apps/files/ajax/upload.php +++ b/apps/files/ajax/upload.php @@ -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, diff --git a/apps/files/js/file-upload.js b/apps/files/js/file-upload.js index 5bf4f5c098..af67a0e200 100644 --- a/apps/files/js/file-upload.js +++ b/apps/files/js/file-upload.js @@ -566,11 +566,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')); @@ -632,9 +633,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) { diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index c33a06bbdc..b05f42a79a 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -326,9 +326,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) { @@ -863,7 +863,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) { @@ -873,9 +873,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); } } }); diff --git a/apps/files/js/files.js b/apps/files/js/files.js index 389bf1bf19..ee0fdcb43a 100644 --- a/apps/files/js/files.js +++ b/apps/files/js/files.js @@ -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); } }); @@ -626,26 +637,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 +668,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; }); } diff --git a/apps/files/lib/helper.php b/apps/files/lib/helper.php index 709d78a4d4..7692dd6757 100644 --- a/apps/files/lib/helper.php +++ b/apps/files/lib/helper.php @@ -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']); } diff --git a/apps/files/templates/part.list.php b/apps/files/templates/part.list.php index a6d2e44f34..2f630e1f01 100644 --- a/apps/files/templates/part.list.php +++ b/apps/files/templates/part.list.php @@ -16,6 +16,7 @@ $totalsize = 0; ?> data-type="" data-mime="" data-size="" + data-etag="" data-permissions=""> 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)); } /**