options: load and save params

This commit is contained in:
He4eT 2024-08-15 20:47:15 +02:00
commit 48a86cea74
3 changed files with 88 additions and 11 deletions

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Example</title>
<title>Milje 2077 Settings</title>
<style>
.form {
width: 100%;
@ -37,15 +37,15 @@
<div class="form-group">
<label for="randomSeed">
<strong>Pattern Seed</strong>
<small>Set to 0 for the "random" seed</small>
<small>Set to 0 for the "random" seed (Default: 0)</small>
</label>
<input type="number" id="randomSeed" name="randomSeed" min="1" step="1" required>
<input type="number" id="randomSeed" name="randomSeed" min="0" step="1" required>
</div>
<div class="form-group">
<label for="halfPatternSize">
<strong>Pattern Size</strong>
<small>The pattern will be mirrored horizontally and vertically</small>
<small>The pattern will be mirrored horizontally and vertically (Default: 16)</small>
</label>
<input type="number" id="halfPatternSize" name="halfPatternSize" min="1" step="1" required>
</div>
@ -53,7 +53,7 @@
<div class="form-group">
<label for="scaleFactor">
<strong>Scale Factor</strong>
<small>Size of the smallest dot in the pattern</small>
<small>Size of the smallest dot in the pattern (Default: 16)</small>
</label>
<input type="number" id="scaleFactor" name="scaleFactor" min="1" step="1" required>
</div>
@ -61,7 +61,7 @@
<div class="form-group">
<label for="gridSize">
<strong>Grid Size</strong>
<small>Additional grid for the pattern</small>
<small>Additional grid for the pattern (Default: 3)</small>
</label>
<input type="number" id="gridSize" name="gridSize" min="1" step="1" required>
</div>
@ -69,7 +69,7 @@
<div class="form-group">
<label for="density">
<strong>Density</strong>
<small>Probability of holes</small>
<small>Probability of holes (Default: 0.5)</small>
</label>
<input type="number" id="densityValue" name="densityValue" min="0" max="1" step="0.1" required>
<input type="range" id="density" name="density" min="0" max="1" step="0.1" value="0" class="color-slider">
@ -80,7 +80,7 @@
<div class="form-group">
<label for="red">
<strong>Red</strong>
<small></small>
<small>(Default: 255)</small>
</label>
<input type="number" id="redValue" name="redValue" min="0" max="255" value="0" step="1">
<input type="range" id="red" name="red" min="0" max="255" value="0" class="color-slider">
@ -89,7 +89,7 @@
<div class="form-group">
<label for="green">
<strong>Green</strong>
<small></small>
<small>(Default: 255)</small>
</label>
<input type="number" id="greenValue" name="greenValue" min="0" max="255" value="0" step="1">
<input type="range" id="green" name="green" min="0" max="255" value="0" class="color-slider">
@ -98,7 +98,7 @@
<div class="form-group">
<label for="blue">
<strong>Blue</strong>
<small></small>
<small>(Default: 255)</small>
</label>
<input type="number" id="blueValue" name="blueValue" min="0" max="255" value="0" step="1">
<input type="range" id="blue" name="blue" min="0" max="255" value="0" class="color-slider">