glen/dyna3
1
0
Fork 0
Code Issues 11 Pull Requests 1 Actions Projects Releases 2 Wiki Activity

Simplify control labeling

Browse Source
This commit is contained in:
Aaron Fenyes 2024-09-09 00:32:29 -07:00
parent 0173b63e19
commit 69ab888d5b
2 changed files with 31 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app-proto/inversive-display/main.css
View File

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

75
app-proto/inversive-display/src/main.rs
View File

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