feat(religions): editor UX update and cleanup, increase religions number to generate

This commit is contained in:
Azgaar 2023-03-21 22:41:50 +04:00
parent 218887b435
commit 12fad8fd8f
3 changed files with 96 additions and 88 deletions

View file

@ -30,7 +30,7 @@ function insertEditorHtml() {
<div data-tip="Click to sort by supreme deity" class="sortable alphabetically hide" data-sortby="deity">Supreme Deity&nbsp;</div> <div data-tip="Click to sort by supreme deity" class="sortable alphabetically hide" data-sortby="deity">Supreme Deity&nbsp;</div>
<div data-tip="Click to sort by religion area" class="sortable hide" data-sortby="area">Area&nbsp;</div> <div data-tip="Click to sort by religion area" class="sortable hide" data-sortby="area">Area&nbsp;</div>
<div data-tip="Click to sort by number of believers (religion area population)" class="sortable hide" data-sortby="population">Believers&nbsp;</div> <div data-tip="Click to sort by number of believers (religion area population)" class="sortable hide" data-sortby="population">Believers&nbsp;</div>
<div data-tip="Click to sort by potential extent type" class="sortable hide" data-sortby="expansion">Potential&nbsp;</div> <div data-tip="Click to sort by potential extent type" class="sortable alphabetically hide" data-sortby="expansion">Potential&nbsp;</div>
<div data-tip="Click to sort by expansionism" class="sortable hide" data-sortby="expansionism">Expansion&nbsp;</div> <div data-tip="Click to sort by expansionism" class="sortable hide" data-sortby="expansionism">Expansion&nbsp;</div>
</div> </div>
<div id="religionsBody" class="table" data-type="absolute"></div> <div id="religionsBody" class="table" data-type="absolute"></div>
@ -280,15 +280,18 @@ function getTypeOptions(type) {
} }
function getExpansionColumns(r) { function getExpansionColumns(r) {
if (r.type === "Folk") if (r.type === "Folk") {
const tip =
"Folk religions are not competitive and do not expand. Initially they cover all cells of their parent culture, but get ousted by organized religions when they expand";
return /* html */ ` return /* html */ `
<span class="icon-resize-full-alt placeholder hide" style="padding-right: 2px"></span> <span data-tip="${tip}" class="icon-resize-full-alt hide" style="padding-right: 2px"></span>
<span data-tip="Potential religion extent" class="religionExtent hide" style="width: 5em">culture</span> <span data-tip="${tip}" class="religionExtent hide" style="width: 5em">culture</span>
<span class="icon-resize-full placeholder hide"></span> <span data-tip="${tip}" class="icon-resize-full hide"></span>
<input class="religionExpantion placeholder hide" type="number" />`; <input data-tip="${tip}" class="religionExpantion hide" disabled type="number" value='0' />`;
}
return /* html */ ` return /* html */ `
<span class="icon-resize-full-alt hide" style="padding-right: 2px"></span> <span data-tip="Potential religion extent" class="icon-resize-full-alt hide" style="padding-right: 2px"></span>
<select data-tip="Potential religion extent" class="religionExtent hide" style="width: 5em"> <select data-tip="Potential religion extent" class="religionExtent hide" style="width: 5em">
${getExtentOptions(r.expansion)} ${getExtentOptions(r.expansion)}
</select> </select>

View file

@ -363,21 +363,19 @@ window.Religions = (function () {
const expansionismMap = { const expansionismMap = {
Folk: () => 0, Folk: () => 0,
Organized: () => gauss(5, 3, 0, 10, 1), // was rand(3, 8) Organized: () => gauss(5, 3, 0, 10, 1),
Cult: () => gauss(0.5, 0.5, 0, 5, 1), // was gauss(1.1, 0.5, 0, 5) Cult: () => gauss(0.5, 0.5, 0, 5, 1),
Heresy: () => gauss(1, 0.5, 0, 5, 1) // was gauss(1.2, 0.5, 0, 5) Heresy: () => gauss(1, 0.5, 0, 5, 1)
}; };
function generate() { function generate() {
TIME && console.time("generateReligions"); TIME && console.time("generateReligions");
// const {cells, states, cultures, burgs} = pack; const lockedReligions = pack.religions?.filter(religion => r.i && religion.lock && !religion.removed) || [];
const lockedReligions = pack.religions?.filter(religion => religion.lock && !religion.removed) || [];
const folkReligions = generateFolkReligions(); const folkReligions = generateFolkReligions();
const basicReligions = generateOrganizedReligions(+religionsInput.value, lockedReligions); const organizedReligions = generateOrganizedReligions(+religionsInput.value, lockedReligions);
const namedReligions = specifyReligions([...folkReligions, ...basicReligions]); const namedReligions = specifyReligions([...folkReligions, ...organizedReligions]);
const indexedReligions = combineReligions(namedReligions, lockedReligions); const indexedReligions = combineReligions(namedReligions, lockedReligions);
const religionIds = expandReligions(indexedReligions); const religionIds = expandReligions(indexedReligions);
const religions = defineOrigins(religionIds, indexedReligions); const religions = defineOrigins(religionIds, indexedReligions);
@ -388,15 +386,12 @@ window.Religions = (function () {
checkCenters(); checkCenters();
TIME && console.timeEnd("generateReligions"); TIME && console.timeEnd("generateReligions");
}; }
function generateFolkReligions() { function generateFolkReligions() {
return pack.cultures.filter(c => c.i && !c.removed).map(culture => { return pack.cultures
const {i: culutreId, center} = culture; .filter(c => c.i && !c.removed)
const form = rw(forms.Folk); .map(culture => ({type: "Folk", form: rw(forms.Folk), culture: culture.i, center: culture.center}));
return {type:"Folk", form, culture: culutreId, center};
});
} }
function generateOrganizedReligions(desiredReligionNumber, lockedReligions) { function generateOrganizedReligions(desiredReligionNumber, lockedReligions) {
@ -408,11 +403,11 @@ window.Religions = (function () {
const candidateCells = getCandidateCells(); const candidateCells = getCandidateCells();
const religionCores = placeReligions(); const religionCores = placeReligions();
const cultsCount = Math.floor((rand(1, 4) / 10) * religionCores.length); // 10 - 40% const cultsCount = Math.floor((rand(1, 4) / 10) * religionCores.length); // 10-40%
const heresiesCount = Math.floor((rand(0, 2) / 10) * religionCores.length); // 0 - 20%, was gauss(0,1, 0,3) per organized with expansionism >= 3 const heresiesCount = Math.floor((rand(0, 3) / 10) * religionCores.length); // 0-30%
const organizedCount = religionCores.length - cultsCount - heresiesCount; const organizedCount = religionCores.length - cultsCount - heresiesCount;
const getType = (index) => { const getType = index => {
if (index < organizedCount) return "Organized"; if (index < organizedCount) return "Organized";
if (index < organizedCount + cultsCount) return "Cult"; if (index < organizedCount + cultsCount) return "Cult";
return "Heresy"; return "Heresy";
@ -434,14 +429,14 @@ window.Religions = (function () {
lockedReligions.forEach(({center}) => religionsTree.add(cells.p[center])); lockedReligions.forEach(({center}) => religionsTree.add(cells.p[center]));
// min distance between religion inceptions // min distance between religion inceptions
const spacing = (graphWidth + graphHeight) / 2 / desiredReligionNumber; // was major gauss(1,0.3, 0.2,2, 2) / 6; cult gauss(2,0.3, 1,3, 2) /6; heresy /60 const spacing = (graphWidth + graphHeight) / 2 / desiredReligionNumber;
for (const cellId of candidateCells) { // was biased random major ^5, cult ^1 for (const cellId of candidateCells) {
const [x, y] = cells.p[cellId]; const [x, y] = cells.p[cellId];
if (religionsTree.find(x, y, spacing) === undefined) { if (religionsTree.find(x, y, spacing) === undefined) {
religionCells.push(cellId); religionCells.push(cellId);
religionsTree.add([x,y]); religionsTree.add([x, y]);
if (religionCells.length === requiredReligionsNumber) return religionCells; if (religionCells.length === requiredReligionsNumber) return religionCells;
} }
@ -456,7 +451,7 @@ window.Religions = (function () {
if (validBurgs.length >= requiredReligionsNumber) if (validBurgs.length >= requiredReligionsNumber)
return validBurgs.sort((a, b) => b.population - a.population).map(burg => burg.cell); return validBurgs.sort((a, b) => b.population - a.population).map(burg => burg.cell);
return cells.i.filter(i=> cells.s[i] > 2).sort((a, b) => cells.s[b] - cells.s[a]); return cells.i.filter(i => cells.s[i] > 2).sort((a, b) => cells.s[b] - cells.s[a]);
} }
} }
@ -493,11 +488,13 @@ window.Religions = (function () {
// indexes, conditionally renames, and abbreviates religions // indexes, conditionally renames, and abbreviates religions
function combineReligions(namedReligions, lockedReligions) { function combineReligions(namedReligions, lockedReligions) {
const noReligion = {i: 0, name: "No religion"}; const indexedReligions = [{name: "No religion", i: 0}];
const indexedReligions = [noReligion];
const {lockedReligionQueue, highestLockedIndex, codes, numberLockedFolk} = parseLockedReligions(); const {lockedReligionQueue, highestLockedIndex, codes, numberLockedFolk} = parseLockedReligions();
const maxIndex = Math.max(highestLockedIndex, namedReligions.length + lockedReligions.length + 1 - numberLockedFolk); const maxIndex = Math.max(
highestLockedIndex,
namedReligions.length + lockedReligions.length + 1 - numberLockedFolk
);
for (let index = 1, progress = 0; index < maxIndex; index = indexedReligions.length) { for (let index = 1, progress = 0; index < maxIndex; index = indexedReligions.length) {
// place locked religion back at its old index // place locked religion back at its old index
@ -506,13 +503,17 @@ window.Religions = (function () {
indexedReligions.push(nextReligion); indexedReligions.push(nextReligion);
continue; continue;
} }
// slot the new religions // slot the new religions
if (progress < namedReligions.length) { if (progress < namedReligions.length) {
const nextReligion = namedReligions[progress]; const nextReligion = namedReligions[progress];
progress++; progress++;
if (nextReligion.type === "Folk" && lockedReligions.some(
({type, culture}) => type === "Folk" && culture === nextReligion.culture if (
)) continue; // when there is a locked Folk religion for this culture discard duplicate nextReligion.type === "Folk" &&
lockedReligions.some(({type, culture}) => type === "Folk" && culture === nextReligion.culture)
)
continue; // when there is a locked Folk religion for this culture discard duplicate
const newName = renameOld(nextReligion); const newName = renameOld(nextReligion);
const code = abbreviate(newName, codes); const code = abbreviate(newName, codes);
@ -520,20 +521,23 @@ window.Religions = (function () {
indexedReligions.push({...nextReligion, i: index, name: newName, code}); indexedReligions.push({...nextReligion, i: index, name: newName, code});
continue; continue;
} }
indexedReligions.push({i: index, type: "Folk", culture: 0, name: "Padding", removed: true});
indexedReligions.push({i: index, type: "Folk", culture: 0, name: "Removed religion", removed: true});
} }
return indexedReligions; return indexedReligions;
function parseLockedReligions() { function parseLockedReligions() {
// copy and sort the locked religions list // copy and sort the locked religions list
const lockedReligionQueue = lockedReligions.map(religion => { const lockedReligionQueue = lockedReligions
// and filter their origins to locked religions .map(religion => {
let newOrigin = religion.origins.filter(n => lockedReligions.some(({i: index}) => index === n)); // and filter their origins to locked religions
if (newOrigin === []) newOrigin = [0]; let newOrigin = religion.origins.filter(n => lockedReligions.some(({i: index}) => index === n));
return {...religion, origins: newOrigin}; if (newOrigin === []) newOrigin = [0];
}).sort((a, b) => a.i - b.i); return {...religion, origins: newOrigin};
})
.sort((a, b) => a.i - b.i);
const highestLockedIndex = Math.max(...(lockedReligions.map(r => r.i))); const highestLockedIndex = Math.max(...lockedReligions.map(r => r.i));
const codes = lockedReligions.length > 0 ? lockedReligions.map(r => r.code) : []; const codes = lockedReligions.length > 0 ? lockedReligions.map(r => r.code) : [];
const numberLockedFolk = lockedReligions.filter(({type}) => type === "Folk").length; const numberLockedFolk = lockedReligions.filter(({type}) => type === "Folk").length;
@ -544,9 +548,13 @@ window.Religions = (function () {
function renameOld({name, type, culture: cultureId}) { function renameOld({name, type, culture: cultureId}) {
if (type !== "Folk") return name; if (type !== "Folk") return name;
const haveOrganized = namedReligions.some( const haveOrganized =
({type, culture, expansion}) => culture === cultureId && type === "Organized" && expansion === "culture") namedReligions.some(
|| lockedReligions.some(({type, culture, expansion}) => culture === cultureId && type === "Organized" && expansion === "culture"); ({type, culture, expansion}) => culture === cultureId && type === "Organized" && expansion === "culture"
) ||
lockedReligions.some(
({type, culture, expansion}) => culture === cultureId && type === "Organized" && expansion === "culture"
);
if (haveOrganized && name.slice(0, 3) !== "Old") return `Old ${name}`; if (haveOrganized && name.slice(0, 3) !== "Old") return `Old ${name}`;
return name; return name;
} }
@ -555,36 +563,28 @@ window.Religions = (function () {
// finally generate and stores origins trees // finally generate and stores origins trees
function defineOrigins(religionIds, indexedReligions) { function defineOrigins(religionIds, indexedReligions) {
const religionOriginsParamsMap = { const religionOriginsParamsMap = {
Organized: {clusterSize: 100, maxReligions: 2}, // was 150/count, 2 Organized: {clusterSize: 100, maxReligions: 2},
Cult: {clusterSize: 50, maxReligions: 3}, // was 300/count, rand(0,4) Cult: {clusterSize: 50, maxReligions: 3},
Heresy: {clusterSize: 50, maxReligions: 4} Heresy: {clusterSize: 50, maxReligions: 4}
}; };
const origins = indexedReligions.map((religion, index) => { const origins = indexedReligions.map(({i, type, culture: cultureId, expansion, center}) => {
if (religion.type === "Folk") return [0]; if (i === 0) return null; // no religion
if (index === 0) return null; if (type === "Folk") return [0]; // folk religions originate from its parent culture only
const {i, type, culture: cultureId, expansion, center} = religion;
const folkReligion = indexedReligions.find(({culture, type}) => type === "Folk" && culture === cultureId); const folkReligion = indexedReligions.find(({culture, type}) => type === "Folk" && culture === cultureId);
const isFolkBased = folkReligion && cultureId && expansion === "culture" && each(2)(center); // P(0.5) -> isEven cellId const isFolkBased = folkReligion && cultureId && expansion === "culture" && each(2)(center);
if (isFolkBased) return [folkReligion.i]; if (isFolkBased) return [folkReligion.i];
const {clusterSize, maxReligions} = religionOriginsParamsMap[type]; const {clusterSize, maxReligions} = religionOriginsParamsMap[type];
const origins = getReligionsInRadius(pack.cells.c, center, religionIds, i, clusterSize, maxReligions); const fallbackOrigin = folkReligion?.i || 0;
return getReligionsInRadius(pack.cells.c, center, religionIds, i, clusterSize, maxReligions, fallbackOrigin);
if (origins === [0]) return [folkReligion.i]; // hegemony has local roots
return origins;
}); });
return indexedReligions.map((religion, index) => ({ return indexedReligions.map((religion, index) => ({...religion, origins: origins[index]}));
...religion,
origins: origins[index]
}));
} }
function getReligionsInRadius(neighbors, center, religionIds, religionId, clusterSize, maxReligions) { function getReligionsInRadius(neighbors, center, religionIds, religionId, clusterSize, maxReligions, fallbackOrigin) {
const foundReligions = new Set(); const foundReligions = new Set();
const queue = [center]; const queue = [center];
const checked = {}; const checked = {};
@ -599,11 +599,12 @@ window.Religions = (function () {
const neibReligion = religionIds[neibId]; const neibReligion = religionIds[neibId];
if (neibReligion && neibReligion !== religionId) foundReligions.add(neibReligion); if (neibReligion && neibReligion !== religionId) foundReligions.add(neibReligion);
if (foundReligions.size >= maxReligions) return [...foundReligions];
queue.push(neibId); queue.push(neibId);
} }
} }
return foundReligions.size ? [...foundReligions].slice(0, maxReligions) : [0]; return foundReligions.size ? [...foundReligions] : [fallbackOrigin];
} }
// growth algorithm to assign cells to religions // growth algorithm to assign cells to religions
@ -616,7 +617,7 @@ window.Religions = (function () {
const maxExpansionCost = (cells.i.length / 20) * neutralInput.value; // limit cost for organized religions growth (was /25, heresy /10) const maxExpansionCost = (cells.i.length / 20) * neutralInput.value; // limit cost for organized religions growth (was /25, heresy /10)
const biomePassageCost = (cellId) => biomesData.cost[cells.biome[cellId]]; const biomePassageCost = cellId => biomesData.cost[cells.biome[cellId]];
religions religions
.filter(r => r.i && !r.lock && r.type !== "Folk" && !r.removed) .filter(r => r.i && !r.lock && r.type !== "Folk" && !r.removed)
@ -628,10 +629,10 @@ window.Religions = (function () {
const religionsMap = new Map(religions.map(r => [r.i, r])); const religionsMap = new Map(religions.map(r => [r.i, r]));
const isMainRoad = (cellId) => (cells.road[cellId] - cells.crossroad[cellId]) > 4; const isMainRoad = cellId => cells.road[cellId] - cells.crossroad[cellId] > 4;
const isTrail = (cellId) => cells.h[cellId] > 19 && (cells.road[cellId] - cells.crossroad[cellId]) === 1; const isTrail = cellId => cells.h[cellId] > 19 && cells.road[cellId] - cells.crossroad[cellId] === 1;
const isSeaRoute = (cellId) => cells.h[cellId] < 20 && cells.road[cellId]; const isSeaRoute = cellId => cells.h[cellId] < 20 && cells.road[cellId];
const isWater = (cellId) => cells.h[cellId] < 20; const isWater = cellId => cells.h[cellId] < 20;
// const popCost = d3.max(cells.pop) / 3; // enougth population to spered religion without penalty // const popCost = d3.max(cells.pop) / 3; // enougth population to spered religion without penalty
while (queue.length) { while (queue.length) {
@ -668,7 +669,7 @@ window.Religions = (function () {
if (isWater(cellId)) return isSeaRoute ? 50 : 500; // was 50 : 1000 if (isWater(cellId)) return isSeaRoute ? 50 : 500; // was 50 : 1000
if (isMainRoad(cellId)) return 1; if (isMainRoad(cellId)) return 1;
const biomeCost = biomePassageCost(cellId); const biomeCost = biomePassageCost(cellId);
return (isTrail(cellId)) ? biomeCost / 1.5 : biomeCost; // was same as main road return isTrail(cellId) ? biomeCost / 1.5 : biomeCost; // was same as main road
} }
} }
@ -719,19 +720,23 @@ window.Religions = (function () {
const religionId = cells.religion[center]; const religionId = cells.religion[center];
const cultureId = cells.culture[center]; const cultureId = cells.culture[center];
const missingFolk = cultureId !== 0 && !religions.some(({type, culture, removed}) => type === "Folk" && culture === cultureId && !removed); const missingFolk =
const color = missingFolk ? cultures[cultureId].color cultureId !== 0 &&
: getMixedColor(religions[religionId].color, 0.3, 0); !religions.some(({type, culture, removed}) => type === "Folk" && culture === cultureId && !removed);
const color = missingFolk ? cultures[cultureId].color : getMixedColor(religions[religionId].color, 0.3, 0);
const type = const type = missingFolk
missingFolk ? "Folk" : ? "Folk"
religions[religionId].type === "Organized" ? rw({Organized: 4, Cult: 1, Heresy: 2}) : religions[religionId].type === "Organized"
? rw({Organized: 4, Cult: 1, Heresy: 2})
: rw({Organized: 5, Cult: 2}); : rw({Organized: 5, Cult: 2});
const form = rw(forms[type]); const form = rw(forms[type]);
const deity = const deity =
type === "Heresy" ? religions[religionId].deity : type === "Heresy"
(form === "Non-theism" || form === "Animism") ? null ? religions[religionId].deity
: getDeityName(cultureId); : form === "Non-theism" || form === "Animism"
? null
: getDeityName(cultureId);
const [name, expansion] = generateReligionName(type, form, deity, center); const [name, expansion] = generateReligionName(type, form, deity, center);
@ -740,7 +745,7 @@ window.Religions = (function () {
name, name,
religions.map(r => r.code) religions.map(r => r.code)
); );
const influences = getReligionsInRadius(cells.c, center, cells.religion, 0, 25, 3); const influences = getReligionsInRadius(cells.c, center, cells.religion, 0, 25, 3, 0);
const origins = type === "Folk" ? [0] : influences; const origins = type === "Folk" ? [0] : influences;
const i = religions.length; const i = religions.length;

View file

@ -537,7 +537,7 @@ function applyStoredOptions() {
options.stateLabelsMode = stateLabelsModeInput.value; options.stateLabelsMode = stateLabelsModeInput.value;
} }
// randomize options if randomization is allowed (not locked or options='default') // randomize options if randomization is allowed (not locked or queryParam options='default')
function randomizeOptions() { function randomizeOptions() {
const randomize = new URL(window.location.href).searchParams.get("options") === "default"; // ignore stored options const randomize = new URL(window.location.href).searchParams.get("options") === "default"; // ignore stored options
@ -549,7 +549,7 @@ function randomizeOptions() {
manorsInput.value = 1000; manorsInput.value = 1000;
manorsOutput.value = "auto"; manorsOutput.value = "auto";
} }
if (randomize || !locked("religions")) religionsInput.value = religionsOutput.value = gauss(5, 2, 2, 10); if (randomize || !locked("religions")) religionsInput.value = religionsOutput.value = gauss(6, 3, 2, 10);
if (randomize || !locked("power")) powerInput.value = powerOutput.value = gauss(4, 2, 0, 10, 2); if (randomize || !locked("power")) powerInput.value = powerOutput.value = gauss(4, 2, 0, 10, 2);
if (randomize || !locked("neutral")) neutralInput.value = neutralOutput.value = rn(1 + Math.random(), 1); if (randomize || !locked("neutral")) neutralInput.value = neutralOutput.value = rn(1 + Math.random(), 1);
if (randomize || !locked("cultures")) culturesInput.value = culturesOutput.value = gauss(12, 3, 5, 30); if (randomize || !locked("cultures")) culturesInput.value = culturesOutput.value = gauss(12, 3, 5, 30);