Moved code to replace svg with png to OC.Util

- Moved code that replaces the "svg" extension for the given file to
core as OC.Util.replaceSVGIcon.
- Added unit test for OC.Util.replaceSVGIcon
- Moved "replaceSVG" to OC.Util.replaceSVG and deprecated the global
"replaceSVG" function.
- Added alias for SVGSupport() as OC.Util.hasSVGSupport() (for now)

diff --git a/apps/files/js/breadcrumb.js b/apps/files/js/breadcrumb.js
index ff017a22bb5350f4c658c02481f8a285237fabf5..5bc2fac13695d29940872c4dfa6e76931035e923 100644 (file)
--- 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 (file)
--- 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 4c2d87d808ca1811bd9255890365d1e139263889..668faf723c840ae8e8e9d1cd7ee3baa292ff7840 100644 (file)
--- 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 (file)
--- 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/tests/specs/coreSpec.js b/core/js/tests/specs/coreSpec.js
index 94a397b789268277bbbc39a1a4d555df61fa018a..89056807788a140ed2391fca61a57cc55cb709ed 100644 (file)
--- 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'
+                       );
+               });
+       });
 });