[DE] handle skin based sprites

This commit is contained in:
maxkadushkin
2025-03-12 14:56:33 +03:00
parent a78672bfdf
commit 90243eb718
3 changed files with 53 additions and 13 deletions

View File

@ -82,6 +82,7 @@ define([
text: locale.txtThemeWhite || 'White',
type: 'light',
source: 'static',
icons: './resources/img/v2',
},
}
@ -293,17 +294,19 @@ define([
if ( inobj ) {
if ( inobj['sprite-buttons-base-url'] ) {
let base_url = inobj['sprite-buttons-base-url'];
!base_url.endsWith('/') && (base_url += '/');
// outobj = prepare_icons_from_url(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)
// !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))
@ -448,6 +451,11 @@ define([
document.body.className = document.body.className.replace(/theme-[\w-]+\s?/gi, '').trim();
document.body.classList.add(theme_id, 'theme-type-' + themes_map[theme_id].type);
if ( !!themes_map[theme_id].icons ) {
const base_url = themes_map[theme_id].icons;
window.uitheme.apply_icons_from_url(theme_id, base_url);
}
if ( this.api.asc_setContentDarkMode )
if ( themes_map[theme_id].type == 'dark' ) {
this.api.asc_setContentDarkMode(this.isContentThemeDark());
@ -470,6 +478,9 @@ define([
colors: colors_obj,
};
if ( themes_map[id].icons )
theme_obj.icons = themes_map[id].icons;
Common.localStorage.setItem('ui-theme', JSON.stringify(theme_obj));
// }
}

View File

@ -100,8 +100,8 @@ function checkScaling() {
}
}
let svg_icons = ['./resources/img/iconssmall@2.5x.svg',
'./resources/img/iconsbig@2.5x.svg', './resources/img/iconshuge@2.5x.svg'];
let svg_icons = window.uitheme.svg_icons || ['./resources/img/iconssmall@2.5x.svg',
'./resources/img/iconsbig@2.5x.svg', './resources/img/iconshuge@2.5x.svg'];
window.Common = {
Utils: {

View File

@ -76,13 +76,38 @@
!window.uitheme.id && window.uitheme.set_id(localstorage.getItem("ui-theme-id"));
window.uitheme.iscontentdark = localstorage.getItem("content-theme") == 'dark';
function inject_style_tag(content) {
function inject_style_tag(content, id) {
if ( id && !!document.getElementById(id) )
return;
const style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = content;
if (id) style.id = id;
document.getElementsByTagName('head')[0].appendChild(style);
}
window.uitheme.apply_icons_from_url = function (themeid, url) {
const base_url = !url.endsWith('/') ? url + '/' : url;
const sp_names = ['small', 'big', 'huge'];
const sp_scale = {'100':'', '125':'@1.25x','150':'@1.5x','175':'@1.75x','200':'@2x'};
let icons = [];
sp_names.forEach(function (n) {
for (const [key, value] of Object.entries(sp_scale)) {
icons.push('--sprite-button-'+n+'-'+key+':url('+ base_url +'icons' + n + value + '.png)');
}
});
inject_style_tag('.' + objtheme.id + '{' + icons.join(';') + ';}', objtheme.id);
const svg_icons_array = [base_url+'iconssmall@2.5x.svg', base_url + 'iconsbig@2.5x.svg', base_url + 'iconshuge@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'];
}
}
inject_style_tag(':root .theme-dark {' +
'--toolbar-header-document: #2a2a2a; --toolbar-header-spreadsheet: #2a2a2a;' +
'--toolbar-header-presentation: #2a2a2a; --toolbar-header-pdf: #2a2a2a; --toolbar-header-visio: #2a2a2a;}' +
@ -121,6 +146,10 @@
inject_style_tag('.' + objtheme.id + '{' + colors.join(';') + ';}');
}
if ( objtheme.icons ) {
window.uitheme.apply_icons_from_url(objtheme.id, objtheme.icons);
}
}
}
} else {