diff --git a/index.css b/index.css index 6d121555..848d8420 100644 --- a/index.css +++ b/index.css @@ -1396,7 +1396,7 @@ div.totalLine > div { } div.states > input { - width: 6em; + width: 7em; background: none; border: 0; } @@ -1405,20 +1405,11 @@ div.states div { width: 3.2em; } -div.states .statePower, div.states .biomeHabitability { width: 4em; -moz-appearance: textfield; } -div.states .stateBurgs { - width: 2.4em; -} - -div.states > .stateArea { - width: 5em; -} - div.states > .statePopulation { width: 3em; } @@ -1471,7 +1462,7 @@ div.states > .culturePopulation { } div.states > select { - width: 4.6em; + width: 7em; cursor: pointer; border: 0; background-color: transparent; diff --git a/index.html b/index.html index 6f1aed90..b1238018 100644 --- a/index.html +++ b/index.html @@ -107,7 +107,7 @@ } } - + @@ -3083,110 +3083,6 @@ -
Total population: ${l(total)} ⇒ ${l(total)} (100%)
`; + + const update = function () { + const totalNew = ruralPop.valueAsNumber + urbanPop.valueAsNumber; + if (isNaN(totalNew)) return; + totalPop.innerHTML = l(totalNew); + totalPopPerc.innerHTML = rn((totalNew / total) * 100); + }; + + ruralPop.oninput = () => update(); + urbanPop.oninput = () => update(); + + $("#alert").dialog({ + resizable: false, + title: "Change state population", + width: "24em", + buttons: { + Apply: function () { + applyPopulationChange(); + $(this).dialog("close"); + }, + Cancel: function () { + $(this).dialog("close"); + } + }, + position: {my: "center", at: "center", of: "svg"} + }); + + function applyPopulationChange() { + const ruralChange = ruralPop.value / rural; + if (isFinite(ruralChange) && ruralChange !== 1) { + const cells = pack.cells.i.filter(i => pack.cells.state[i] === state); + cells.forEach(i => (pack.cells.pop[i] *= ruralChange)); + } + if (!isFinite(ruralChange) && +ruralPop.value > 0) { + const points = ruralPop.value / populationRate; + const cells = pack.cells.i.filter(i => pack.cells.state[i] === state); + const pop = points / cells.length; + cells.forEach(i => (pack.cells.pop[i] = pop)); + } + + const urbanChange = urbanPop.value / urban; + if (isFinite(urbanChange) && urbanChange !== 1) { + const burgs = pack.burgs.filter(b => !b.removed && b.state === state); + burgs.forEach(b => (b.population = rn(b.population * urbanChange, 4))); + } + if (!isFinite(urbanChange) && +urbanPop.value > 0) { + const points = urbanPop.value / populationRate / urbanization; + const burgs = pack.burgs.filter(b => !b.removed && b.state === state); + const population = rn(points / burgs.length, 4); + burgs.forEach(b => (b.population = population)); + } + + refreshStatesEditor(); + } +} + +function stateCapitalZoomIn(state) { + const capital = pack.states[state].capital; + const l = burgLabels.select("[data-id='" + capital + "']"); + const x = +l.attr("x"), + y = +l.attr("y"); + zoomTo(x, y, 8, 2000); +} + +function stateChangeCulture(state, line, value) { + line.dataset.base = pack.states[state].culture = +value; +} + +function stateChangeType(state, line, value) { + line.dataset.type = pack.states[state].type = value; + recalculateStates(); +} + +function stateChangeExpansionism(state, line, value) { + line.dataset.expansionism = pack.states[state].expansionism = value; + recalculateStates(); +} + +function toggleFog(state, cl) { + if (customization) return; + const path = statesBody.select("#state" + state).attr("d"), + id = "focusState" + state; + cl.contains("inactive") ? fog(id, path) : unfog(id); + cl.toggle("inactive"); +} + +function stateRemovePrompt(state) { + if (customization) return; + + alertMessage.innerHTML = "Are you sure you want to remove the state?Total population: ${l(total)} ⇒ ${l(total)} (100%)
`; - - const update = function () { - const totalNew = ruralPop.valueAsNumber + urbanPop.valueAsNumber; - if (isNaN(totalNew)) return; - totalPop.innerHTML = l(totalNew); - totalPopPerc.innerHTML = rn((totalNew / total) * 100); - }; - - ruralPop.oninput = () => update(); - urbanPop.oninput = () => update(); - - $("#alert").dialog({ - resizable: false, - title: "Change state population", - width: "24em", - buttons: { - Apply: function () { - applyPopulationChange(); - $(this).dialog("close"); - }, - Cancel: function () { - $(this).dialog("close"); - } - }, - position: {my: "center", at: "center", of: "svg"} - }); - - function applyPopulationChange() { - const ruralChange = ruralPop.value / rural; - if (isFinite(ruralChange) && ruralChange !== 1) { - const cells = pack.cells.i.filter(i => pack.cells.state[i] === state); - cells.forEach(i => (pack.cells.pop[i] *= ruralChange)); - } - if (!isFinite(ruralChange) && +ruralPop.value > 0) { - const points = ruralPop.value / populationRate; - const cells = pack.cells.i.filter(i => pack.cells.state[i] === state); - const pop = points / cells.length; - cells.forEach(i => (pack.cells.pop[i] = pop)); - } - - const urbanChange = urbanPop.value / urban; - if (isFinite(urbanChange) && urbanChange !== 1) { - const burgs = pack.burgs.filter(b => !b.removed && b.state === state); - burgs.forEach(b => (b.population = rn(b.population * urbanChange, 4))); - } - if (!isFinite(urbanChange) && +urbanPop.value > 0) { - const points = urbanPop.value / populationRate / urbanization; - const burgs = pack.burgs.filter(b => !b.removed && b.state === state); - const population = rn(points / burgs.length, 4); - burgs.forEach(b => (b.population = population)); - } - - refreshStatesEditor(); - } - } - - function stateCapitalZoomIn(state) { - const capital = pack.states[state].capital; - const l = burgLabels.select("[data-id='" + capital + "']"); - const x = +l.attr("x"), - y = +l.attr("y"); - zoomTo(x, y, 8, 2000); - } - - function stateChangeCulture(state, line, value) { - line.dataset.base = pack.states[state].culture = +value; - } - - function stateChangeType(state, line, value) { - line.dataset.type = pack.states[state].type = value; - recalculateStates(); - } - - function stateChangeExpansionism(state, line, value) { - line.dataset.expansionism = pack.states[state].expansionism = value; - recalculateStates(); - } - - function toggleFog(state, cl) { - if (customization) return; - const path = statesBody.select("#state" + state).attr("d"), - id = "focusState" + state; - cl.contains("inactive") ? fog(id, path) : unfog(id); - cl.toggle("inactive"); - } - - function stateRemovePrompt(state) { - if (customization) return; - - alertMessage.innerHTML = "Are you sure you want to remove the state?