mirror of
https://github.com/Azgaar/Fantasy-Map-Generator.git
synced 2025-12-17 09:41:24 +01:00
resource icon upload + save/load
This commit is contained in:
parent
709f45e03e
commit
98ef47708c
4 changed files with 59 additions and 16 deletions
|
|
@ -212,6 +212,9 @@ function editHeightmap() {
|
|||
|
||||
Lakes.defineGroup();
|
||||
defineBiomes();
|
||||
|
||||
Resources.generate();
|
||||
|
||||
rankCells();
|
||||
Cultures.generate();
|
||||
Cultures.expand();
|
||||
|
|
|
|||
|
|
@ -307,18 +307,22 @@ function editResources() {
|
|||
|
||||
function changeIcon(resource, line, el) {
|
||||
const standardIcons = Array.from(document.getElementById('resource-icons').querySelectorAll('symbol')).map((el) => el.id);
|
||||
const standardIconsOptions = standardIcons.map((icon) => `<option value=${icon}${resource.icon === icon ? 'selected' : ''}>${icon}</option>`);
|
||||
const standardIconsOptions = standardIcons.map((icon) => `<option value=${icon}>${icon}</option>`);
|
||||
|
||||
const customIconsEl = document.getElementById('defs-icons');
|
||||
const customIcons = customIconsEl ? Array.from(document.getElementById('defs-icons').querySelectorAll('svg')).map((el) => el.id) : [];
|
||||
const customIconsOptions = customIcons.map((icon) => `<option value=${icon}${resource.icon === icon ? 'selected' : ''}>${icon}</option>`);
|
||||
const customIconsOptions = customIcons.map((icon) => `<option value=${icon}>${icon}</option>`);
|
||||
|
||||
const select = document.getElementById('resourceSelectIcon');
|
||||
select.innerHTML = standardIconsOptions + customIconsOptions;
|
||||
select.value = resource.icon;
|
||||
|
||||
const preview = document.getElementById('resourceIconPreview');
|
||||
preview.setAttribute('href', '#' + resource.icon);
|
||||
|
||||
const viewBoxSection = document.getElementById('resourceIconEditorViewboxFields');
|
||||
viewBoxSection.style.display = 'none';
|
||||
|
||||
$('#resourceIconEditor').dialog({
|
||||
resizable: false,
|
||||
title: 'Change Icon',
|
||||
|
|
@ -329,6 +333,7 @@ function editResources() {
|
|||
'Change color': () => changeColor(resource, line, el),
|
||||
Apply: function () {
|
||||
$(this).dialog('close');
|
||||
|
||||
resource.icon = select.value;
|
||||
line.querySelector('svg.resourceIcon > use').setAttribute('href', '#' + select.value);
|
||||
drawResources();
|
||||
|
|
@ -338,10 +343,29 @@ function editResources() {
|
|||
});
|
||||
|
||||
const uploadTo = document.getElementById('defs-icons');
|
||||
const onUpload = (id) => {
|
||||
const onUpload = (type, id) => {
|
||||
preview.setAttribute('href', '#' + id);
|
||||
select.innerHTML += `<option value=${id}>${id}</option>`;
|
||||
select.value = id;
|
||||
|
||||
if (type === 'image') return;
|
||||
|
||||
// let user set viewBox for svg image
|
||||
const el = document.getElementById(id);
|
||||
viewBoxSection.style.display = 'block';
|
||||
const viewBoxAttr = el.getAttribute('viewBox');
|
||||
const initialViewBox = viewBoxAttr ? viewBoxAttr.split(' ') : [0, 0, 200, 200];
|
||||
const inputs = viewBoxSection.querySelectorAll('input');
|
||||
const changeInput = () => {
|
||||
const viewBox = Array.from(inputs)
|
||||
.map((input) => input.value)
|
||||
.join(' ');
|
||||
el.setAttribute('viewBox', viewBox);
|
||||
};
|
||||
inputs.forEach((input, i) => {
|
||||
input.value = initialViewBox[i];
|
||||
input.onchange = changeInput;
|
||||
});
|
||||
};
|
||||
|
||||
// add listeners
|
||||
|
|
@ -391,7 +415,7 @@ function editResources() {
|
|||
icon.setAttribute('height', 200);
|
||||
}
|
||||
|
||||
callback(id);
|
||||
callback(type, id);
|
||||
};
|
||||
|
||||
if (type === 'image') reader.readAsDataURL(file);
|
||||
|
|
@ -538,6 +562,8 @@ function editResources() {
|
|||
}
|
||||
|
||||
function resourceAdd() {
|
||||
if (pack.resources.length >= 256) return tip('Maximum number of resources is reached', false, 'error');
|
||||
|
||||
let i = last(pack.resources).i;
|
||||
while (Resources.get(i)) {
|
||||
i++;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue