custom spread models

This commit is contained in:
Azgaar 2021-05-10 14:01:20 +03:00
parent 02d0782386
commit 131c19a448
4 changed files with 188 additions and 60 deletions

View file

@ -1454,14 +1454,19 @@ div.states > .icon {
vertical-align: middle;
}
div.states > .model {
width: 7em;
}
div.states > .icon > * {
pointer-events: none;
}
div.states > .resourceCategory,
div.states > .resourceModel {
cursor: pointer;
width: 7em;
overflow: hidden;
vertical-align: middle;
white-space: nowrap;
}
#diplomacyBodySection > div {
cursor: pointer;
}

View file

@ -3006,10 +3006,10 @@
<div id="resourcesHeader" class="header">
<div style="left:2.8em" data-tip="Click to sort by resource name" class="sortable alphabetically" data-sortby="name">Resource&nbsp;</div>
<div style="left:8.8em" data-tip="Click to sort by resource category" class="sortable alphabetically" data-sortby="category">Category&nbsp;</div>
<div style="left:14em" data-tip="Click to sort spread model" class="sortable alphabetically" data-sortby="model">Model&nbsp;</div>
<div style="left:20em" data-tip="Click to sort by resource basic value" class="sortable" data-sortby="value">Value&nbsp;</div>
<div style="left:23.6em" data-tip="Click to sort by generation chance" class="sortable" data-sortby="chance">Chance&nbsp;</div>
<div style="left:28em" data-tip="Click to sort by number of cells" class="sortable icon-sort-number-down" data-sortby="cells">Cells&nbsp;</div>
<div style="left:14em" data-tip="Click to sort spread model" class="sortable alphabetically" data-sortby="model">Spread model&nbsp;</div>
<div style="left:21em" data-tip="Click to sort by resource basic value" class="sortable" data-sortby="value">Value&nbsp;</div>
<div style="left:24.2em" data-tip="Click to sort by generation chance" class="sortable" data-sortby="chance">Chance&nbsp;</div>
<div style="left:29em" data-tip="Click to sort by number of cells" class="sortable icon-sort-number-down" data-sortby="cells">Cells&nbsp;</div>
</div>
<div id="resourcesBody" class="table" data-type="absolute"></div>

View file

@ -10,7 +10,7 @@
// apply logic on save
// apply logic on load
let cells;
let cells, cellId;
const getDefault = function () {
// model: cells eligibility function; chance: chance to get rosource in model-eligible cell
@ -24,14 +24,14 @@
{i: 7, name: "Silver", category: "Ore", icon: "resource-silver", color: "#C0C0C0", value: 15, chance: 3, model: "Mountains", bonus: {prestige: 2}},
{i: 8, name: "Gold", category: "Ore", icon: "resource-gold", color: "#d4af37", value: 30, chance: 1, model: "Headwaters", bonus: {prestige: 3}},
{i: 9, name: "Grain", category: "Food", icon: "resource-grain", color: "#F5DEB3", value: 1, chance: 15, model: "Biome_habitability", bonus: {population: 4}},
{i: 10, name: "Сattle", category: "Food", icon: "resource-cattle", color: "#56b000", value: 2, chance: 10, model: "Pastures_and_temperate_forest", bonus: {population: 2}},
{i: 10, name: "Cattle", category: "Food", icon: "resource-cattle", color: "#56b000", value: 2, chance: 10, model: "Pastures_and_temperate_forest", bonus: {population: 2}},
{i: 11, name: "Fish", category: "Food", icon: "resource-fish", color: "#7fcdff", value: 1, chance: 5, model: "Marine_and_rivers", bonus: {population: 2}},
{i: 12, name: "Game", category: "Food", icon: "resource-game", color: "#c38a8a", value: 2, chance: 3, model: "Any_forest", bonus: {archers: 2, population: 1}},
{i: 13, name: "Wine", category: "Food", icon: "resource-wine", color: "#963e48", value: 3, chance: 4, model: "Tropical_forests", bonus: {population: 1, prestige: 1}},
{i: 14, name: "Olives", category: "Food", icon: "resource-olives", color: "#BDBD7D", value: 3, chance: 4, model: "Tropical_forests", bonus: {population: 1}},
{i: 15, name: "Honey", category: "Food", icon: "resource-honey", color: "#DCBC66", value: 4, chance: 3, model: "Temperate_and_boreal_forests", bonus: {population: 1}},
{i: 16, name: "Salt", category: "Food", icon: "resource-salt", color: "#E5E4E5", value: 5, chance: 4, model: "Arid_land_and_salt_lakes", bonus: {population: 1, defence: 1}},
{i: 17, name: "Dates", category: "Food", icon: "resource-dates", color: "#dbb2a3", value: 3, chance: 3, model: "Deserts", bonus: {population: 1}},
{i: 17, name: "Dates", category: "Food", icon: "resource-dates", color: "#dbb2a3", value: 3, chance: 3, model: "Hot_desert", bonus: {population: 1}},
{i: 18, name: "Horses", category: "Supply", icon: "resource-horses", color: "#ba7447", value: 10, chance: 6, model: "Grassland_and_cold_desert", bonus: {cavalry: 2}},
{i: 19, name: "Elephants", category: "Supply", icon: "resource-elephants", color: "#C5CACD", value: 15, chance: 2, model: "Hot_biomes", bonus: {cavalry: 1}},
{i: 20, name: "Camels", category: "Supply", icon: "resource-camels", color: "#C19A6B", value: 13, chance: 4, model: "Deserts", bonus: {cavalry: 1}},
@ -44,7 +44,7 @@
{i: 27, name: "Spices", category: "Luxury", icon: "resource-spices", color: "#e99c75", value: 30, chance: 2, model: "Tropical_rainforest", bonus: {prestige: 2}},
{i: 28, name: "Amber", category: "Luxury", icon: "resource-amber", color: "#e68200", value: 15, chance: 2, model: "Foresty_seashore", bonus: {prestige: 1}},
{i: 29, name: "Furs", category: "Material", icon: "resource-furs", color: "#8a5e51", value: 13, chance: 2, model: "Boreal_forests", bonus: {prestige: 1}},
{i: 30, name: "Sheeps", category: "Material", icon: "resource-sheeps", color: "#53b574", value: 2, chance: 5, model: "Pastures_and_temperate_forest", bonus: {infantry: 1}},
{i: 30, name: "Sheep", category: "Material", icon: "resource-sheeps", color: "#53b574", value: 2, chance: 5, model: "Pastures_and_temperate_forest", bonus: {infantry: 1}},
{i: 31, name: "Slaves", category: "Supply", icon: "resource-slaves", color: "#757575", value: 10, chance: 3, model: "Less_habitable_seashore", bonus: {population: 2}},
{i: 32, name: "Tar", category: "Material", icon: "resource-tar", color: "#727272", value: 3, chance: 3, model: "Any_forest", bonus: {fleet: 1}},
{i: 33, name: "Saltpeter", category: "Material", icon: "resource-saltpeter", color: "#e6e3e3", value: 8, chance: 2, model: "Biome_habitability", bonus: {artillery: 3}},
@ -58,46 +58,52 @@
];
};
// "0 Marine", "1 Hot Deserts", "2 Cold Deserts", "3 Savanna", "4 Grassland", "5 Tropical seasonal forest", "6 Temperate deciduous forest",
// "7 Tropical rainforest", "8 Temperate rainforest", "9 Taiga", "10 Tundra", "11 Glacier", "12 Wetland"
const models = {
Deciduous_forests: i => [6, 7, 8].includes(cells.biome[i]),
Any_forest: i => [5, 6, 7, 8, 9].includes(cells.biome[i]),
Temperate_and_boreal_forests: i => [6, 8, 9].includes(cells.biome[i]),
Hills: i => cells.h[i] >= 40 || (cells.h[i] >= 30 && !(i % 10)),
Mountains: i => cells.h[i] >= 60 || (cells.h[i] >= 40 && !(i % 10)),
Mountains_and_wetlands: i => cells.h[i] >= 60 || (cells.biome[i] === 12 && !(i % 8)),
Headwaters: i => cells.h[i] >= 40 && cells.r[i],
Biome_habitability: i => chance(biomesData.habitability[cells.biome[i]]),
Marine_and_rivers: i => (cells.t[i] < 0 && ["ocean", "freshwater", "salt"].includes(group(i))) || (cells.t[i] > 0 && cells.t[i] < 3 && cells.r[i]),
Pastures_and_temperate_forest: i => chance(100 - cells.h[i]) && chance([0, 0, 0, 100, 100, 20, 80, 0, 0, 0, 0, 0, 0][cells.biome[i]]),
Tropical_forests: i => [5, 7].includes(cells.biome[i]),
Arid_land_and_salt_lakes: i => chance([0, 80, 60, 0, 0, 0, 0, 0, 0, 0, 0, 0, 10][cells.biome[i]]) || group(i) === "salt" || group(i) === "dry",
Deserts: i => cells.biome[i] === 1 || cells.biome[i] === 2,
Grassland_and_cold_desert: i => cells.biome[i] === 3 || (!(i % 4) && cells.biome[i] === 2),
Hot_biomes: i => [1, 3, 5, 7].includes(cells.biome[i]),
Hot_desert_and_tropical_forest: i => [1, 7].includes(cells.biome[i]),
Tropical_rainforest: i => cells.biome[i] === 7,
Tropical_waters: i => cells.t[i] === -1 && temp(i) >= 18,
Hilly_tropical_rainforest: i => cells.h[i] >= 40 && cells.biome[i] === 7,
Subtropical_waters: i => cells.t[i] === -1 && temp(i) >= 14,
Habitable_biome_or_marine: i => biomesData.habitability[cells.biome[i]] || cells.t[i] === -1,
Foresty_seashore: i => cells.t[i] === 1 && [6, 7, 8, 9].includes(cells.biome[i]),
Boreal_forests: i => chance([0, 0, 0, 0, 0, 0, 20, 0, 20, 100, 50, 0, 10][cells.biome[i]]),
Less_habitable_seashore: i => cells.t[i] === 1 && chance([0, 50, 30, 30, 20, 10, 10, 20, 10, 20, 10, 0, 5][cells.biome[i]]),
Less_habitable_biomes: i => chance([5, 80, 30, 10, 20, 5, 5, 5, 5, 30, 90, 0, 5][cells.biome[i]]),
Arctic_waters: i => cells.t[i] < 0 && temp(i) < 8
const defaultModels = {
Deciduous_forests: 'biome(6, 7, 8)',
Any_forest: 'biome(5, 6, 7, 8, 9)',
Temperate_and_boreal_forests: 'biome(6, 8, 9)',
Hills: 'minHeight(40) || (minHeight(30) && nth(10))',
Mountains: 'minHeight(60) || (minHeight(40) && nth(10))',
Mountains_and_wetlands: 'minHeight(60) || (biome(12) && nth(8))',
Headwaters: 'river() && minHeight(40)',
Biome_habitability: 'habitability()',
Marine_and_rivers: 'type("ocean", "freshwater", "salt") || (river() && shore(1, 2))',
Pastures_and_temperate_forest: '(biome(3, 4) && !elevation()) || (biome(6) && random(70)) || (biome(5) && nth(5))',
Tropical_forests: 'biome(5, 7)',
Arid_land_and_salt_lakes: 'type("salt", "dry") || (biome(1, 2) && random(70)) || (biome(12) && nth(10))',
Hot_desert: 'biome(1)',
Deserts: 'biome(1, 2)',
Grassland_and_cold_desert: 'biome(3) || (biome(2) && nth(4))',
Hot_biomes: 'biome(1, 3, 5, 7)',
Hot_desert_and_tropical_forest: 'biome(1, 7)',
Tropical_rainforest: 'biome(7)',
Tropical_waters: 'shore(-1) && minTemp(18)',
Hilly_tropical_rainforest: 'minHeight(40) && biome(7)',
Subtropical_waters: 'shore(-1) && minTemp(14)',
Habitable_biome_or_marine: 'shore(-1) || habitable()',
Foresty_seashore: 'shore(1) && biome(6, 7, 8, 9)',
Boreal_forests: 'biome(9) || (biome(10) && nth(2)) || (biome(6, 8) && nth(5)) || (biome(12) && nth(10))',
Less_habitable_seashore: 'shore(1) && habitable() && !habitability()',
Less_habitable_biomes: 'habitable() && !habitability()',
Arctic_waters: 'biome(0) && maxTemp(7)'
};
const chance = v => {
if (v < 0.01) return false;
if (v > 99.99) return true;
return v / 100 > Math.random();
};
const temp = i => grid.cells.temp[pack.cells.g[i]];
const group = i => pack.features[cells.f[i]].group;
const methods = {
random: (number) => number >= 100 || number > 0 && number / 100 > Math.random(),
nth: (number) => !(cellId % number),
habitable: () => biomesData.habitability[pack.cells.biome[cellId]],
habitability: () => biomesData.habitability[cells.biome[cellId]] / 100 > Math.random(),
elevation: () => pack.cells.h[cellId] / 100 > Math.random(),
biome: (...biomes) => biomes.includes(pack.cells.biome[cellId]),
minHeight: (heigh) => pack.cells.h[cellId] >= heigh,
maxHeight: (heigh) => pack.cells.h[cellId] <= heigh,
minTemp: (temp) => grid.cells.temp[pack.cells.g[cellId]] >= temp,
maxTemp: (temp) => grid.cells.temp[pack.cells.g[cellId]] <= temp,
shore: (...rings) => rings.includes(pack.cells.t[cellId]),
type: (...types) => types.includes(pack.features[cells.f[cellId]].group),
river: () => pack.cells.r[cellId]
}
const allMethods = "{" + Object.keys(methods).join(", ") + "}";
const generate = function () {
console.time("generateResources");
@ -105,19 +111,25 @@
cells.resource = new Uint8Array(cells.i.length); // resources array [0, 255]
const resourceMaxCells = Math.ceil((200 * cells.i.length) / 5000);
if (!pack.resources) pack.resources = getDefault();
pack.resources.forEach(r => (r.cells = 0));
pack.resources.forEach(r => {
r.cells = 0;
const model = r.custom || defaultModels[r.model];
r.fn = new Function(allMethods, "return " + model);
});
const skipGlaciers = biomesData.habitability[11] === 0;
const shuffledCells = d3.shuffle(cells.i.slice());
for (const i of shuffledCells) {
if (!(i % 10)) d3.shuffle(pack.resources);
if (skipGlaciers && cells.biome[i] === 11) continue;
const rnd = Math.random() * 100;
cellId = i;
for (const resource of pack.resources) {
if (resource.cells >= resourceMaxCells) continue;
if (!models[resource.model](i)) continue;
if (resource.cells >= resource.chance && rnd > resource.chance) continue;
if (!resource.fn({...methods})) continue;
cells.resource[i] = resource.i;
resource.cells++;
@ -132,5 +144,5 @@
const getStroke = color => d3.color(color).darker(2).hex();
const get = i => pack.resources.find(resource => resource.i === i);
return {generate, getDefault, getStroke, get};
return {generate, getDefault, defaultModels, getStroke, get};
});

View file

@ -22,18 +22,29 @@ function editResources() {
document.getElementById("resourcesPercentage").addEventListener("click", togglePercentageMode);
document.getElementById("resourcesExport").addEventListener("click", downloadResourcesData);
body.addEventListener("click", function(ev) {
const el = ev.target, cl = el.classList, line = el.parentNode, i = +line.dataset.id;
const resource = Resources.get(+line.dataset.id);
if (cl.contains("resourceCategory")) return changeCategory(resource, line, el);
if (cl.contains("resourceModel")) return changeModel(resource, line, el);
});
body.addEventListener("change", function(ev) {
const el = ev.target, cl = el.classList, line = el.parentNode;
const resource = Resources.get(+line.dataset.id);
if (cl.contains("resourceName")) return changeName(resource, el.value, line);
});
// add line for each resource
function resourcesEditorAddLines() {
const addTitle = (string, max) => string.length < max ? "" : `title="${string}"`;
let lines = "";
const categories = [...new Set(pack.resources.map(r => r.category))].sort();
const categoryOptions = category => categories.map(c => `<option ${c === category ? "selected" : ""} value="${c}">${c}</option>`).join("");
const models = [...new Set(pack.resources.map(r => r.model))].sort();
const modelOptions = model => models.map(m => `<option ${m === model ? "selected" : ""} value="${m}">${m.replaceAll("_", " ")}</option>`).join("");
// // {i: 33, name: "Saltpeter", icon: "resource-saltpeter", color: "#e6e3e3", value: 8, chance: 2, model: "habitability", bonus: {artillery: 3}}
for (const r of pack.resources) {
const stroke = Resources.getStroke(r.color);
const model = r.model.replaceAll("_", " ");
lines += `<div class="states resources" data-id=${r.i} data-name="${r.name}" data-color="${r.color}"
data-category="${r.category}" data-chance="${r.chance}"
data-value="${r.value}" data-model="${r.model}" data-cells="${r.cells}">
@ -42,8 +53,8 @@ function editResources() {
<use href="#${r.icon}" x="10%" y="10%" width="80%" height="80%"/>
</svg>
<input data-tip="Resource name. Click and category to change" class="resourceName" value="${r.name}" autocorrect="off" spellcheck="false">
<select data-tip="Resource category. Select to change">${categoryOptions(r.category)}</select>
<select data-tip="Resource spread model. Select to change" class="model">${modelOptions(r.model)}</select>
<div data-tip="Resource category. Select to change" class="resourceCategory" ${addTitle(r.category, 8)}">${r.category}</div>
<div data-tip="Resource spread model. Select to change" class="resourceModel" ${addTitle(model, 8)}">${model}</div>
<input data-tip="Resource basic value. Click and type to change" value="${r.value}" type="number" min=0 max=100 step=1 />
<input data-tip="Resource generation chance in eligible cell. Click and type to change" value="${r.chance}" type="number" min=0 max=100 step=.1 />
@ -68,6 +79,106 @@ function editResources() {
$("#resourcesEditor").dialog({width: fitContent()});
}
function changeName(resource, name, line) {
resource.name = line.dataset.name = name;
}
function changeCategory(resource, line, el) {
const categories = [...new Set(pack.resources.map(r => r.category))].sort();
const categoryOptions = category => categories.map(c => `<option ${c === category ? "selected" : ""} value="${c}">${c}</option>`).join("");
alertMessage.innerHTML = `
<div style="margin-bottom:.2em" data-tip="Select category from the list">
<div style="display: inline-block; width: 9em">Select category:</div>
<select style="width: 9em" id="resouceCategorySelect">${categoryOptions(line.dataset.category)}</select>
</div>
<div style="margin-bottom:.2em" data-tip="Type new category name">
<div style="display: inline-block; width: 9em">Custom category:</div>
<input style="width: 9em" id="resouceCategoryAdd" placeholder="Category name" />
</div>
`;
$("#alert").dialog({resizable: false, title: "Change category",
buttons: {
Cancel: function() {$(this).dialog("close");},
Apply: function() {applyChanges(); $(this).dialog("close");}
}
});
function applyChanges() {
const custom = document.getElementById("resouceCategoryAdd").value;
const select = document.getElementById("resouceCategorySelect").value;
const category = custom ? capitalize(custom) : select;
resource.category = line.dataset.category = el.innerHTML = category;
}
}
function changeModel(resource, line, el) {
const defaultModels = Resources.defaultModels;
const model = line.dataset.model;
const modelOptions = Object.keys(defaultModels).map(m => `<option ${m === model ? "selected" : ""} value="${m}">${m.replaceAll("_", " ")}</option>`).join("");
const wikiURL = "https://github.com/Azgaar/Fantasy-Map-Generator/wiki/Resources:-spread-functions";
alertMessage.innerHTML = `
<fieldset data-tip="Select one of the predefined spread models from the list" style="border: 1px solid #999; margin-bottom: 1em">
<legend>Predefined models</legend>
<div style="margin-bottom:.2em">
<div style="display: inline-block; width: 6em">Name:</div>
<select onchange="resouceModelFunction.innerHTML = Resources.defaultModels[this.value]" style="width: 14em" id="resouceModelSelect">${modelOptions}</select>
</div>
<div style="margin-bottom:.2em">
<div style="display: inline-block; width: 6em">Function:</div>
<div style="display: inline-block; width: 14em; font-family: monospace" id="resouceModelFunction">${defaultModels[model]}</div>
</div>
</fieldset>
<fieldset data-tip="Advanced option. Define custom spread model, click on 'Help' for details" style="border: 1px solid #999">
<legend>Custom model</legend>
<div style="margin-bottom:.2em">
<div style="display: inline-block; width: 6em">Name:</div>
<input style="width: 14em" id="resouceModelCustomName" />
</div>
<div>
<div style="display: inline-block; width: 6em">Function:</div>
<input style="width: 14em" id="resouceModelCustomFunction" />
</div>
</fieldset>
<div id="resourceModelMessage" style="color: #b20000; margin: .4em 1em 0"></div>
`;
$("#alert").dialog({resizable: false, title: "Change spread model",
buttons: {
Help: () => openURL(wikiURL),
Cancel: function() {$(this).dialog("close");},
Apply: function() {applyChanges(this);}
}
});
function applyChanges(dialog) {
const customName = document.getElementById("resouceModelCustomName").value;
const customFn = document.getElementById("resouceModelCustomFunction").value;
const message = document.getElementById("resourceModelMessage");
if (customName && !customFn) return message.innerHTML = "Error. Custom model function is required";
if (!customName && customFn) return message.innerHTML = "Error. Custom model name is required";
message.innerHTML = "";
if (customName && customFn) {
resource.model = line.dataset.model = el.innerHTML = customName;
resource.custom = customFn;
return;
}
const model = document.getElementById("resouceModelSelect").value;
resource.model = line.dataset.model = el.innerHTML = model;
$(dialog).dialog("close");
}
}
function resourceChangeColor() {
const circle = this.querySelector("circle");
const resource = Resources.get(+this.parentNode.dataset.id);