[main] used base url for custom icons sprite

apps/common/main/lib/controller/Themes.js

@@ -286,6 +286,21 @@ define([
         const normalize_icon_vars = inobj => {
             let outobj = {};
             if ( inobj ) {
+                if ( inobj['sprite-buttons-base-url'] ) {
+                    let base_url = inobj['sprite-buttons-base-url'];
+                    !base_url.endsWith('/') && (base_url += '/');
+
+                    const sp_names = ['small', 'big', 'huge'];
+                    const sp_scale = {'100':'', '125':'@1.25x','150':'@1.5x','175':'@1.75x','200':'@2x'};
+                    sp_names.forEach(n => {
+                        for (const [key, value] of Object.entries(sp_scale))
+                            outobj[`sprite-button-small-' + key`] = `url(${base_url}icons${n}${value}.png)`;
+                    });
+
+                    window.Common.Utils.injectSvgIcons([base_url+'iconssmall@2.5x.svg',
+                            base_url + 'iconsbig@2.5x.svg', base_url + 'iconshuge@2.5x.svg'], true)
+                }
+
                 for (const [key, value] of Object.entries(inobj))
                     outobj[key] = `url(${value})`;
             }

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

@@ -105,32 +105,42 @@ let svg_icons = ['./resources/img/iconssmall@2.5x.svg',
 
 window.Common = {
     Utils: {
-        injectSvgIcons: function () {
+        injectSvgIcons: function (svg_icons_array, force) {
             if ( window.isIEBrowser === true ) return;
 
             let runonce;
             // const el = document.querySelector('div.inlined-svg');
             // if (!el || !el.innerHTML.firstChild) {
-            if ( !runonce ) {
+            if ( !runonce || force === true ) {
                 runonce = true;
-                function htmlToElements(html) {
+                function htmlToElements(html, id) {
                     var template = document.createElement('template');
                     template.innerHTML = html;
                     // return template.content.childNodes;
+                    if ( !!id ) template.content.firstChild.id = id;
                     return template.content.firstChild;
                 }
 
-                svg_icons.map(function (url) {
+                !svg_icons_array && (svg_icons_array = svg_icons);
+                svg_icons_array.map(function (url) {
+                            console.log('map url', url)
                             fetch(url)
                                 .then(function (r) {
                                     if (r.ok) return r.text();
                                     else {/* error */}
                                 }).then(function (text) {
+                                    const type = /icons(\w+)(?:@2\.5x)\.svg$/.exec(url)[1];
+                                    let el_id;
+                                    if ( type ) {
+                                        const el = document.getElementById((el_id = 'idx-sprite-btns-' + type));
+                                        if (el) el.remove();
+                                    }
+
                                     const el = document.querySelector('div.inlined-svg')
-                                    el.appendChild(htmlToElements(text));
+                                    el.appendChild(htmlToElements(text, el_id));
 
-                                    const i = svg_icons.findIndex(function (item) {return item == url});
-                                    if ( !(i < 0) ) svg_icons.splice(i, 1)
+                                    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))
                         })
             }