diff --git a/apps/files_versions/js/versioncollection.js b/apps/files_versions/js/versioncollection.js index fdb12bae0a..24a4ba7fc6 100644 --- a/apps/files_versions/js/versioncollection.js +++ b/apps/files_versions/js/versioncollection.js @@ -81,7 +81,8 @@ name: version.name, fullPath: fullPath, timestamp: revision, - size: version.size + size: version.size, + mimetype: version.mimetype }; }); this._endReached = result.data.endReached; diff --git a/apps/files_versions/js/versionstabview.js b/apps/files_versions/js/versionstabview.js index 35abde6d34..a91366fd40 100644 --- a/apps/files_versions/js/versionstabview.js +++ b/apps/files_versions/js/versionstabview.js @@ -15,7 +15,7 @@ '
  • ' + '
    ' + '
    ' + - '' + + '' + '
    ' + '
    ' + '
    ' + @@ -162,6 +162,15 @@ _onAddModel: function(model) { var $el = $(this.itemTemplate(this._formatItem(model))); this.$versionsContainer.append($el); + + var preview = $el.find('.preview')[0]; + this._lazyLoadPreview({ + url: model.getPreviewUrl(), + mime: model.get('mimetype'), + callback: function(url) { + preview.src = url; + } + }); $el.find('.has-tooltip').tooltip(); }, @@ -206,7 +215,6 @@ downloadUrl: version.getDownloadUrl(), downloadIconUrl: OC.imagePath('core', 'actions/download'), revertIconUrl: OC.imagePath('core', 'actions/history'), - previewUrl: version.getPreviewUrl(), revertLabel: t('files_versions', 'Restore'), canRevert: (this.collection.getFileInfo().get('permissions') & OC.PERMISSION_UPDATE) !== 0 }, version.attributes); @@ -235,6 +243,38 @@ return false; } return !fileInfo.isDirectory(); + }, + + /** + * Lazy load a file's preview. + * + * @param path path of the file + * @param mime mime type + * @param callback callback function to call when the image was loaded + * @param etag file etag (for caching) + */ + _lazyLoadPreview : function(options) { + var url = options.url; + var mime = options.mime; + var ready = options.callback; + + // get mime icon url + var iconURL = OC.MimeType.getIconUrl(mime); + ready(iconURL); // set mimeicon URL + + var img = new Image(); + img.onload = function(){ + // if loading the preview image failed (no preview for the mimetype) then img.width will < 5 + if (img.width > 5) { + ready(url, img); + } else if (options.error) { + options.error(); + } + }; + if (options.error) { + img.onerror = options.error; + } + img.src = url; } }); diff --git a/apps/files_versions/lib/Storage.php b/apps/files_versions/lib/Storage.php index e7c2c8b759..1aa19274c4 100644 --- a/apps/files_versions/lib/Storage.php +++ b/apps/files_versions/lib/Storage.php @@ -467,6 +467,7 @@ class Storage { $versions[$key]['path'] = Filesystem::normalizePath($pathinfo['dirname'] . '/' . $filename); $versions[$key]['name'] = $versionedFile; $versions[$key]['size'] = $view->filesize($dir . '/' . $entryName); + $versions[$key]['mimetype'] = \OC::$server->getMimeTypeDetector()->detectPath($versionedFile); } } } diff --git a/apps/files_versions/tests/js/versionstabviewSpec.js b/apps/files_versions/tests/js/versionstabviewSpec.js index 9b788db197..cadd4eb363 100644 --- a/apps/files_versions/tests/js/versionstabviewSpec.js +++ b/apps/files_versions/tests/js/versionstabviewSpec.js @@ -24,14 +24,16 @@ describe('OCA.Versions.VersionsTabView', function() { timestamp: time1, name: 'some file.txt', size: 140, - fullPath: '/subdir/some file.txt' + fullPath: '/subdir/some file.txt', + mimetype: 'text/plain' }); var version2 = new VersionModel({ id: time2, timestamp: time2, name: 'some file.txt', size: 150, - fullPath: '/subdir/some file.txt' + fullPath: '/subdir/some file.txt', + mimetype: 'text/plain' }); testVersions = [version1, version2]; @@ -80,14 +82,14 @@ describe('OCA.Versions.VersionsTabView', function() { 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()); + expect($item.find('.preview').attr('src')).toEqual('http://localhost/core/img/filetypes/text.svg'); $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()); + expect($item.find('.preview').attr('src')).toEqual('http://localhost/core/img/filetypes/text.svg'); }); it('does not render revert button when no update permissions', function() { @@ -104,13 +106,13 @@ describe('OCA.Versions.VersionsTabView', function() { expect($item.find('.downloadVersion').attr('href')).toEqual(version1.getDownloadUrl()); expect($item.find('.versiondate').text()).toEqual('seconds ago'); expect($item.find('.revertVersion').length).toEqual(0); - expect($item.find('.preview').attr('src')).toEqual(version1.getPreviewUrl()); + expect($item.find('.preview').attr('src')).toEqual('http://localhost/core/img/filetypes/text.svg'); $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('.revertVersion').length).toEqual(0); - expect($item.find('.preview').attr('src')).toEqual(version2.getPreviewUrl()); + expect($item.find('.preview').attr('src')).toEqual('http://localhost/core/img/filetypes/text.svg'); }); }); @@ -156,7 +158,8 @@ describe('OCA.Versions.VersionsTabView', function() { timestamp: time3, name: 'some file.txt', size: 54, - fullPath: '/subdir/some file.txt' + fullPath: '/subdir/some file.txt', + mimetype: 'text/plain' }); tabView.collection.add(version3); @@ -167,7 +170,7 @@ describe('OCA.Versions.VersionsTabView', function() { expect($item.find('.downloadVersion').attr('href')).toEqual(version3.getDownloadUrl()); expect($item.find('.versiondate').text()).toEqual('7 days ago'); expect($item.find('.revertVersion').length).toEqual(1); - expect($item.find('.preview').attr('src')).toEqual(version3.getPreviewUrl()); + expect($item.find('.preview').attr('src')).toEqual('http://localhost/core/img/filetypes/text.svg'); }); });