Application prototype #14

Merged
glen merged 101 commits from app-proto into main 2024-10-21 23:38:28 +00:00
2 changed files with 31 additions and 46 deletions
Showing only changes of commit 69ab888d5b - Show all commits

View File

@ -51,7 +51,7 @@ input[type="radio"] {
background-color: #333; background-color: #333;
} }
label { .control > span {
width: 170px; width: 170px;
} }

View File

@ -484,44 +484,40 @@ fn main() {
div { "Mean frame interval: " (mean_frame_interval.get()) " ms" } div { "Mean frame interval: " (mean_frame_interval.get()) " ms" }
canvas(ref=display, width="600", height="600") canvas(ref=display, width="600", height="600")
div(ref=gen_controls) { div(ref=gen_controls) {
div(class="control") { label(class="control") {
label(for="ctrl-x") { "Sphere 0 depth" } span { "Sphere 0 depth" }
input( input(
type="range", type="range",
id="ctrl-x",
min=-1.0, min=-1.0,
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=ctrl_x bind:valueAsNumber=ctrl_x
) )
} }
div(class="control") { label(class="control") {
label(for="ctrl-y") { "Sphere 1 depth" } span { "Sphere 1 depth" }
input( input(
type="range", type="range",
id="ctrl-y",
min=-1.0, min=-1.0,
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=ctrl_y bind:valueAsNumber=ctrl_y
) )
} }
div(class="control") { label(class="control") {
label(for="radius-x") { "Sphere 0 radius" } span { "Sphere 0 radius" }
input( input(
type="range", type="range",
id="radius-x",
min=0.5, min=0.5,
max=1.5, max=1.5,
step=0.001, step=0.001,
bind:valueAsNumber=radius_x bind:valueAsNumber=radius_x
) )
} }
div(class="control") { label(class="control") {
label(for="radius-y") { "Sphere 1 radius" } span { "Sphere 1 radius" }
input( input(
type="range", type="range",
id="radius-y",
min=0.5, min=0.5,
max=1.5, max=1.5,
step=0.001, step=0.001,
@ -530,66 +526,60 @@ fn main() {
} }
} }
div(ref=low_curv_controls) { div(ref=low_curv_controls) {
div(class="control") { label(class="control") {
label(for="off-1") { "Sphere 1 offset" } span { "Sphere 1 offset" }
input( input(
type="range", type="range",
id="off-1",
min=-1.0, min=-1.0,
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=off1 bind:valueAsNumber=off1
) )
} }
div(class="control") { label(class="control") {
label(for="off-2") { "Sphere 2 offset" } span { "Sphere 2 offset" }
input( input(
type="range", type="range",
id="off-2",
min=-1.0, min=-1.0,
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=off2 bind:valueAsNumber=off2
) )
} }
div(class="control") { label(class="control") {
label(for="off-3") { "Sphere 3 offset" } span { "Sphere 3 offset" }
input( input(
type="range", type="range",
id="off-3",
min=-1.0, min=-1.0,
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=off3 bind:valueAsNumber=off3
) )
} }
div(class="control") { label(class="control") {
label(for="curv-1") { "Sphere 1 curvature" } span { "Sphere 1 curvature" }
input( input(
type="range", type="range",
id="curv-1",
min=0.0, min=0.0,
max=2.0, max=2.0,
step=0.001, step=0.001,
bind:valueAsNumber=curv1 bind:valueAsNumber=curv1
) )
} }
div(class="control") { label(class="control") {
label(for="curv-2") { "Sphere 2 curvature" } span { "Sphere 2 curvature" }
input( input(
type="range", type="range",
id="curv-2",
min=0.0, min=0.0,
max=2.0, max=2.0,
step=0.001, step=0.001,
bind:valueAsNumber=curv2 bind:valueAsNumber=curv2
) )
} }
div(class="control") { label(class="control") {
label(for="curv-3") { "Sphere 3 curvature" } span { "Sphere 3 curvature" }
input( input(
type="range", type="range",
id="curv-3",
min=0.0, min=0.0,
max=2.0, max=2.0,
step=0.001, step=0.001,
@ -597,49 +587,44 @@ fn main() {
) )
} }
} }
div(class="control") { label(class="control") {
label(for="opacity") { "Opacity" } span { "Opacity" }
input( input(
type="range", type="range",
id="opacity",
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=opacity bind:valueAsNumber=opacity
) )
} }
div(class="control") { label(class="control") {
label(for="highlight") { "Highlight" } span { "Highlight" }
input( input(
type="range", type="range",
id="highlight",
max=1.0, max=1.0,
step=0.001, step=0.001,
bind:valueAsNumber=highlight bind:valueAsNumber=highlight
) )
} }
div(class="control") { label(class="control") {
label(for="turntable") { "Turntable" } span { "Turntable" }
input( input(
type="checkbox", type="checkbox",
id="turntable",
bind:checked=turntable bind:checked=turntable
) )
} }
div(class="control") { label(class="control") {
label(for="layer-threshold") { "Layer threshold" } span { "Layer threshold" }
input( input(
type="range", type="range",
id="layer-threshold",
max=5.0, max=5.0,
step=1.0, step=1.0,
bind:valueAsNumber=layer_threshold bind:valueAsNumber=layer_threshold
) )
} }
div(class="control") { label(class="control") {
label(for="debug-mode") { "Debug mode" } span { "Debug mode" }
input( input(
type="checkbox", type="checkbox",
id="debug-mode",
bind:checked=debug_mode bind:checked=debug_mode
) )
} }