Skip to content

Commit 3d7a8e6

Browse files
authored
Add initial 3D index.html structure
1 parent ae34d66 commit 3d7a8e6

File tree

1 file changed

+97
-0
lines changed

1 file changed

+97
-0
lines changed

3d/index.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!DOCTYPE html>
2+
<html xmlns="http://www.w3.org/1999/xhtml">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>Fractogenesis — 3D Kernel Space Dynamics</title>
6+
7+
<link rel="stylesheet" href="style.css" />
8+
<script src="cnn3d.js"></script>
9+
</head>
10+
11+
<body>
12+
13+
<div class="panel panel-cyan">
14+
<div class="panel-title">Global parameters</div>
15+
16+
<label>Iterations (3D)
17+
<input type="number" id="iterations" value="6" min="1" max="9" />
18+
</label>
19+
20+
<label>Pixel size
21+
<input type="number" id="pixelSize" value="3" min="1" max="8" />
22+
</label>
23+
24+
<label>Color mode
25+
<select id="colorMode">
26+
<option value="grayscale">Grayscale</option>
27+
<option value="mod4" selected>Black/White (mod 4)</option>
28+
<option value="alleycat">Alley Cat</option>
29+
</select>
30+
</label>
31+
</div>
32+
33+
<div class="panel panel-magenta">
34+
<div class="panel-title">Kernel mode</div>
35+
<div class="pad-switch">
36+
<label>
37+
<input type="radio" name="padmode" value="1" checked="checked" />
38+
pad = 1
39+
</label>
40+
<label>
41+
<input type="radio" name="padmode" value="0" />
42+
pad = 0
43+
</label>
44+
</div>
45+
46+
<button id="refreshBtn">Refresh seed</button>
47+
</div>
48+
49+
<canvas id="myCanvas"></canvas>
50+
51+
<div class="panel panel-cyan kernel-panel">
52+
<div class="panel-title">Symmetric 3×3×3 kernel (4 sliders)</div>
53+
54+
<div class="kslider">
55+
<div class="kslider-title">Corners (8)</div>
56+
<input type="range" id="kCorners" />
57+
</div>
58+
59+
<div class="kslider">
60+
<div class="kslider-title">Edges (12)</div>
61+
<input type="range" id="kEdges" />
62+
</div>
63+
64+
<div class="kslider">
65+
<div class="kslider-title">Faces (6)</div>
66+
<input type="range" id="kFaces" />
67+
</div>
68+
69+
<div class="kslider">
70+
<div class="kslider-title">Center (1)</div>
71+
<input type="range" id="kCenter" />
72+
</div>
73+
74+
<div class="hint">
75+
Kernel groups: corners=8, edges=12, faces=6, center=1 → total 27 weights.
76+
</div>
77+
78+
<div class="kslider zslice">
79+
<div class="kslider-title">Z slice</div>
80+
<input type="range" id="zSlice" min="0" max="0" step="1" value="0" />
81+
<div class="hint">Z = <span id="zLabel">0</span> / <span id="zMaxLabel">0</span></div>
82+
</div>
83+
</div>
84+
85+
<div id="kernelDump"></div>
86+
87+
<script>
88+
initUI();
89+
refreshSeed();
90+
</script>
91+
92+
<div>
93+
<a href="https://github.com/AlgorithmicDynamics/kernel-interference-explorer">https://github.com/AlgorithmicDynamics/kernel-interference-explorer</a>
94+
</div>
95+
96+
</body>
97+
</html>

0 commit comments

Comments
 (0)