mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-17 17:51:24 +01:00
fix(#944): uploaded svg emblems can conflict with fmg ids
This commit is contained in:
parent
41bd157165
commit
aad1300338
4 changed files with 26 additions and 29 deletions
|
|
@ -1731,7 +1731,7 @@ div.states > div.biomeArea {
|
||||||
#emblemUploadControl,
|
#emblemUploadControl,
|
||||||
#emblemDownloadControl {
|
#emblemDownloadControl {
|
||||||
margin-top: 0.3em;
|
margin-top: 0.3em;
|
||||||
text-align: center;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.editorLine {
|
div.editorLine {
|
||||||
|
|
|
||||||
|
|
@ -128,7 +128,7 @@
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<link rel="preload" href="index.css?v=1.89.19" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
<link rel="preload" href="index.css?v=1.89.21" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
||||||
<link rel="preload" href="icons.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
<link rel="preload" href="icons.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
||||||
<link rel="preload" href="libs/jquery-ui.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
<link rel="preload" href="libs/jquery-ui.css" as="style" onload="this.onload=null; this.rel='stylesheet'" />
|
||||||
</head>
|
</head>
|
||||||
|
|
@ -4902,7 +4902,10 @@
|
||||||
>
|
>
|
||||||
Any image
|
Any image
|
||||||
</button>
|
</button>
|
||||||
<button id="emblemsUploadSVG" data-tip="Upload prepared SVG image, e.g. SVG from Armoria">
|
<button
|
||||||
|
id="emblemsUploadSVG"
|
||||||
|
data-tip="Upload prepared SVG image (SVG from Armoria or SVG processed with 'Optimize vector' tool)"
|
||||||
|
>
|
||||||
Prepared SVG
|
Prepared SVG
|
||||||
</button>
|
</button>
|
||||||
<a
|
<a
|
||||||
|
|
@ -7896,7 +7899,7 @@
|
||||||
<script defer src="modules/ui/markers-overview.js?v=1.89.20"></script>
|
<script defer src="modules/ui/markers-overview.js?v=1.89.20"></script>
|
||||||
<script defer src="modules/ui/regiment-editor.js"></script>
|
<script defer src="modules/ui/regiment-editor.js"></script>
|
||||||
<script defer src="modules/ui/battle-screen.js"></script>
|
<script defer src="modules/ui/battle-screen.js"></script>
|
||||||
<script defer src="modules/ui/emblems-editor.js"></script>
|
<script defer src="modules/ui/emblems-editor.js?v=1.89.21"></script>
|
||||||
<script defer src="modules/ui/markers-editor.js"></script>
|
<script defer src="modules/ui/markers-editor.js"></script>
|
||||||
<script defer src="modules/ui/3d.js"></script>
|
<script defer src="modules/ui/3d.js"></script>
|
||||||
<script defer src="modules/ui/submap.js"></script>
|
<script defer src="modules/ui/submap.js"></script>
|
||||||
|
|
|
||||||
|
|
@ -239,12 +239,9 @@ function editEmblem(type, id, el) {
|
||||||
input.value = "";
|
input.value = "";
|
||||||
|
|
||||||
if (file.size > 500000) {
|
if (file.size > 500000) {
|
||||||
tip(
|
const message =
|
||||||
`File is too big, please optimize file size up to 500kB and re-upload. Recommended size is 200x200 px and up to 100kB`,
|
"File is too big, please optimize file size up to 500kB and re-upload. Recommended size is 200x200 px and up to 100kB";
|
||||||
true,
|
tip(message, true, "error", 5000);
|
||||||
"error",
|
|
||||||
5000
|
|
||||||
);
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -253,40 +250,37 @@ function editEmblem(type, id, el) {
|
||||||
reader.onload = function (readerEvent) {
|
reader.onload = function (readerEvent) {
|
||||||
const result = readerEvent.target.result;
|
const result = readerEvent.target.result;
|
||||||
const defs = document.getElementById("defs-emblems");
|
const defs = document.getElementById("defs-emblems");
|
||||||
const coa = document.getElementById(id); // old emblem
|
const oldEmblem = document.getElementById(id);
|
||||||
|
|
||||||
if (type === "image") {
|
let href = result; // raster images
|
||||||
const svg = `<svg id="${id}" xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200"><image x="0" y="0" width="200" height="200" href="${result}"/></svg>`;
|
if (type === "svg") {
|
||||||
defs.insertAdjacentHTML("beforeend", svg);
|
|
||||||
} else {
|
|
||||||
const el = document.createElement("html");
|
const el = document.createElement("html");
|
||||||
el.innerHTML = result;
|
el.innerHTML = result;
|
||||||
|
|
||||||
// remove sodipodi and inkscape attributes
|
|
||||||
el.querySelectorAll("*").forEach(el => {
|
el.querySelectorAll("*").forEach(el => {
|
||||||
const attributes = el.getAttributeNames();
|
if (el.id === "adobe_illustrator_pgf") el.remove(); // remove Adobe Illustrator inner data
|
||||||
attributes.forEach(attr => {
|
|
||||||
|
el.getAttributeNames().forEach(attr => {
|
||||||
|
// remove sodipodi and inkscape attributes
|
||||||
if (attr.includes("inkscape") || attr.includes("sodipodi")) el.removeAttribute(attr);
|
if (attr.includes("inkscape") || attr.includes("sodipodi")) el.removeAttribute(attr);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
const svg = el.querySelector("svg");
|
const svg = el.querySelector("svg");
|
||||||
if (!svg) {
|
if (!svg) {
|
||||||
tip(
|
const message = "The file is not a valid SVG. Please use Armoria or other relevant tools";
|
||||||
"The file should be prepated for load to FMG. Please use Armoria or other relevant tools",
|
tip(message, false, "error");
|
||||||
false,
|
|
||||||
"error"
|
|
||||||
);
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const newEmblem = defs.appendChild(svg);
|
const serialized = new XMLSerializer().serializeToString(svg);
|
||||||
newEmblem.id = id;
|
href = "data:image/svg+xml;base64," + window.btoa(serialized);
|
||||||
newEmblem.setAttribute("width", 200);
|
|
||||||
newEmblem.setAttribute("height", 200);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (coa) coa.remove(); // remove old emblem
|
const svg = `<svg id="${id}" viewBox="0 0 200 200"><image width="200" height="200" href="${href}"/></svg>`;
|
||||||
|
defs.insertAdjacentHTML("beforeend", svg);
|
||||||
|
|
||||||
|
if (oldEmblem) oldEmblem.remove();
|
||||||
el.coa = "custom";
|
el.coa = "custom";
|
||||||
emblemShapeSelector.disabled = true;
|
emblemShapeSelector.disabled = true;
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
// version and caching control
|
// version and caching control
|
||||||
const version = "1.89.20"; // generator version, update each time
|
const version = "1.89.21"; // generator version, update each time
|
||||||
|
|
||||||
{
|
{
|
||||||
document.title += " v" + version;
|
document.title += " v" + version;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue