fix bug 53723 and bug 75998

.gitignore

@@ -12,6 +12,7 @@ apps/spreadsheeteditor/embed/resources/less/node_modules
 apps/documenteditor/mobile/resources/sass/.sass-cache
 apps/spreadsheeteditor/mobile/resources/sass/.sass-cache
 apps/presentationeditor/mobile/resources/sass/.sass-cache
+apps/common/main/resources/img/doc-formats/formats@2.5x.svg
 apps/**/main/resources/**/iconssmall*.png
 apps/**/main/resources/**/iconssmall*.svg
 apps/**/main/resources/**/iconssmall*.less

apps/common/main/lib/util/htmlutils.js

@@ -101,8 +101,12 @@ function checkScaling() {
     }
 }
 
-let svg_icons = window.uitheme.svg_icons || ['./resources/img/iconssmall@2.5x.svg',
+let svg_icons = window.uitheme.svg_icons || [
-                    './resources/img/iconsbig@2.5x.svg', './resources/img/iconshuge@2.5x.svg'];
+    './resources/img/iconssmall@2.5x.svg',
+    './resources/img/iconsbig@2.5x.svg',
+    './resources/img/iconshuge@2.5x.svg',
+    '../../common/main/resources/img/doc-formats/formats@2.5x.svg'
+];
 
 window.Common = {
     Utils: {
@@ -131,10 +135,14 @@ window.Common = {
                                     if (r.ok) return r.text();
                                     else {/* error */}
                                 }).then(function (text) {
-                                    const type = /icons(\w+)(?:@2\.5x)\.svg$/.exec(url)[1];
+                                    const btnMatch = /icons(\w+)(?:@2\.5x)\.svg$/.exec(url);
+                                    const formatMatch = /doc-formats\/(\w+)(?:@2\.5x)\.svg$/.exec(url);
+                                    const type = btnMatch ? btnMatch[1] : (formatMatch ? formatMatch[1] : null);
+
                                     let el_id;
                                     if ( type ) {
-                                        const el = document.getElementById((el_id = 'idx-sprite-btns-' + type));
+                                        const prefix = btnMatch ? 'idx-sprite-btns-' : 'idx-sprite-formats-';
+                                        const el = document.getElementById((el_id = prefix  + type));
                                         if ( el ) {
                                             const idx = el.getAttribute('data-sprite-uid');
                                             if ( idx != sprite_uid )
@@ -149,6 +157,8 @@ window.Common = {
                                         child.setAttribute('data-sprite-uid', sprite_uid);
                                     el.appendChild(child);
 
+                                    console.log(url, 'injected' );
+
                                     const i = svg_icons_array.findIndex(function (item) {return item == url});
                                     if ( !(i < 0) ) svg_icons_array.splice(i, 1)
                                 }).catch(console.error.bind(console))

apps/common/main/lib/util/themeinit.js

@@ -110,11 +110,11 @@
         if ( base_url.lastIndexOf('../img/', 0) === 0 )
             base_url = base_url.replace('..','./resources');
 
-        const svg_icons_array = [base_url+'iconssmall@2.5x.svg', base_url + 'iconsbig@2.5x.svg', base_url + 'iconshuge@2.5x.svg'];
+        const svg_icons_array = [base_url + 'iconssmall@2.5x.svg', base_url + 'iconsbig@2.5x.svg', base_url + 'iconshuge@2.5x.svg', '../../common/main/resources/img/doc-formats/formats@2.5x.svg'];
         if ( window.Common && window.Common.Utils )
             window.Common.Utils.injectSvgIcons(svg_icons_array, true);
         else {
-            window.uitheme.svg_icons = [base_url+'iconssmall@2.5x.svg', base_url + 'iconsbig@2.5x.svg', base_url + 'iconshuge@2.5x.svg'];
+            window.uitheme.svg_icons = svg_icons_array;
         }
     }
 

apps/common/main/lib/view/RecentFiles.js

@@ -81,6 +81,7 @@ define([
                     '<div class="recent-wrap">',
                         '<div class="recent-icon">',
                             '<div>',
+                                '<svg><use href="#<%=format || \'blank\' %>"></use></svg>',
                                 '<div class= <% if (typeof format !== "undefined") {%> "img-format-<%=format %>"<% } else {%> "svg-file-recent"<%} %>></div>',
                             '</div>',
                         '</div>',

apps/documenteditor/main/resources/less/filemenu.less

@@ -521,6 +521,17 @@
       div {
         width: 100%;
         height: 100%;
+
+        svg {
+          display: none;
+          width: 24px;
+          height: 30px;
+
+          .pixel-ratio__2_5 & {
+            display: block;
+          }
+        }
+
         div{
           background: ~"url(@{common-image-const-path}/doc-formats/formats.png)";
           background-size: 1200px 30px;
@@ -540,6 +551,10 @@
             .pixel-ratio__2 & {
               background-image: ~"url(@{common-image-const-path}/doc-formats/formats@2x.png)";
             }
+
+            .pixel-ratio__2_5 & {
+              display: none;
+            }
           }
         }
         .format-from-index(@index) {

build/sprites/Gruntfile.js

@@ -226,6 +226,41 @@ module.exports = function (grunt, rootpathprefix) {
 
             ...generate_svg_sprite_tasks('draw'),
             ...generate_svg_sprite_tasks('draw', true),
+
+            docformats: {
+                src: [
+                    `${_prefix}apps/common/main/resources/img/doc-formats/*.svg`,
+                    `!${_prefix}apps/common/main/resources/img/doc-formats/formats@2.5x.svg`
+                ],
+                dest: `${_prefix}apps/common/main/resources/img/doc-formats`,
+                options: {
+                    svg: {
+                        rootAttributes: {
+                            xmlns:'http://www.w3.org/2000/svg',
+                        },
+                        dimensionAttributes: false,
+                    },
+                    mode: {
+                        symbol: {
+                            inline: false,
+                            dest: './',
+                            sprite: `formats@2.5x.svg`,
+                        },
+                    },
+                    shape: {
+                        id: {
+                            separator: ""
+                        },
+                        transform: [{
+                            svgo: {
+                                plugins: [
+                                    'removeXMLNS',
+                                ]
+                            },
+                        }]
+                    },
+                }
+            },
         },
     });