diff --git a/apps/files/js/breadcrumb.js b/apps/files/js/breadcrumb.js
index ff017a22bb5350f4c658c02481f8a285237fabf5..5bc2fac13695d29940872c4dfa6e76931035e923 100644
--- a/apps/files/js/breadcrumb.js
+++ b/apps/files/js/breadcrumb.js
@@ -20,7 +20,6 @@
*/
/* global OC */
-/* global SVGSupport, replaceSVG */
(function() {
/**
* Creates an breadcrumb element in the given container
@@ -104,8 +103,8 @@
$crumb.addClass('last');
// in case svg is not supported by the browser we need to execute the fallback mechanism
- if (!SVGSupport()) {
- replaceSVG();
+ if (!OC.Util.hasSVGSupport()) {
+ OC.Util.replaceSVG(this.$el);
}
// setup drag and drop
diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 509929d0e5534ed1f69c8fa82fa7826535d50884..506741eb6eabee9d6498d3f9a15596d12591b55d 100644
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -9,7 +9,7 @@
*/
/* global OC, t, n, FileList, FileActions, Files, BreadCrumb */
-/* global procesSelection, dragOptions, SVGSupport */
+/* global procesSelection, dragOptions */
window.FileList = {
appName: t('files', 'Files'),
isEmpty: true,
@@ -159,22 +159,6 @@ window.FileList = {
this.$fileList.trigger(jQuery.Event("updated"));
},
- /**
- * If SVG is not supported, replaces the given images's extension
- * from ".svg" to ".png".
- * If SVG is supported, return the image path as is.
- * @param icon image path
- * @return fixed image path
- */
- _replaceSVG: function(icon) {
- if (!SVGSupport()) {
- var i = icon.lastIndexOf('.svg');
- if (i >= 0) {
- icon = icon.substr(0, i) + '.png' + icon.substr(i+4);
- }
- }
- return icon;
- },
/**
* Creates a new table row element using the given file data.
* @param fileData map of file attributes
@@ -183,7 +167,7 @@ window.FileList = {
*/
_createRow: function(fileData, options) {
var td, simpleSize, basename, extension, sizeColor,
- icon = FileList._replaceSVG(fileData.icon),
+ icon = OC.Util.replaceSVGIcon(fileData.icon),
name = fileData.name,
type = fileData.type || 'file',
mtime = parseInt(fileData.mtime, 10) || new Date().getTime(),
@@ -659,7 +643,11 @@ window.FileList = {
}, null, null, result.data.etag);
}
else {
- tr.find('td.filename').removeClass('preview').attr('style','background-image:url('+FileList._replaceSVG(fileInfo.icon)+')');
+ tr.find('td.filename')
+ .removeClass('preview')
+ .attr('style','background-image:url('
+ + OC.Util.replaceSVGIcon(fileInfo.icon)
+ + ')');
}
}
// reinsert row
diff --git a/apps/files/js/files.js b/apps/files/js/files.js
index ceb096f0941dea157b36bd516cd52c4095481111..5b58cdcb1ba3af5c80129eaa25f1eb41e9a95817 100644
--- a/apps/files/js/files.js
+++ b/apps/files/js/files.js
@@ -635,7 +635,7 @@ Files.getMimeIcon = function(mime, ready) {
ready(Files.getMimeIcon.cache[mime]);
} else {
$.get( OC.filePath('files','ajax','mimeicon.php'), {mime: mime}, function(path) {
- if(SVGSupport()){
+ if(OC.Util.hasSVGSupport()){
path = path.substr(0, path.length-4) + '.svg';
}
Files.getMimeIcon.cache[mime]=path;
diff --git a/core/js/js.js b/core/js/js.js
index 9a3b2ee6a5d663ecfdb285853016c9aa7a6d587e..1cbb9636dbe07a4c099740b0418ca30a9f514e8c 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -498,7 +498,7 @@ var OC={
});
}
if(!SVGSupport()) {
- replaceSVG();
+ OC.Util.replaceSVG();
}
}).show();
}, 'html');
@@ -785,7 +785,7 @@ SVGSupport.checkMimeType=function(){
}
});
if(headers["content-type"]!=='image/svg+xml'){
- replaceSVG();
+ OC.Util.replaceSVG();
SVGSupport.checkMimeType.correct=false;
}
}
@@ -793,35 +793,10 @@ SVGSupport.checkMimeType=function(){
};
SVGSupport.checkMimeType.correct=true;
-//replace all svg images with png for browser compatibility
-function replaceSVG(){
- $('img.svg').each(function(index,element){
- element=$(element);
- var src=element.attr('src');
- element.attr('src',src.substr(0,src.length-3)+'png');
- });
- $('.svg').each(function(index,element){
- element=$(element);
- var background=element.css('background-image');
- if(background){
- var i=background.lastIndexOf('.svg');
- if(i>=0){
- background=background.substr(0,i)+'.png'+background.substr(i+4);
- element.css('background-image',background);
- }
- }
- element.find('*').each(function(index,element) {
- element=$(element);
- var background=element.css('background-image');
- if(background){
- var i=background.lastIndexOf('.svg');
- if(i>=0){
- background=background.substr(0,i)+'.png'+background.substr(i+4);
- element.css('background-image',background);
- }
- }
- });
- });
+// replace all svg images with png for browser compatibility
+// @deprecated use OC.Util.replaceSVG instead
+function replaceSVG($el){
+ return OC.Util.replaceSVG($el);
}
/**
@@ -900,7 +875,7 @@ function initCore() {
}
if(!SVGSupport()){ //replace all svg images with png images for browser that dont support svg
- replaceSVG();
+ OC.Util.replaceSVG();
}else{
SVGSupport.checkMimeType();
}
@@ -1134,6 +1109,72 @@ function relative_modified_date(timestamp) {
else { return t('core','years ago'); }
}
+OC.Util = {
+ /**
+ * Returns whether the browser supports SVG
+ *
+ * @return true if the browser supports SVG, false otherwise
+ */
+ // TODO: replace with original function
+ hasSVGSupport: SVGSupport,
+ /**
+ * If SVG is not supported, replaces the given icon's extension
+ * from ".svg" to ".png".
+ * If SVG is supported, return the image path as is.
+ *
+ * @param file image path with svg extension
+ * @return fixed image path with png extension if SVG is not
+ * supported
+ */
+ replaceSVGIcon: function(file) {
+ if (!OC.Util.hasSVGSupport()) {
+ var i = file.lastIndexOf('.svg');
+ if (i >= 0) {
+ file = file.substr(0, i) + '.png' + file.substr(i+4);
+ }
+ }
+ return file;
+ },
+ /**
+ * Replace SVG images in all elements that have the "svg" class set
+ * with PNG images.
+ *
+ * @param $el root element from which to search, defaults to $('body')
+ */
+ replaceSVG: function($el) {
+ if (!$el) {
+ $el = $('body');
+ }
+ $el.find('img.svg').each(function(index,element){
+ element=$(element);
+ var src=element.attr('src');
+ element.attr('src',src.substr(0, src.length-3) + 'png');
+ });
+ $el.find('.svg').each(function(index,element){
+ element = $(element);
+ var background = element.css('background-image');
+ if (background){
+ var i = background.lastIndexOf('.svg');
+ if (i >= 0){
+ background = background.substr(0,i) + '.png' + background.substr(i + 4);
+ element.css('background-image', background);
+ }
+ }
+ element.find('*').each(function(index, element) {
+ element = $(element);
+ var background = element.css('background-image');
+ if (background) {
+ var i = background.lastIndexOf('.svg');
+ if(i >= 0){
+ background = background.substr(0,i) + '.png' + background.substr(i + 4);
+ element.css('background-image', background);
+ }
+ }
+ });
+ });
+ }
+};
+
/**
* get a variable by name
* @param string name
diff --git a/core/js/oc-dialogs.js b/core/js/oc-dialogs.js
index 4da56f27d276047db06616d93f79961ab209fdb7..2233b983ad4f99cfa97dbb66f5882139c74b53dc 100644
--- a/core/js/oc-dialogs.js
+++ b/core/js/oc-dialogs.js
@@ -19,6 +19,8 @@
*
*/
+/* global OC, t */
+
/**
* this class to ease the usage of jquery dialogs
*/
@@ -138,6 +140,9 @@ var OCdialogs = {
self.$filePicker = null;
}
});
+ if (!OC.Util.hasSVGSupport()) {
+ OC.Util.replaceSVG(self.$filePicker.parent());
+ }
})
.fail(function(status, error) {
// If the method is called while navigating away
@@ -560,7 +565,6 @@ var OCdialogs = {
filename: entry.name,
date: OC.mtime2date(Math.floor(entry.mtime / 1000))
});
- $li.find('img').attr('src', entry.icon);
if (entry.isPreviewAvailable) {
var urlSpec = {
file: dir + '/' + entry.name
@@ -568,10 +572,16 @@ var OCdialogs = {
var previewUrl = OC.generateUrl('/core/preview.png?') + $.param(urlSpec);
$li.find('img').attr('src', previewUrl);
}
+ else {
+ $li.find('img').attr('src', OC.Util.replaceSVGIcon(entry.icon));
+ }
self.$filelist.append($li);
});
self.$filelist.removeClass('loading');
+ if (!OC.Util.hasSVGSupport()) {
+ OC.Util.replaceSVG(self.$filePicker.find('.dirtree'));
+ }
});
},
/**
diff --git a/core/js/tests/specs/coreSpec.js b/core/js/tests/specs/coreSpec.js
index 94a397b789268277bbbc39a1a4d555df61fa018a..89056807788a140ed2391fca61a57cc55cb709ed 100644
--- a/core/js/tests/specs/coreSpec.js
+++ b/core/js/tests/specs/coreSpec.js
@@ -448,5 +448,31 @@ describe('Core base tests', function() {
expect($navigation.is(':visible')).toEqual(true);
});
});
+ describe('SVG extension replacement', function() {
+ var svgSupportStub;
+
+ beforeEach(function() {
+ svgSupportStub = sinon.stub(OC.Util, 'hasSVGSupport');
+ });
+ afterEach(function() {
+ svgSupportStub.restore();
+ });
+ it('does not replace svg extension with png when SVG is supported', function() {
+ svgSupportStub.returns(true);
+ expect(
+ OC.Util.replaceSVGIcon('/path/to/myicon.svg?someargs=1')
+ ).toEqual(
+ '/path/to/myicon.svg?someargs=1'
+ );
+ });
+ it('replaces svg extension with png when SVG not supported', function() {
+ svgSupportStub.returns(false);
+ expect(
+ OC.Util.replaceSVGIcon('/path/to/myicon.svg?someargs=1')
+ ).toEqual(
+ '/path/to/myicon.png?someargs=1'
+ );
+ });
+ });
});