Verify inputs, limit ranges

This commit is contained in:
Wuzzy 2023-10-27 14:35:41 +02:00
parent 828b99c243
commit 588acba140
2 changed files with 71 additions and 50 deletions

View File

@ -65,9 +65,9 @@ A Voronoi diagram is supposed to be here but for some reason it cannot be displa
<br>
<label for="inputHeat">Heat:&nbsp;</label>
<input id="inputHeat" type="number" value="50" step="1" size="10">
<input id="inputHeat" type="number" value="50" step="1" size="10" min="-1e7" max="1e7">
<label for="inputHumidity">Humidity:&nbsp;</label>
<input id="inputHumidity" type="number" value="50" step="1" size="10">
<input id="inputHumidity" type="number" value="50" step="1" size="10" min="-1e7" max="1e7">
<br>
@ -110,29 +110,29 @@ A Voronoi diagram is supposed to be here but for some reason it cannot be displa
<form id="noiseForm">
<h3>Heat (<code>mg_biome_np_heat</code>)</h3>
<label for="inputNoiseHeatOffset">Offset:&nbsp;</label>
<input id="inputNoiseHeatOffset" type="number" value="50" size="10">
<input id="inputNoiseHeatOffset" type="number" value="50" size="10" min="-1e7" max="1e7">
<label for="inputNoiseHeatScale">Scale:&nbsp;</label>
<input id="inputNoiseHeatScale" type="number" value="50" size="10">
<input id="inputNoiseHeatScale" type="number" value="50" size="10" min="-1e7" max="1e7">
<label for="inputNoiseHeatOctaves">Octaves:&nbsp;</label>
<input id="inputNoiseHeatOctaves" type="number" value="3" step="1" min="1" max="65535" size="10">
<label for="inputNoiseHeatPersistence">Persistence:&nbsp;</label>
<input id="inputNoiseHeatPersistence" type="number" value="0.5" step=0.1 size="10">
<input id="inputNoiseHeatPersistence" type="number" value="0.5" step=0.1 size="10" min="-1e7" max="1e7">
<h3>Humidity (<code>mg_biome_np_humidity</code>)</h3>
<label for="inputNoiseHumidityOffset">Offset:&nbsp;</label>
<input id="inputNoiseHumidityOffset" type="number" value="50" size="10">
<input id="inputNoiseHumidityOffset" type="number" value="50" size="10" min="-1e7" max="1e7">
<label for="inputNoiseHumidityScale">Scale:&nbsp;</label>
<input id="inputNoiseHumidityScale" type="number" value="50" size="10">
<input id="inputNoiseHumidityScale" type="number" value="50" size="10" min="-1e7" max="1e7">
<label for="inputNoiseHumidityOctaves">Octaves:&nbsp;</label>
<input id="inputNoiseHumidityOctaves" type="number" value="3" step="1" min="1" max="65535" size="10">
<label for="inputNoiseHumidityPersistence">Persistence:&nbsp;</label>
<input id="inputNoiseHumidityPersistence" type="number" value="0.5" step=0.1 size="10">
<input id="inputNoiseHumidityPersistence" type="number" value="0.5" step=0.1 size="10" min="-1e7" max="1e7">
<h3>Reset</h3>
<button id="inputNoiseReset" type="button">Reset noise parameters</button>

105
mibpov.js
View File

@ -16,6 +16,10 @@ const MIN_CANVAS_SIZE = 100;
// Minimum required distance of canvas from the right page side
const CANVAS_PAGE_MARGIN_RIGHT = 20
// Minimum and maximum value for heat and humidity
const MIN_HEAT_HUMIDITY_VALUE = -1e7
const MAX_HEAT_HUMIDITY_VALUE = 1e7
// Grid widths. We use lower grid widths
// as the grid becomes more crammed.
// There are 4 levels from 0 to 3.
@ -101,6 +105,9 @@ let draw_humidity_min, draw_humidity_max;
let midpoint_heat;
let midpoint_humidity;
// Y altitude at which the diagram is currently viewed at
let viewY = 0;
// Biome noise settings
const NOISE_OFFSET_DEFAULT = 50;
const NOISE_SCALE_DEFAULT = 50;
@ -259,12 +266,9 @@ function addBiome(biomeDef) {
draw(true);
}
// Get the Y vale of the widget to set the Y altitude
// Get the Y value of the viewed altitude
function getViewY() {
if (!inputViewY) {
return 0;
}
return inputViewY.value;
return viewY;
}
// Returns the biome point by its given ID
// or null if it couldn't be found
@ -843,6 +847,14 @@ function draw(recalculate) {
return true;
}
// Render a special message if the value range is huge
if ((limit_heat_max - limit_heat_min > MAX_HEAT_HUMIDITY_VALUE) || (limit_humidity_max - limit_humidity_min > MAX_HEAT_HUMIDITY_VALUE)) {
showDiagramMessage(context, "Value range is too large.");
drawError = true;
putResizeCorner(context);
return true;
}
let points = getRenderedPoints(y);
// Render a special message if there are no biomes
if (points.length === 0) {
@ -1256,7 +1268,7 @@ function updatePointWhenDragged(pointID) {
/* Updates the text showing the current altitude (Y height)
the diagram currently applies */
function updateAltitudeText() {
altitudeDisplay.innerHTML = "showing diagram for altitude Y=<span class='statAltitude'>"+inputViewY.value+"</span>";
altitudeDisplay.innerHTML = "showing diagram for altitude Y=<span class='statAltitude'>"+getViewY()+"</span>";
}
@ -1552,8 +1564,12 @@ biomeSelector.onchange = function() {
addBiomeButton.onclick = function() {
// Add a biome at a random position
let he = Math.round(limit_heat_min + Math.random() * (limit_heat_max - limit_heat_min));
let hu = Math.round(limit_humidity_min + Math.random() * (limit_humidity_max - limit_humidity_min));
let he_min = Math.max(MIN_HEAT_HUMIDITY_VALUE, limit_heat_min);
let he_max = Math.min(MAX_HEAT_HUMIDITY_VALUE, limit_heat_max);
let hu_min = Math.max(MIN_HEAT_HUMIDITY_VALUE, limit_heat_min);
let hu_max = Math.min(MAX_HEAT_HUMIDITY_VALUE, limit_heat_max);
let he = Math.round(he_min + Math.random() * (he_max - he_min));
let hu = Math.round(hu_min + Math.random() * (hu_max - hu_min));
addBiome({name: generateBiomeName(lastBiomeID), heat: he, humidity: hu, min_y: MIN_Y_DEFAULT, max_y: MAX_Y_DEFAULT});
}
removeBiomeButton.onclick = function() {
@ -1583,18 +1599,28 @@ removeBiomeButton.onclick = function() {
}
/* Biome editing widgets events */
function handleBiomeNumberInput(biomeValueName, element) {
let val = +element.value;
if (element.value === "" || typeof val !== "number") {
return;
}
if (element.min !== "" && (val < +element.min || val > +element.max)) {
return;
}
onChangeBiomeValueWidget(biomeValueName, val);
}
inputHeat.oninput = function() {
onChangeBiomeValueWidget("heat", +this.value);
handleBiomeNumberInput("heat", this);
}
inputHumidity.oninput = function() {
onChangeBiomeValueWidget("humidity", +this.value);
handleBiomeNumberInput("humidity", this);
}
inputMinY.oninput = function() {
onChangeBiomeValueWidget("min_y", +this.value);
handleBiomeNumberInput("min_y", this);
}
inputMaxY.oninput = function() {
onChangeBiomeValueWidget("max_y", +this.value);
handleBiomeNumberInput("max_y", this);
}
inputBiomeName.oninput = function() {
onChangeBiomeValueWidget("name", this.value);
@ -1603,6 +1629,11 @@ inputBiomeName.oninput = function() {
/* Diagram view settings events */
inputViewY.oninput = function() {
let y = +this.value;
if (y === null) {
return;
}
viewY = Math.floor(y);
draw(true);
updateAltitudeText();
}
@ -1629,53 +1660,43 @@ inputCheckboxAxes.onchange = function() {
/* Noise parameters events */
inputNoiseHeatScale.oninput = function() {
noises.heat.scale = +this.value;
function updateNoiseParam(noiseName, noiseValueName, element) {
if (element.value === "") {
return;
}
let val = +element.value;
if (val < +element.min || val > +element.max) {
return;
}
noises[noiseName][noiseValueName] = val;
clear();
updateAreaVars();
draw(true);
}
inputNoiseHeatScale.oninput = function() {
updateNoiseParam("heat", "scale", this);
}
inputNoiseHeatOffset.oninput = function() {
noises.heat.offset = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("heat", "offset", this);
}
inputNoiseHeatPersistence.oninput = function() {
noises.heat.persistence = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("heat", "persistence", this);
}
inputNoiseHeatOctaves.oninput = function() {
noises.heat.octaves = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("heat", "octaves", this);
}
inputNoiseHumidityScale.oninput = function() {
noises.humidity.scale = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("humidity", "scale", this);
}
inputNoiseHumidityOffset.oninput = function() {
noises.humidity.offset = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("humidity", "offset", this);
}
inputNoiseHumidityPersistence.oninput = function() {
noises.humidity.persistence = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("humidity", "persistence", this);
}
inputNoiseHumidityOctaves.oninput = function() {
noises.humidity.octaves = +this.value;
clear();
updateAreaVars();
draw(true);
updateNoiseParam("humidity", "octaves", this);
}
inputNoiseReset.onclick = function() {
noises.heat.offset = NOISE_OFFSET_DEFAULT;