2620 lines
132 KiB
Text
2620 lines
132 KiB
Text
use mod.prelude.widgets_internal.*
|
|
|
|
// An engineering blueprint: every control is a technical line drawing in
|
|
// white ink on the deep cyanotype paper of the window's ground. Outlines
|
|
// are two device pixels with corners of two points, dimension, centre and
|
|
// hatch lines one device pixel, all crisp at the device pixel and evenly
|
|
// weighted, with no glow and no relief. A face is the paper a shade
|
|
// deeper; nothing is filled except where a state needs it: the chosen
|
|
// thing takes the pale wash or a light hatch, a held thing the hatched
|
|
// shadow of a recess along its top and left edges, a lamp its light.
|
|
// Focus is a dashed sky marquee standing off the box, as a selection is
|
|
// marked on a drawing; the red pencil marks only danger.
|
|
mod.widgets.Button.padding = mod.turtle.Inset{left: 11.0 right: 11.0 top: 4.0 bottom: 4.0}
|
|
mod.widgets.Button.draw_bg.border_radius = 2.0
|
|
mod.widgets.Button.draw_bg.border_size = 0.67
|
|
// A ROW OF FIELDS IS ONE HEIGHT: the box metrics are stated once here and
|
|
// handed to each field below, and the buttons take the same 26 point row.
|
|
let field_height = 26.0
|
|
let field_pad_v = 4.0
|
|
let field_radius = 2.0
|
|
let field_border = 0.67
|
|
|
|
// The room a Fit field takes: where a field is Fit, the padding IS its
|
|
// height.
|
|
let field_room = fn(w) {
|
|
w.min_height = field_height
|
|
w.padding.top = field_pad_v
|
|
w.padding.bottom = field_pad_v
|
|
}
|
|
// The box a field draws. Given the draw object and not the widget, because
|
|
// not every field draws its own box.
|
|
let field_face = fn(d) {
|
|
d.border_radius = field_radius
|
|
d.border_size = field_border
|
|
}
|
|
// A field that states a frame and lays its own parts out inside it takes
|
|
// the height alone: a padding would displace its line.
|
|
let field_frame = fn(w) {
|
|
w.min_height = field_height
|
|
}
|
|
|
|
field_room(mod.widgets.TextInput)
|
|
field_face(mod.widgets.TextInput.draw_bg)
|
|
field_room(mod.widgets.TextInputFlat)
|
|
field_face(mod.widgets.TextInputFlat.draw_bg)
|
|
field_room(mod.widgets.ComboBox)
|
|
field_face(mod.widgets.ComboBox.draw_bg)
|
|
field_room(mod.widgets.DropDown)
|
|
field_face(mod.widgets.DropDown.draw_bg)
|
|
field_room(mod.widgets.DropDown2)
|
|
field_face(mod.widgets.DropDown2.draw_bg)
|
|
field_room(mod.widgets.FieldWell)
|
|
field_face(mod.widgets.FieldWell.draw_bg)
|
|
field_room(mod.widgets.TagField)
|
|
field_face(mod.widgets.TagField.draw_bg)
|
|
field_frame(mod.widgets.NumberField)
|
|
mod.widgets.NumberField.draw_bg.border_radius = field_radius
|
|
field_frame(mod.widgets.ValueInput)
|
|
field_frame(mod.widgets.DateField)
|
|
field_frame(mod.widgets.TimeField)
|
|
field_frame(mod.widgets.DatePicker)
|
|
field_frame(mod.widgets.DateRangePicker)
|
|
// The chrome-less input a well holds must impose no height of its own.
|
|
mod.widgets.WellInput.min_height = 0.0
|
|
mod.widgets.Window.pass.clear_color = #154577
|
|
|
|
// Marks leave the layout box: plain views stop clipping so a focus
|
|
// marquee, a hatched side or a leader line can fall into the gap beside a
|
|
// control. Scroll views still clip.
|
|
mod.widgets.View.clip_x = false
|
|
mod.widgets.View.clip_y = false
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// SHARED PARTS. Distances in points, negative inside, y down; `px` is one
|
|
// device pixel in points. The inks: paper #154577, face #11416f (the paper
|
|
// a shade deeper), lifted face #1a4e84, held face #0d3a68, well #0f3d6c,
|
|
// chosen wash #2a679f, line ink #e3f1ff, sky ink #9cd8fa, dimension ink
|
|
// #91c5f7, disabled line #6f93bd, red pencil #f46b66, amber pencil
|
|
// #ffd166, green #8ef0b8.
|
|
let bp_paper = fn() -> vec3 { return vec3(0.082, 0.271, 0.467) }
|
|
let bp_face = fn() -> vec3 { return vec3(0.067, 0.255, 0.435) }
|
|
let bp_face_hi = fn() -> vec3 { return vec3(0.102, 0.306, 0.518) }
|
|
let bp_face_lo = fn() -> vec3 { return vec3(0.051, 0.227, 0.408) }
|
|
let bp_well = fn() -> vec3 { return vec3(0.059, 0.239, 0.424) }
|
|
let bp_wash = fn() -> vec3 { return vec3(0.165, 0.404, 0.624) }
|
|
let bp_ink = fn() -> vec3 { return vec3(0.890, 0.945, 1.0) }
|
|
let bp_white = fn() -> vec3 { return vec3(1.0, 1.0, 1.0) }
|
|
let bp_sky = fn() -> vec3 { return vec3(0.612, 0.847, 0.980) }
|
|
let bp_sky_hi = fn() -> vec3 { return vec3(0.769, 0.914, 1.0) }
|
|
let bp_dimc = fn() -> vec3 { return vec3(0.569, 0.773, 0.969) }
|
|
let bp_off = fn() -> vec3 { return vec3(0.435, 0.576, 0.741) }
|
|
let bp_red = fn() -> vec3 { return vec3(0.957, 0.420, 0.400) }
|
|
let bp_green = fn() -> vec3 { return vec3(0.557, 0.941, 0.722) }
|
|
let bp_amber = fn() -> vec3 { return vec3(1.0, 0.820, 0.400) }
|
|
|
|
// Ink `ink` laid at coverage `a` over the premultiplied `under`.
|
|
let bp_put = fn(under: vec4, ink: vec3, a: float) -> vec4 {
|
|
return mix(under, vec4(ink, 1.0), clamp(a, 0.0, 1.0))
|
|
}
|
|
// The near and far corners of a control's box on whole device pixels, in
|
|
// its own points.
|
|
let bp_lo = fn(o: vec2, px: float) -> vec2 {
|
|
return vec2(Finish.snap(o.x, px), Finish.snap(o.y, px)) - o
|
|
}
|
|
let bp_hi = fn(o: vec2, s: vec2, px: float) -> vec2 {
|
|
return vec2(Finish.snap(o.x + s.x, px), Finish.snap(o.y + s.y, px)) - o
|
|
}
|
|
// Distance to a segment.
|
|
let bp_seg = fn(p: vec2, a: vec2, b: vec2) -> float {
|
|
let pa = p - a
|
|
let ba = b - a
|
|
let t = clamp(dot(pa, ba) / max(dot(ba, ba), 0.000001), 0.0, 1.0)
|
|
return length(pa - ba * t)
|
|
}
|
|
// Hairline hatching at 45 degrees, rising to the right, `pitch` points
|
|
// apart: the section lining of a drawing. Counted in the caller's own
|
|
// points, so it never moves with the page.
|
|
let bp_hatch = fn(p: vec2, pitch: float, px: float) -> float {
|
|
let u = (p.x + p.y) * 0.70710678
|
|
let t = abs(u - pitch * floor(u / pitch + 0.5))
|
|
return Finish.cover(t - 0.5 * px, px)
|
|
}
|
|
// Dashes along a run `t` points long: on for `duty` of every `period`.
|
|
let bp_dash = fn(t: float, period: float, duty: float) -> float {
|
|
return step(fract(t / period), duty)
|
|
}
|
|
// The focus marquee: a dashed sky hairline 2.5 points outside the box
|
|
// (centre `c`, half size `h`, corner `r`), laid over `under`.
|
|
let bp_focus = fn(under: vec4, p: vec2, c: vec2, h: vec2, r: float, px: float, focus: float) -> vec4 {
|
|
let off = Finish.snap(2.5, px)
|
|
let d = Material.sd_box(p, c, h + vec2(off, off), r + off)
|
|
let dash = bp_dash(p.x + p.y, 4.0, 0.55)
|
|
return bp_put(under, bp_sky(), Finish.band(d, 0.0, px, px) * dash * focus)
|
|
}
|
|
// A filled arrowhead, its tip at `tip`, pointing along the unit `dir`,
|
|
// `len` long and `hw` either side at its base. Coverage.
|
|
let bp_arrow = fn(p: vec2, tip: vec2, dir: vec2, len: float, hw: float, px: float) -> float {
|
|
let q = p - tip
|
|
let along = 0.0 - dot(q, dir)
|
|
let across = abs(q.x * dir.y - q.y * dir.x)
|
|
let k = hw / len
|
|
let side = (across - along * k) / sqrt(1.0 + k * k)
|
|
let d = max(max(0.0 - along, along - len), side)
|
|
return Finish.cover(d, px)
|
|
}
|
|
// The recess a held thing is drawn as: section hatching inside its top
|
|
// and left edges, `w` points deep, inside the line `lw` of the box `d`.
|
|
let bp_recess = fn(p: vec2, lo: vec2, d: float, lw: float, w: float, px: float) -> float {
|
|
let rim = min(step(p.y, lo.y + lw + w) + step(p.x, lo.x + lw + w), 1.0)
|
|
return rim * Finish.cover(d + lw, px) * bp_hatch(p, 2.5, px)
|
|
}
|
|
|
|
// THE LETTERING. A single-stroke drafting hand, as a draughtsman's
|
|
// lettering guide draws it: each character a few straight strokes in a
|
|
// cell 4 units wide and 6 tall (y down), returned as the distance in units
|
|
// from `q` to the nearest stroke. The codes: 0-9 the digits, 10-35 A-Z,
|
|
// 36 minus, 37 point, 38 slash, 39 colon, 40 space.
|
|
let bp_glyph = fn(c: float, q: vec2) -> float {
|
|
var d = 100.0
|
|
if min(abs(c - 0.0), abs(c - 24.0)) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(1.2, 0.0), vec2(2.8, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 0.0), vec2(4.0, 1.3)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.3), vec2(4.0, 4.7)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.7), vec2(2.8, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 6.0), vec2(1.2, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 6.0), vec2(0.0, 4.7)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 4.7), vec2(0.0, 1.3)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.3), vec2(1.2, 0.0)))
|
|
}
|
|
if abs(c - 1.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.8, 1.2), vec2(2.2, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.2, 0.0), vec2(2.2, 6.0)))
|
|
}
|
|
if abs(c - 2.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.3), vec2(1.0, 0.1)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.1), vec2(3.0, 0.1)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.1), vec2(4.0, 1.2)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.2), vec2(4.0, 2.3)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 2.3), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 3.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.8), vec2(1.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(4.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(4.0, 2.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 2.0), vec2(3.0, 2.9)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 2.9), vec2(1.4, 2.9)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 2.9), vec2(4.0, 3.9)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 3.9), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(0.0, 5.2)))
|
|
}
|
|
if abs(c - 4.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(0.0, 4.2)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 4.2), vec2(4.0, 4.2)))
|
|
}
|
|
if abs(c - 5.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.4, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.4, 0.0), vec2(0.1, 2.8)))
|
|
d = min(d, bp_seg(q, vec2(0.1, 2.8), vec2(1.2, 2.4)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 2.4), vec2(3.0, 2.4)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 2.4), vec2(4.0, 3.5)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 3.5), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(0.0, 5.2)))
|
|
}
|
|
if abs(c - 6.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(3.7, 0.6), vec2(2.9, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.9, 0.0), vec2(1.2, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 0.0), vec2(0.0, 1.4)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.4), vec2(0.0, 4.7)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 4.7), vec2(1.2, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 6.0), vec2(2.8, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 6.0), vec2(4.0, 4.8)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.8), vec2(4.0, 3.8)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 3.8), vec2(2.8, 2.7)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 2.7), vec2(1.2, 2.7)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 2.7), vec2(0.0, 3.8)))
|
|
}
|
|
if abs(c - 7.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(4.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(1.5, 6.0)))
|
|
}
|
|
if abs(c - 8.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(1.2, 0.0), vec2(2.8, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 0.0), vec2(3.7, 0.8)))
|
|
d = min(d, bp_seg(q, vec2(3.7, 0.8), vec2(3.7, 2.1)))
|
|
d = min(d, bp_seg(q, vec2(3.7, 2.1), vec2(2.8, 2.9)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 2.9), vec2(1.2, 2.9)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 2.9), vec2(0.3, 2.1)))
|
|
d = min(d, bp_seg(q, vec2(0.3, 2.1), vec2(0.3, 0.8)))
|
|
d = min(d, bp_seg(q, vec2(0.3, 0.8), vec2(1.2, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 2.9), vec2(2.8, 2.9)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 2.9), vec2(4.0, 4.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.0), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(0.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 5.0), vec2(0.0, 4.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 4.0), vec2(1.2, 2.9)))
|
|
}
|
|
if abs(c - 9.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.3, 5.4), vec2(1.1, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.1, 6.0), vec2(2.8, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 6.0), vec2(4.0, 4.6)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.6), vec2(4.0, 1.3)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.3), vec2(2.8, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 0.0), vec2(1.2, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 0.0), vec2(0.0, 1.2)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.2), vec2(0.0, 2.2)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 2.2), vec2(1.2, 3.3)))
|
|
d = min(d, bp_seg(q, vec2(1.2, 3.3), vec2(2.8, 3.3)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 3.3), vec2(4.0, 2.2)))
|
|
}
|
|
if abs(c - 10.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(2.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 0.0), vec2(4.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.7, 4.0), vec2(3.3, 4.0)))
|
|
}
|
|
if abs(c - 11.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 3.0), vec2(3.0, 3.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 3.0), vec2(4.0, 4.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.0), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(2.8, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.8, 0.0), vec2(3.7, 0.8)))
|
|
d = min(d, bp_seg(q, vec2(3.7, 0.8), vec2(3.7, 2.2)))
|
|
d = min(d, bp_seg(q, vec2(3.7, 2.2), vec2(2.9, 3.0)))
|
|
}
|
|
if abs(c - 12.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(1.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.0), vec2(0.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.0), vec2(0.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 5.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(4.0, 5.0)))
|
|
}
|
|
if abs(c - 13.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(2.4, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(2.4, 6.0), vec2(4.0, 4.4)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.4), vec2(4.0, 1.6)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.6), vec2(2.4, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.4, 0.0), vec2(0.0, 0.0)))
|
|
}
|
|
if abs(c - 14.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(4.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 3.0), vec2(2.8, 3.0)))
|
|
}
|
|
if abs(c - 15.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 3.0), vec2(2.8, 3.0)))
|
|
}
|
|
if abs(c - 16.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(1.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.0), vec2(0.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.0), vec2(0.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 5.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(4.0, 3.4)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 3.4), vec2(2.2, 3.4)))
|
|
}
|
|
if abs(c - 17.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(4.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 3.0), vec2(4.0, 3.0)))
|
|
}
|
|
if abs(c - 18.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(2.0, 0.0), vec2(2.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(3.0, 6.0)))
|
|
}
|
|
if abs(c - 20.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.0, 3.8)))
|
|
d = min(d, bp_seg(q, vec2(1.4, 2.7), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 21.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 22.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(2.0, 3.6)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 3.6), vec2(4.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 23.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(4.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 6.0), vec2(4.0, 0.0)))
|
|
}
|
|
if abs(c - 25.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(4.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(4.0, 2.2)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 2.2), vec2(3.0, 3.2)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 3.2), vec2(0.0, 3.2)))
|
|
}
|
|
if abs(c - 27.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(0.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(4.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(4.0, 2.2)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 2.2), vec2(3.0, 3.2)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 3.2), vec2(0.0, 3.2)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 3.2), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 28.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(4.0, 1.0), vec2(3.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 0.0), vec2(1.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 0.0), vec2(0.0, 1.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 1.0), vec2(0.0, 2.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 2.0), vec2(1.0, 3.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 3.0), vec2(3.0, 3.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 3.0), vec2(4.0, 4.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 4.0), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(0.0, 5.0)))
|
|
}
|
|
if abs(c - 29.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(4.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 0.0), vec2(2.0, 6.0)))
|
|
}
|
|
if abs(c - 30.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(0.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 5.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(4.0, 5.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 5.0), vec2(4.0, 0.0)))
|
|
}
|
|
if abs(c - 31.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(2.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 6.0), vec2(4.0, 0.0)))
|
|
}
|
|
if abs(c - 32.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(1.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(1.0, 6.0), vec2(2.0, 2.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 2.0), vec2(3.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(3.0, 6.0), vec2(4.0, 0.0)))
|
|
}
|
|
if abs(c - 33.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(4.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.0, 6.0)))
|
|
}
|
|
if abs(c - 34.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(2.0, 3.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 3.0), vec2(4.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(2.0, 3.0), vec2(2.0, 6.0)))
|
|
}
|
|
if abs(c - 35.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.0, 0.0), vec2(4.0, 0.0)))
|
|
d = min(d, bp_seg(q, vec2(4.0, 0.0), vec2(0.0, 6.0)))
|
|
d = min(d, bp_seg(q, vec2(0.0, 6.0), vec2(4.0, 6.0)))
|
|
}
|
|
if abs(c - 36.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(0.8, 3.2), vec2(3.2, 3.2)))
|
|
}
|
|
if abs(c - 38.0) < 0.5 {
|
|
d = min(d, bp_seg(q, vec2(3.6, 0.0), vec2(0.4, 6.0)))
|
|
}
|
|
if abs(c - 37.0) < 0.5 {
|
|
d = min(d, length(q - vec2(2.0, 5.9)) - 0.35)
|
|
}
|
|
if abs(c - 39.0) < 0.5 {
|
|
d = min(d, length(q - vec2(2.0, 1.9)) - 0.35)
|
|
d = min(d, length(q - vec2(2.0, 5.9)) - 0.35)
|
|
}
|
|
return d
|
|
}
|
|
|
|
// The strings the sheet letters, by number, character by character.
|
|
let bp_str = fn(s: float, i: float) -> float {
|
|
var c = 40.0
|
|
if abs(s - 0.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 16.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 23.0 }
|
|
if abs(i - 3.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 27.0 }
|
|
if abs(i - 5.0) < 0.5 { c = 10.0 }
|
|
if abs(i - 6.0) < 0.5 { c = 21.0 }
|
|
if abs(i - 8.0) < 0.5 { c = 10.0 }
|
|
if abs(i - 9.0) < 0.5 { c = 27.0 }
|
|
if abs(i - 10.0) < 0.5 { c = 27.0 }
|
|
if abs(i - 11.0) < 0.5 { c = 10.0 }
|
|
if abs(i - 12.0) < 0.5 { c = 23.0 }
|
|
if abs(i - 13.0) < 0.5 { c = 16.0 }
|
|
if abs(i - 14.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 15.0) < 0.5 { c = 22.0 }
|
|
if abs(i - 16.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 17.0) < 0.5 { c = 23.0 }
|
|
if abs(i - 18.0) < 0.5 { c = 29.0 }
|
|
}
|
|
if abs(s - 1.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 29.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 18.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 29.0 }
|
|
if abs(i - 3.0) < 0.5 { c = 21.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 14.0 }
|
|
}
|
|
if abs(s - 2.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 13.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 32.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 16.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 23.0 }
|
|
if abs(i - 5.0) < 0.5 { c = 24.0 }
|
|
}
|
|
if abs(s - 3.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 10.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 36.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 0.0 }
|
|
if abs(i - 3.0) < 0.5 { c = 0.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 1.0 }
|
|
}
|
|
if abs(s - 4.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 28.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 12.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 10.0 }
|
|
if abs(i - 3.0) < 0.5 { c = 21.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 14.0 }
|
|
}
|
|
if abs(s - 5.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 1.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 39.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 1.0 }
|
|
}
|
|
if abs(s - 6.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 28.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 17.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 3.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 4.0) < 0.5 { c = 29.0 }
|
|
}
|
|
if abs(s - 7.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 1.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 38.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 1.0 }
|
|
}
|
|
if abs(s - 8.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 27.0 }
|
|
if abs(i - 1.0) < 0.5 { c = 14.0 }
|
|
if abs(i - 2.0) < 0.5 { c = 31.0 }
|
|
}
|
|
if abs(s - 9.0) < 0.5 {
|
|
if abs(i - 0.0) < 0.5 { c = 10.0 }
|
|
}
|
|
return c
|
|
}
|
|
// The number of characters in each string.
|
|
let bp_str_len = fn(s: float) -> float {
|
|
var n = 0.0
|
|
if abs(s - 0.0) < 0.5 { n = 19.0 }
|
|
if abs(s - 1.0) < 0.5 { n = 5.0 }
|
|
if abs(s - 2.0) < 0.5 { n = 6.0 }
|
|
if abs(s - 3.0) < 0.5 { n = 5.0 }
|
|
if abs(s - 4.0) < 0.5 { n = 5.0 }
|
|
if abs(s - 5.0) < 0.5 { n = 3.0 }
|
|
if abs(s - 6.0) < 0.5 { n = 5.0 }
|
|
if abs(s - 7.0) < 0.5 { n = 3.0 }
|
|
if abs(s - 8.0) < 0.5 { n = 3.0 }
|
|
if abs(s - 9.0) < 0.5 { n = 1.0 }
|
|
return n
|
|
}
|
|
|
|
// Lettering in that hand: string `s` from its top left `o`, capitals `cap`
|
|
// points tall, strokes `w` points wide. Coverage.
|
|
let bp_text = fn(p: vec2, o: vec2, cap: float, s: float, w: float, px: float) -> float {
|
|
let k = cap / 6.0
|
|
let u = (p - o) / k
|
|
let i = floor((u.x + 0.7) / 5.4)
|
|
let n = bp_str_len(s)
|
|
let live = step(0.0, i) * step(i, n - 1.0) * step(-1.5, u.y) * step(u.y, 7.5)
|
|
var cov = 0.0
|
|
if live > 0.5 {
|
|
let q = vec2(u.x - i * 5.4, u.y)
|
|
cov = Finish.cover(bp_glyph(bp_str(s, i), q) * k - 0.5 * w, px)
|
|
}
|
|
return cov
|
|
}
|
|
// One character `ch` in the same hand, its cell's top left at `o`.
|
|
let bp_char = fn(p: vec2, o: vec2, cap: float, ch: float, w: float, px: float) -> float {
|
|
let k = cap / 6.0
|
|
let q = (p - o) / k
|
|
let live = step(-1.5, q.x) * step(q.x, 5.5) * step(-1.5, q.y) * step(q.y, 7.5)
|
|
var cov = 0.0
|
|
if live > 0.5 {
|
|
cov = Finish.cover(bp_glyph(ch, q) * k - 0.5 * w, px)
|
|
}
|
|
return cov
|
|
}
|
|
|
|
// A whole number `v` (up to four figures) in the same hand, centred on
|
|
// `ctr`: the figure a dimension line carries.
|
|
let bp_num = fn(p: vec2, ctr: vec2, cap: float, v: float, w: float, px: float) -> float {
|
|
let k = cap / 6.0
|
|
let vv = floor(v + 0.5)
|
|
let nd = 1.0 + step(9.5, vv) + step(99.5, vv) + step(999.5, vv)
|
|
let o = ctr - vec2((nd * 5.4 - 1.4) * k * 0.5, cap * 0.5)
|
|
let u = (p - o) / k
|
|
let i = floor((u.x + 0.7) / 5.4)
|
|
let live = step(0.0, i) * step(i, nd - 1.0) * step(-1.5, u.y) * step(u.y, 7.5)
|
|
var cov = 0.0
|
|
if live > 0.5 {
|
|
let dg = floor(vv / pow(10.0, nd - 1.0 - i)) - 10.0 * floor(vv / pow(10.0, nd - i))
|
|
let q = vec2(u.x - i * 5.4, u.y)
|
|
cov = Finish.cover(bp_glyph(dg, q) * k - 0.5 * w, px)
|
|
}
|
|
return cov
|
|
}
|
|
|
|
// The wait mark a replaced face draws itself: twelve short ticks on a ring
|
|
// where the label was, the one at the head in full ink on the button's own
|
|
// animation clock, the rest fading behind it.
|
|
let bp_wait = fn(under: vec4, p: vec2, lo: vec2, hi: vec2, px: float, loading: float, t: float) -> vec4 {
|
|
let c = (lo + hi) * 0.5
|
|
let r = clamp((hi.y - lo.y) * 0.3, 3.0, 8.0)
|
|
let q = p - c
|
|
let a = fract(atan2(q.y, q.x) / 6.2831853 + 0.25)
|
|
let slot = floor(a * 12.0 + 0.5)
|
|
let ang = slot / 12.0 * 6.2831853 - 1.5707963
|
|
let dir = vec2(cos(ang), sin(ang))
|
|
let s = bp_seg(q, dir * (r - 2.5), dir * r)
|
|
let head = fract(slot / 12.0 - t)
|
|
let lit = mix(0.2, 1.0, pow(1.0 - head, 3.0))
|
|
let cov = Finish.cover(s - 0.5 * px, px) * loading
|
|
return bp_put(under, mix(bp_off(), bp_ink(), lit), cov)
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// BUTTONS. One face for the family; `style` picks the dressing:
|
|
// 0 standard (the face under a two-pixel line), 1 primary (the chosen one:
|
|
// the pale wash under a three-pixel line of sky), 2 secondary (the line in
|
|
// sky), 3 danger (the line dashed in red pencil), 4 outline (the line
|
|
// alone, the grid showing through), 5 flat and 6 flatter (nothing until the
|
|
// pointer comes, then a hairline), 7 tertiary (the face under a hairline),
|
|
// 8 dashed (the outline in dashes).
|
|
// Under the pointer the line turns full white and the face lifts a shade;
|
|
// held, the face goes a shade deeper and the recess hatch runs inside its
|
|
// top and left edges; disabled, the line is dashed in the dim ink. The
|
|
// quad is grown by 6 points for the focus marquee.
|
|
let bp_button = fn(p: vec2, o: vec2, s: vec2, px: float, hover: float, down: float, focus: float, disabled: float, style: float) -> vec4 {
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px)
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let r = 2.0
|
|
let d = Material.sd_box(p, c, h, r)
|
|
let live = 1.0 - disabled
|
|
let hv = hover * live
|
|
let dn = down * live
|
|
let hero = step(0.5, style) * step(style, 1.5)
|
|
let armed = step(1.5, style) * step(style, 2.5)
|
|
let danger = step(2.5, style) * step(style, 3.5)
|
|
let outline = step(3.5, style) * step(style, 4.5)
|
|
let flat = step(4.5, style) * step(style, 6.5)
|
|
let thin = step(6.5, style) * step(style, 7.5)
|
|
let dashed = step(7.5, style)
|
|
let inside = Finish.cover(d, px)
|
|
// The face.
|
|
var face = mix(bp_face(), bp_face_hi(), hv)
|
|
face = mix(face, bp_face_lo(), dn)
|
|
let hface = mix(mix(bp_wash(), vec3(0.200, 0.455, 0.682), hv), vec3(0.137, 0.365, 0.576), dn)
|
|
face = mix(face, hface, hero)
|
|
var fa = 0.9
|
|
fa = mix(fa, max(0.5 * hv, 0.8 * dn), max(max(outline, flat), dashed))
|
|
fa = mix(fa, 0.4, disabled)
|
|
var out = vec4(face * fa * inside, fa * inside)
|
|
// The line's weight.
|
|
var lw = 2.0 * px
|
|
lw = mix(lw, 3.0 * px, hero)
|
|
lw = mix(lw, px, max(thin, flat))
|
|
// Held: the recess.
|
|
out = bp_put(out, bp_ink(), bp_recess(p, lo, d, lw, 3.0, px) * dn * 0.55)
|
|
// The line.
|
|
var lc = mix(bp_ink(), bp_white(), hv)
|
|
lc = mix(lc, mix(bp_sky(), bp_sky_hi(), hv), max(hero, armed))
|
|
lc = mix(lc, mix(bp_red(), vec3(1.0, 0.58, 0.55), hv), danger)
|
|
lc = mix(lc, bp_off(), disabled)
|
|
var shown = mix(1.0, max(hv, dn), flat)
|
|
let dash = bp_dash(p.x + p.y, 5.0, 0.6)
|
|
shown = shown * mix(1.0, dash, max(max(danger, dashed), disabled))
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, lw, px) * shown)
|
|
return bp_focus(out, p, c, h, r, px, focus * live)
|
|
}
|
|
|
|
mod.widgets.ButtonFlat.clip_x = false
|
|
mod.widgets.ButtonFlat.clip_y = false
|
|
mod.widgets.ButtonFlat.padding = mod.turtle.Inset{left: 11.0 right: 11.0 top: 4.0 bottom: 4.0}
|
|
mod.widgets.ButtonFlat.min_height = 26.0
|
|
mod.widgets.ButtonFlat.icon_walk = Walk{width: 13.0, height: Fit}
|
|
mod.widgets.ButtonFlat.draw_bg.bp_room = uniform(6.0)
|
|
mod.widgets.ButtonFlat.draw_bg.vertex = fn() {
|
|
let m = self.bp_room
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(m, m), self.rect_size + vec2(2.0 * m, 2.0 * m))
|
|
}
|
|
mod.widgets.ButtonFlat.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 5.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.Button.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 0.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
// The size rungs and the compound are standard buttons. They share the
|
|
// flat button's draw object, so they are handed one of their own.
|
|
mod.widgets.ButtonXs.draw_bg = mod.widgets.Button.draw_bg{}
|
|
mod.widgets.ButtonSm.draw_bg = mod.widgets.Button.draw_bg{}
|
|
mod.widgets.ButtonLg.draw_bg = mod.widgets.Button.draw_bg{}
|
|
mod.widgets.ButtonXl.draw_bg = mod.widgets.Button.draw_bg{}
|
|
mod.widgets.ButtonCompound.draw_bg = mod.widgets.Button.draw_bg{}
|
|
mod.widgets.ButtonXs.min_height = 18.0
|
|
mod.widgets.ButtonSm.min_height = 22.0
|
|
mod.widgets.ButtonLg.min_height = 32.0
|
|
mod.widgets.ButtonXl.min_height = 38.0
|
|
mod.widgets.ButtonSm.padding = mod.turtle.Inset{left: 9.0 right: 9.0 top: 0.0 bottom: 0.0}
|
|
mod.widgets.ButtonXs.padding = mod.turtle.Inset{left: 7.0 right: 7.0 top: 0.0 bottom: 0.0}
|
|
mod.widgets.ButtonLg.padding = mod.turtle.Inset{left: 14.0 right: 14.0 top: 0.0 bottom: 0.0}
|
|
mod.widgets.ButtonIcon.padding = mod.turtle.Inset{left: 8.0 right: 8.0 top: 4.0 bottom: 4.0}
|
|
|
|
mod.widgets.ButtonPrimary.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 1.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonSecondary.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 2.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonTertiary.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 7.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonDanger.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 3.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonOutline.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 4.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonDashed.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 8.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
mod.widgets.ButtonFlatter.draw_bg.pixel = fn() {
|
|
let m = self.bp_room
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(2.0 * m, 2.0 * m)) - vec2(m, m)
|
|
let f = bp_button(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled, 6.0)
|
|
return self.host_over(bp_wait(f, p, vec2(0.0, 0.0), self.rect_size, px, self.loading, self.anim_time), m)
|
|
}
|
|
|
|
// Button inks: white on every face, the pale sky on the secondary, a pale
|
|
// rose on danger (the red pencil is the line, never the word), the dim ink
|
|
// when off.
|
|
mod.widgets.ButtonFlat.draw_text.color = #eef6ff
|
|
mod.widgets.ButtonFlat.draw_text.color_hover = #ffffff
|
|
mod.widgets.ButtonFlat.draw_text.color_down = #ffffff
|
|
mod.widgets.ButtonFlat.draw_text.color_focus = #eef6ff
|
|
mod.widgets.ButtonFlat.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonPrimary.draw_text.color = #ffffff
|
|
mod.widgets.ButtonPrimary.draw_text.color_hover = #ffffff
|
|
mod.widgets.ButtonPrimary.draw_text.color_down = #ffffff
|
|
mod.widgets.ButtonPrimary.draw_text.color_focus = #ffffff
|
|
mod.widgets.ButtonPrimary.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonPrimary.draw_icon.color = #ffffff
|
|
mod.widgets.ButtonSecondary.draw_text.color = #c4e9ff
|
|
mod.widgets.ButtonSecondary.draw_text.color_hover = #e6f6ff
|
|
mod.widgets.ButtonSecondary.draw_text.color_down = #e6f6ff
|
|
mod.widgets.ButtonSecondary.draw_text.color_focus = #c4e9ff
|
|
mod.widgets.ButtonSecondary.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonSecondary.draw_icon.color = #c4e9ff
|
|
mod.widgets.ButtonTertiary.draw_text.color = #eef6ff
|
|
mod.widgets.ButtonTertiary.draw_text.color_hover = #ffffff
|
|
mod.widgets.ButtonTertiary.draw_text.color_down = #ffffff
|
|
mod.widgets.ButtonTertiary.draw_text.color_focus = #eef6ff
|
|
mod.widgets.ButtonTertiary.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonTertiary.draw_icon.color = #eef6ff
|
|
mod.widgets.ButtonDanger.draw_text.color = #ffdcd8
|
|
mod.widgets.ButtonDanger.draw_text.color_hover = #ffffff
|
|
mod.widgets.ButtonDanger.draw_text.color_down = #ffffff
|
|
mod.widgets.ButtonDanger.draw_text.color_focus = #ffdcd8
|
|
mod.widgets.ButtonDanger.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonDanger.draw_icon.color = #ffdcd8
|
|
mod.widgets.ButtonOutline.draw_text.color = #eef6ff
|
|
mod.widgets.ButtonOutline.draw_text.color_hover = #ffffff
|
|
mod.widgets.ButtonOutline.draw_text.color_down = #ffffff
|
|
mod.widgets.ButtonOutline.draw_text.color_focus = #eef6ff
|
|
mod.widgets.ButtonOutline.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.ButtonPrimary.draw_bg.loading_color = #ffffff
|
|
// The trailing icon is a draw object of its own, which the icon ink above
|
|
// does not reach, and the roles share the flat button's until each is
|
|
// handed one of its own with the ink of its leading icon.
|
|
mod.widgets.ButtonFlat.draw_icon_end.color = #eef6ff
|
|
mod.widgets.ButtonPrimary.draw_icon_end = mod.widgets.ButtonFlat.draw_icon_end{color: #ffffff}
|
|
mod.widgets.ButtonSecondary.draw_icon_end = mod.widgets.ButtonFlat.draw_icon_end{color: #c4e9ff}
|
|
mod.widgets.ButtonDanger.draw_icon_end = mod.widgets.ButtonFlat.draw_icon_end{color: #ffdcd8}
|
|
mod.widgets.ButtonTertiary.draw_icon_end = mod.widgets.ButtonFlat.draw_icon_end{color: #eef6ff}
|
|
|
|
// HELD STATES. The stock tracks write the pointer's hover and the press as
|
|
// snapped values, and a snapped value never arrives when a state is held
|
|
// from the start (a still page, a restored screen). The same states with
|
|
// plain values and a snapped entry look and move the same under a live
|
|
// pointer, and hold.
|
|
let bp_held_states = fn(w) {
|
|
w.animator.hover.on.from = {all: Snap}
|
|
w.animator.hover.on.apply = {draw_bg: {down: 0.0, hover: 1.0} draw_text: {down: 0.0, hover: 1.0}}
|
|
w.animator.hover.down.from = {all: Snap}
|
|
w.animator.hover.down.apply = {draw_bg: {down: 1.0, hover: 1.0} draw_text: {down: 1.0, hover: 1.0}}
|
|
}
|
|
bp_held_states(mod.widgets.ButtonFlat)
|
|
bp_held_states(mod.widgets.CheckBoxFlat)
|
|
bp_held_states(mod.widgets.ToggleFlat)
|
|
bp_held_states(mod.widgets.RadioButtonFlat)
|
|
bp_held_states(mod.widgets.RadioButtonTabFlat)
|
|
bp_held_states(mod.widgets.TextInputFlat)
|
|
bp_held_states(mod.widgets.DropDownFlat)
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// CHECK BOXES. A 15 point square with corners of two points in the
|
|
// two-pixel line over the face; checked, a check of two strokes in the sky
|
|
// ink; mixed, the pale wash with a white dash across it; error, the line in
|
|
// red pencil; held, the well hatched as a recess; disabled, the line dashed.
|
|
let bp_check = fn(p: vec2, o: vec2, rs: vec2, px: float, sz: float, at_end: float, hover: float, down: float, focus: float, active: float, mixed: float, err: float, disabled: float) -> vec4 {
|
|
let x0 = (rs.x - sz) * at_end
|
|
let y0 = rs.y * 0.5 - sz * 0.5
|
|
let lo = vec2(Finish.snap(o.x + x0, px), Finish.snap(o.y + y0, px)) - o
|
|
let hi = lo + vec2(Finish.snap(sz, px), Finish.snap(sz, px))
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let d = Material.sd_box(p, c, h, 2.0)
|
|
let live = 1.0 - disabled
|
|
let hv = hover * live
|
|
let dn = down * live
|
|
let mx = mixed * (1.0 - active)
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px)
|
|
var face = mix(bp_face(), bp_face_hi(), hv)
|
|
face = mix(face, bp_face_lo(), dn)
|
|
face = mix(face, bp_wash(), mx * live)
|
|
var out = vec4(face * 0.9 * inside, 0.9 * inside)
|
|
out = bp_put(out, bp_ink(), Finish.cover(d + lw, px) * bp_hatch(p, 2.5, px) * dn * 0.5)
|
|
var lc = mix(bp_ink(), bp_white(), hv)
|
|
lc = mix(lc, bp_red(), err)
|
|
lc = mix(lc, bp_off(), disabled)
|
|
let dash = mix(1.0, bp_dash(p.x + p.y, 4.0, 0.6), disabled)
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, lw, px) * dash)
|
|
// The check.
|
|
let k = hi.x - lo.x
|
|
let a = lo + vec2(0.22, 0.52) * k
|
|
let b = lo + vec2(0.42, 0.73) * k
|
|
let e = lo + vec2(0.79, 0.27) * k
|
|
let cw = max(2.5 * px, 0.12 * k)
|
|
let ck = min(bp_seg(p, a, b), bp_seg(p, b, e)) - cw * 0.5
|
|
var ink = mix(bp_sky(), bp_sky_hi(), hv)
|
|
ink = mix(ink, bp_red(), err)
|
|
ink = mix(ink, bp_off(), disabled)
|
|
out = bp_put(out, ink, Finish.cover(ck, px) * active)
|
|
// Mixed: the dash.
|
|
let md = max(abs(p.x - c.x) - 0.25 * k, abs(p.y - c.y) - cw * 0.5)
|
|
out = bp_put(out, mix(bp_white(), bp_off(), disabled), Finish.cover(md, px) * mx)
|
|
return bp_focus(out, p, c, h, 2.0, px, focus * live)
|
|
}
|
|
|
|
mod.widgets.CheckBoxFlat.clip_x = false
|
|
mod.widgets.CheckBoxFlat.clip_y = false
|
|
mod.widgets.CheckBoxFlat.label_walk.margin.left = 18.0
|
|
mod.widgets.CheckBoxFlat.draw_bg.size = uniform(15.0)
|
|
mod.widgets.CheckBoxFlat.draw_bg.border_radius = uniform(2.0)
|
|
mod.widgets.CheckBoxFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.CheckBoxFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_check(p, self.rect_pos, self.rect_size, px, self.size, self.mark_at_end, self.hover, self.down, self.focus, self.active, self.mixed, self.error, self.disabled)
|
|
}
|
|
mod.widgets.CheckBoxFlat.draw_text.color_error = #ffb3ae
|
|
|
|
// RADIOS. A 15 point circle in the two-pixel line; on, a disc of the sky
|
|
// ink with a device pixel of face between it and the line.
|
|
mod.widgets.RadioButtonFlat.clip_x = false
|
|
mod.widgets.RadioButtonFlat.clip_y = false
|
|
mod.widgets.RadioButtonFlat.label_walk.margin.left = 18.0
|
|
mod.widgets.RadioButtonFlat.draw_bg.size = uniform(15.0)
|
|
mod.widgets.RadioButtonFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.RadioButtonFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
let o = self.rect_pos
|
|
let r = Finish.snap(self.size * 0.5, px)
|
|
let c = vec2(Finish.snap(o.x + r, px) - o.x, Finish.snap(o.y + self.rect_size.y * 0.5, px) - o.y)
|
|
let d = length(p - c) - r
|
|
let live = 1.0 - self.disabled
|
|
let hv = self.hover * live
|
|
let dn = self.down * live
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px)
|
|
var face = mix(bp_face(), bp_face_hi(), hv)
|
|
face = mix(face, bp_face_lo(), dn)
|
|
var out = vec4(face * 0.9 * inside, 0.9 * inside)
|
|
out = bp_put(out, bp_ink(), Finish.cover(d + lw, px) * bp_hatch(p, 2.5, px) * dn * 0.5)
|
|
var lc = mix(bp_ink(), bp_white(), hv)
|
|
lc = mix(lc, bp_off(), self.disabled)
|
|
let dash = mix(1.0, bp_dash(atan2(p.y - c.y, p.x - c.x) * r, 4.0, 0.6), self.disabled)
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, lw, px) * dash)
|
|
let dd = length(p - c) - Finish.snap(r * 0.5, px)
|
|
out = bp_put(out, mix(mix(bp_sky(), bp_sky_hi(), hv), bp_off(), self.disabled), Finish.cover(dd, px) * self.active)
|
|
return bp_focus(out, p, c, vec2(r, r), r, px, self.focus * live)
|
|
}
|
|
|
|
// TOGGLES AND SWITCHES. One drawing for the three, `kind` picks it:
|
|
// 0 the toggle, an outlined pill with a round thumb; 1 the rocker, a box
|
|
// split down the middle whose pressed half is hatched as a recess, an I on
|
|
// one half and an O on the other, the lit one in sky; 2 the slide switch,
|
|
// a slot with a square cap carrying three grip lines. On, the stretch the
|
|
// thumb has travelled is hatched in sky and the thumb is the sky ink.
|
|
let bp_toggle = fn(p: vec2, o: vec2, rs: vec2, px: float, size: float, aspect: float, at_end: float, t: float, active: float, hover: float, down: float, focus: float, disabled: float, kind: float) -> vec4 {
|
|
let sz = vec2(size * aspect, size)
|
|
let x0 = (rs.x - sz.x) * at_end
|
|
let lo = vec2(Finish.snap(o.x + x0, px), Finish.snap(o.y + rs.y * 0.5 - sz.y * 0.5, px)) - o
|
|
let hi = lo + vec2(Finish.snap(sz.x, px), Finish.snap(sz.y, px))
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let pill = step(kind, 0.5)
|
|
let rocker = step(0.5, kind) * step(kind, 1.5)
|
|
let slide = step(1.5, kind)
|
|
let r = mix(2.5, h.y, pill)
|
|
let d = Material.sd_box(p, c, h, r)
|
|
let live = 1.0 - disabled
|
|
let hv = hover * live
|
|
let dn = down * live
|
|
let on = active * live
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px)
|
|
var face = mix(bp_face(), bp_face_hi(), hv * 0.6)
|
|
var out = vec4(face * 0.9 * inside, 0.9 * inside)
|
|
var lc = mix(bp_ink(), bp_white(), hv)
|
|
lc = mix(lc, bp_off(), disabled)
|
|
let dash = mix(1.0, bp_dash(p.x + p.y, 4.0, 0.6), disabled)
|
|
var sky = mix(bp_sky(), bp_sky_hi(), hv)
|
|
sky = mix(sky, bp_off(), disabled)
|
|
// The thumb's travel.
|
|
let tr = h.y - Finish.snap(3.0, px)
|
|
let tx0 = lo.x + h.y
|
|
let tx1 = hi.x - h.y
|
|
let tcx = Finish.snap(o.x + mix(tx0, tx1, t), px) - o.x
|
|
// The travelled stretch, hatched in sky (toggle and slide switch).
|
|
let trav = Finish.cover(d + lw + px, px) * step(p.x, tcx) * (1.0 - rocker)
|
|
out = bp_put(out, sky, trav * bp_hatch(p, 2.5, px) * mix(0.0, 0.85, t) * live)
|
|
// The rocker: the pressed half recessed, the divider, the I and the O.
|
|
let half = mix(step(p.x, c.x), step(c.x, p.x), active)
|
|
out = bp_put(out, bp_ink(), half * Finish.cover(d + lw, px) * bp_hatch(p, 2.5, px) * rocker * 0.45)
|
|
let divd = Finish.cover(abs(p.x - c.x) - px, px) * inside * rocker
|
|
out = bp_put(out, lc, divd)
|
|
let iq = p - vec2(c.x + h.x * 0.5, c.y)
|
|
let im = max(abs(iq.x) - px, abs(iq.y) - h.y * 0.42)
|
|
out = bp_put(out, mix(lc, sky, on), Finish.cover(im, px) * rocker)
|
|
let oq = length(p - vec2(c.x - h.x * 0.5, c.y)) - h.y * 0.38
|
|
out = bp_put(out, mix(sky, lc, active), Finish.band(oq, 0.0, lw, px) * rocker)
|
|
// The line.
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, lw, px) * dash)
|
|
// The toggle's thumb.
|
|
let td = length(p - vec2(tcx, c.y)) - tr
|
|
let tin = Finish.cover(td, px) * pill
|
|
out = bp_put(out, mix(face, sky, on), tin)
|
|
out = bp_put(out, mix(bp_ink(), bp_face(), on), tin * bp_hatch(p, 2.0, px) * dn * 0.6)
|
|
out = bp_put(out, mix(lc, sky, on), Finish.band(td, 0.0, lw, px) * pill)
|
|
// The slide switch's cap: a square block over half the slot.
|
|
let cw = h.x * 0.5 - Finish.snap(2.0, px)
|
|
let ccx = Finish.snap(o.x + mix(lo.x + Finish.snap(2.0, px) + cw, hi.x - Finish.snap(2.0, px) - cw, t), px) - o.x
|
|
let cd = Material.sd_box(p, vec2(ccx, c.y), vec2(cw, h.y - Finish.snap(2.0, px)), 1.0)
|
|
out = bp_put(out, mix(face, bp_face_lo(), dn), Finish.cover(cd, px) * slide)
|
|
let gq = abs(p.x - ccx)
|
|
let grip = Finish.cover(abs(gq - 2.5 * step(1.0, gq)) - 0.5 * px, px) * step(gq, 3.5) * Finish.cover(cd + h.y * 0.35, px)
|
|
out = bp_put(out, mix(lc, sky, on), grip * slide)
|
|
out = bp_put(out, mix(lc, sky, on), Finish.band(cd, 0.0, lw, px) * slide)
|
|
return bp_focus(out, p, c, h, r, px, focus * live)
|
|
}
|
|
|
|
mod.widgets.ToggleFlat.clip_x = false
|
|
mod.widgets.ToggleFlat.clip_y = false
|
|
mod.widgets.ToggleFlat.label_walk.margin.left = 42.0
|
|
mod.widgets.ToggleFlat.draw_bg.size = uniform(16.0)
|
|
mod.widgets.ToggleFlat.draw_bg.pill_aspect = uniform(2.375)
|
|
// A knob icon is a 7 point mark in the middle of the thumb. The widget
|
|
// places it for the stock knob, and a sheet's writes to those values do
|
|
// not reach where it reads them; so the icon's own point hook scales the
|
|
// mark about its centre and moves it onto this thumb.
|
|
let bp_knob_icon = fn(pos: vec2, rs: vec2, dx: float) -> vec2 {
|
|
let c = rs * 0.5
|
|
let k = 7.0 / max(min(rs.x, rs.y), 1.0)
|
|
return c + (pos - c) * k + vec2(dx, 0.0)
|
|
}
|
|
mod.widgets.ToggleFlat.draw_icon_off.transform_svg_point = fn(pos: vec2) -> vec2 {
|
|
return bp_knob_icon(pos, self.rect_size, 1.0)
|
|
}
|
|
mod.widgets.ToggleFlat.draw_icon_on.transform_svg_point = fn(pos: vec2) -> vec2 {
|
|
return bp_knob_icon(pos, self.rect_size, -1.0)
|
|
}
|
|
mod.widgets.ToggleFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.ToggleFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
let t = mix(self.active, self.drag_pos, self.drag)
|
|
return bp_toggle(p, self.rect_pos, self.rect_size, px, self.size, self.pill_aspect, self.mark_at_end, t, self.active, self.hover, self.down, self.focus, self.disabled, 0.0)
|
|
}
|
|
|
|
// THE SWITCHES are the rocker and the slide switch drawn above, the
|
|
// toggle's size, quad and label gap. The rocker turns on a click; the
|
|
// slide switch follows a drag, as the toggle does.
|
|
mod.widgets.ToggleRocker.clip_x = false
|
|
mod.widgets.ToggleSlide.clip_x = false
|
|
mod.widgets.ToggleRocker.clip_y = false
|
|
mod.widgets.ToggleSlide.clip_y = false
|
|
mod.widgets.ToggleRocker.label_walk.margin.left = 42.0
|
|
mod.widgets.ToggleSlide.label_walk.margin.left = 42.0
|
|
mod.widgets.ToggleRocker.draw_bg.size = uniform(16.0)
|
|
mod.widgets.ToggleSlide.draw_bg.size = uniform(16.0)
|
|
mod.widgets.ToggleRocker.draw_bg.pill_aspect = uniform(2.375)
|
|
mod.widgets.ToggleSlide.draw_bg.pill_aspect = uniform(2.375)
|
|
mod.widgets.ToggleRocker.draw_bg.vertex = mod.widgets.ToggleFlat.draw_bg.vertex
|
|
mod.widgets.ToggleSlide.draw_bg.vertex = mod.widgets.ToggleFlat.draw_bg.vertex
|
|
mod.widgets.ToggleRocker.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_toggle(p, self.rect_pos, self.rect_size, px, self.size, self.pill_aspect, self.mark_at_end, self.active, self.active, self.hover, self.down, self.focus, self.disabled, 1.0)
|
|
}
|
|
mod.widgets.ToggleSlide.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
let t = mix(self.active, self.drag_pos, self.drag)
|
|
return bp_toggle(p, self.rect_pos, self.rect_size, px, self.size, self.pill_aspect, self.mark_at_end, t, self.active, self.hover, self.down, self.focus, self.disabled, 2.0)
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// SLIDERS. The rail is a slot drawn in two lines, each two device pixels,
|
|
// four device pixels apart with round ends; the value fills the slot in
|
|
// sky; a tick scale in the dimension ink runs under it, a tick every tenth
|
|
// and a longer one at the ends and the middle. The thumb is a small
|
|
// outlined square cross-hatched in sky, or (`round_thumb`) a circle with a
|
|
// centre mark whose upright runs on past it as a centre line.
|
|
let bp_slider = fn(p: vec2, o: vec2, rs: vec2, px: float, cy: float, pad_l: float, pad_r: float, pos: float, from: float, hover: float, focus: float, drag: float, disabled: float, ruler: float, round_thumb: float) -> vec4 {
|
|
let live = 1.0 - disabled
|
|
let touch = max(max(hover, drag), focus) * live
|
|
let yc = Finish.snap(o.y + cy, px) - o.y
|
|
let x0 = Finish.snap(o.x + pad_l, px) - o.x
|
|
let x1 = Finish.snap(o.x + rs.x - pad_r, px) - o.x
|
|
let hh = Finish.snap(2.67, px)
|
|
let lw = 2.0 * px
|
|
let d = Material.sd_box(p, vec2((x0 + x1) * 0.5, yc), vec2((x1 - x0) * 0.5 + hh, hh), hh)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.85 * inside, 0.85 * inside)
|
|
// The value in the slot.
|
|
let xv = mix(x0, x1, pos)
|
|
let xf = mix(x0, x1, from)
|
|
let fa = min(xf, xv)
|
|
let fb = max(xf, xv)
|
|
let fd = max(d + lw, max(fa - p.x, p.x - fb))
|
|
var ink = mix(bp_sky(), bp_sky_hi(), drag * live)
|
|
ink = mix(ink, bp_off(), disabled)
|
|
out = bp_put(out, ink, Finish.cover(fd, px) * step(0.5 * px, fb - fa))
|
|
// The rails.
|
|
var lc = mix(bp_ink(), bp_white(), touch)
|
|
lc = mix(lc, bp_off(), disabled)
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, lw, px))
|
|
// The scale.
|
|
let tq = (p.x - x0) / max(x1 - x0, 1.0) * 10.0
|
|
let ti = floor(tq + 0.5)
|
|
let tx = abs(tq - ti) * (x1 - x0) / 10.0
|
|
let major = min(step(abs(ti - 5.0), 0.5) + step(ti, 0.5) + step(9.5, ti), 1.0)
|
|
let ty = p.y - (yc + hh + Finish.snap(2.5, px))
|
|
let tl = mix(2.5, 4.5, major)
|
|
let tick = Finish.cover(tx - 0.5 * px, px) * step(0.0, ty) * step(ty, tl) * step(-0.5, ti) * step(ti, 10.5) * ruler
|
|
out = bp_put(out, mix(bp_dimc(), bp_off(), disabled), tick)
|
|
// The thumb.
|
|
let hx = Finish.snap(o.x + xv, px) - o.x
|
|
let tc = vec2(hx, yc)
|
|
let sq = Material.sd_box(p, tc, vec2(6.0, 6.0), 2.0)
|
|
let ci = length(p - tc) - 6.5
|
|
let td = mix(sq, ci, round_thumb)
|
|
let tin = Finish.cover(td, px)
|
|
out = bp_put(out, mix(bp_face(), bp_face_hi(), touch), tin)
|
|
let q = p - tc
|
|
let xh = max(bp_hatch(q, 2.0, px), bp_hatch(vec2(0.0 - q.x, q.y), 2.0, px))
|
|
out = bp_put(out, ink, xh * Finish.cover(td + lw + 0.5 * px, px) * (1.0 - round_thumb) * (0.7 + 0.3 * touch))
|
|
let cross = max(Finish.cover(abs(q.x) - 0.5 * px, px), Finish.cover(abs(q.y) - 0.5 * px, px)) * Finish.cover(td + lw + 1.0, px)
|
|
out = bp_put(out, lc, cross * round_thumb)
|
|
let upright = Finish.cover(abs(q.x) - 0.5 * px, px) * step(abs(q.y), 9.0) * (1.0 - tin)
|
|
out = bp_put(out, mix(bp_dimc(), bp_off(), disabled), upright * round_thumb)
|
|
out = bp_put(out, lc, Finish.band(td, 0.0, lw, px))
|
|
return bp_focus(out, p, tc, vec2(6.0, 6.0), mix(2.0, 6.5, round_thumb), px, focus * live)
|
|
}
|
|
|
|
mod.widgets.SliderFlat.clip_x = false
|
|
mod.widgets.SliderFlat.clip_y = false
|
|
mod.widgets.SliderFlat.height = 36.0
|
|
mod.widgets.SliderFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.SliderFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
let lo = min(self.origin_pos, self.slide_pos)
|
|
let from = mix(0.0, lo, self.arc_origin)
|
|
let to = mix(self.slide_pos, max(self.origin_pos, self.slide_pos), self.arc_origin)
|
|
return bp_slider(p, self.rect_pos, self.rect_size, px, 23.0, 6.0, 6.0, to, from, self.hover, self.focus, self.drag, self.disabled, 1.0, 0.0)
|
|
}
|
|
// The minimal slider is a dimension line: a hairline between two
|
|
// extension marks, the value a two-pixel line of sky from the start to an
|
|
// arrowhead, and an extension mark standing at the value.
|
|
mod.widgets.SliderMinimal.clip_x = false
|
|
mod.widgets.SliderMinimal.clip_y = false
|
|
mod.widgets.SliderMinimal.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.SliderMinimal.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
let o = self.rect_pos
|
|
let live = 1.0 - self.disabled
|
|
let touch = max(max(self.hover, self.drag), self.focus) * live
|
|
let y = Finish.snap(o.y + self.offset_y + (self.rect_size.y - self.offset_y) * 0.5, px) - o.y + 0.5 * px
|
|
let x0 = Finish.snap(o.x + 1.0, px) - o.x
|
|
let x1 = Finish.snap(o.x + self.rect_size.x - 1.0, px) - o.x
|
|
let inx = step(x0, p.x) * step(p.x, x1)
|
|
var lc = mix(bp_ink(), bp_white(), touch)
|
|
lc = mix(lc, bp_off(), self.disabled)
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
out = bp_put(out, mix(bp_dimc(), bp_off(), self.disabled), Finish.cover(abs(p.y - y) - 0.5 * px, px) * inx)
|
|
let ext = Finish.cover(min(abs(p.x - x0), abs(p.x - x1)) - 0.5 * px, px) * step(abs(p.y - y), 5.0)
|
|
out = bp_put(out, mix(bp_dimc(), bp_off(), self.disabled), ext)
|
|
let lo = min(self.origin_pos, self.slide_pos)
|
|
let hi = max(self.origin_pos, self.slide_pos)
|
|
let a = mix(x0, x1, mix(0.0, lo, self.arc_origin))
|
|
let b = mix(x0, x1, mix(self.slide_pos, hi, self.arc_origin))
|
|
let hx = Finish.snap(o.x + mix(x0, x1, self.slide_pos), px) - o.x
|
|
var ink = mix(bp_sky(), bp_sky_hi(), touch)
|
|
ink = mix(ink, bp_off(), self.disabled)
|
|
let run = Finish.cover(abs(p.y - y) - px, px) * step(a, p.x) * step(p.x, b - 4.0)
|
|
out = bp_put(out, ink, run)
|
|
out = bp_put(out, ink, bp_arrow(p, vec2(b, y), vec2(1.0, 0.0), 7.0, 2.6, px) * step(1.0, b - a))
|
|
out = bp_put(out, ink, bp_arrow(p, vec2(a, y), vec2(-1.0, 0.0), 7.0, 2.6, px) * step(1.0, b - a) * step(0.5, self.arc_origin))
|
|
let mark = Finish.cover(abs(p.x - hx) - 0.5 * px, px) * step(abs(p.y - y), 7.0)
|
|
out = bp_put(out, lc, mark)
|
|
return bp_focus(out, p, vec2(hx, y), vec2(3.0, 7.0), 1.0, px, self.focus * live)
|
|
}
|
|
// The round slider: the rail with the round thumb, between its label
|
|
// column and its value.
|
|
mod.widgets.SliderRoundFlat.clip_x = false
|
|
mod.widgets.SliderRoundFlat.clip_y = false
|
|
mod.widgets.SliderRoundFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.SliderRoundFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
return bp_slider(p, self.rect_pos, self.rect_size, px, self.rect_size.y * 0.5, self.label_size + 8.0, 46.0, self.slide_pos, 0.0, self.hover, self.focus, self.drag, self.disabled, 0.0, 1.0)
|
|
}
|
|
|
|
// FADERS. The slot is two hairlines 4 points apart closed at both ends,
|
|
// the value fills it in sky, a tick ladder stands on both sides, every
|
|
// tenth 3 points and every half 5; the cap is a square outlined block
|
|
// with three grip lines across it, the middle one the sky index.
|
|
mod.widgets.SliderFader.cap_size = 12.0
|
|
mod.widgets.SliderFader.track_inset = 6.0
|
|
mod.widgets.SliderFader.clip_x = false
|
|
mod.widgets.SliderFader.clip_y = false
|
|
mod.widgets.SliderFader.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.SliderFader.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p0 = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
let along = mix(self.rect_size.x, self.rect_size.y, self.is_vertical)
|
|
let across = mix(self.rect_size.y, self.rect_size.x, self.is_vertical)
|
|
// Track space: x runs from the value's zero, y across.
|
|
let p = vec2(mix(p0.x, self.rect_size.y - p0.y, self.is_vertical), mix(p0.y, p0.x, self.is_vertical))
|
|
let live = 1.0 - self.disabled
|
|
let touch = max(max(self.hover, self.drag), self.focus) * live
|
|
let travel = max(along - self.inset_px * 2.0 - self.cap_px, 1.0)
|
|
let foot = self.inset_px + self.cap_px * 0.5
|
|
let mid = Finish.snap(across * 0.5, px)
|
|
let a0 = foot - 3.0
|
|
let a1 = foot + travel + 3.0
|
|
let inrun = step(a0, p.x) * step(p.x, a1)
|
|
var lc = mix(bp_ink(), bp_white(), touch)
|
|
lc = mix(lc, bp_off(), self.disabled)
|
|
let dimc = mix(bp_dimc(), bp_off(), self.disabled)
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
let sd = Material.sd_box(p, vec2((a0 + a1) * 0.5, mid), vec2((a1 - a0) * 0.5, 2.0 + px), 0.0)
|
|
out = bp_put(out, bp_face(), Finish.cover(sd, px) * 0.9)
|
|
// The fill.
|
|
let fa = foot + self.fill_lo * travel
|
|
let fb = foot + self.fill_hi * travel
|
|
let fill = Finish.cover(sd + px, px) * step(fa, p.x) * step(p.x, fb)
|
|
out = bp_put(out, mix(bp_sky(), bp_off(), self.disabled), fill)
|
|
out = bp_put(out, lc, Finish.band(sd, 0.0, px, px) * inrun)
|
|
// Ticks on both sides.
|
|
let tq = (p.x - foot) / travel * 10.0
|
|
let ti = floor(tq + 0.5)
|
|
let tx = abs(tq - ti) * travel / 10.0
|
|
let major = min(step(abs(ti - 5.0), 0.5) + step(ti, 0.5) + step(9.5, ti), 1.0)
|
|
let tl = mix(3.0, 5.0, major)
|
|
let tb = abs(p.y - mid) - 6.0
|
|
let tick = Finish.cover(tx - 0.5 * px, px) * step(0.0, tb) * step(tb, tl) * step(-0.5, ti) * step(ti, 10.5)
|
|
out = bp_put(out, dimc, tick)
|
|
// The cap.
|
|
let at = Finish.snap(foot + self.slide_pos * travel, px)
|
|
let cap = Material.sd_box(p, vec2(at, mid), vec2(self.cap_px * 0.5, 11.0), 1.5)
|
|
let cin = Finish.cover(cap, px)
|
|
out = bp_put(out, mix(mix(bp_face(), bp_face_hi(), touch), bp_face_lo(), self.drag * live), cin)
|
|
let gq = abs(p.x - at)
|
|
let grip = Finish.cover(abs(gq - 3.0 * step(1.5, gq)) - 0.5 * px, px) * step(gq, 4.0) * Finish.cover(cap + 3.0, px)
|
|
let index = Finish.cover(gq - px, px) * Finish.cover(cap + 2.0, px)
|
|
out = bp_put(out, lc, grip)
|
|
out = bp_put(out, mix(mix(bp_sky(), bp_sky_hi(), touch), bp_off(), self.disabled), index)
|
|
out = bp_put(out, lc, Finish.band(cap, 0.0, 2.0 * px, px))
|
|
return bp_focus(out, p, vec2(at, mid), vec2(self.cap_px * 0.5, 11.0), 1.5, px, self.focus * live)
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// ROTARIES. A knob is drawn as on a drawing: a tick scale round the
|
|
// outside (a tick every tenth of the travel, every fifth tick longer), the
|
|
// travel as a band outlined in hairlines and filled with sky over the lit
|
|
// stretch (from the start of the scale, or from the origin, to the value),
|
|
// the body a circle in the two-pixel line with a pointer in white and a
|
|
// centre mark, and short centre lines standing out at the sides.
|
|
// A dial 30 points or more in radius (`big`) is drawn as a cross-section:
|
|
// the left half is the knob's face, the right half is cut away to show the
|
|
// section, its housing wall hatched, the bearing balls on their race and
|
|
// the shaft hatched, the section plane a chain line down the middle; and
|
|
// two numbered balloons in the lower corners of its box point on leader
|
|
// lines at the housing and at a ball. Below 12 points in radius a knob
|
|
// keeps its band, body and pointer and drops the scale.
|
|
// Angles run clockwise from straight down, the way the scale reads: a
|
|
// quarter turn is the left, a half the top.
|
|
let bp_ang = fn(q: vec2) -> float {
|
|
var a = atan2(0.0 - q.x, q.y)
|
|
if a < 0.0 {
|
|
a = a + 6.2831853
|
|
}
|
|
return a
|
|
}
|
|
let bp_dir = fn(a: float) -> vec2 {
|
|
return vec2(0.0 - sin(a), cos(a))
|
|
}
|
|
// The part b0..b1 of an annulus centred on radius `rm`, `hw` either side,
|
|
// as a signed distance with square ends.
|
|
let bp_arcband = fn(rl: float, a: float, rm: float, hw: float, b0: float, b1: float) -> float {
|
|
let dr = abs(rl - rm) - hw
|
|
let da = max(b0 - a, a - b1) * rl
|
|
return max(dr, da)
|
|
}
|
|
// A chain line (long dash, gap, dot, gap), `t` points along it.
|
|
let bp_chain = fn(t: float) -> float {
|
|
let s = fract(t / 9.0) * 9.0
|
|
return max(step(s, 5.0), step(6.5, s) * step(s, 7.5))
|
|
}
|
|
let bp_knob = fn(p: vec2, c: vec2, rad: float, px: float, gap: float, pos: float, org: float, arc_org: float, hover: float, focus: float, drag: float, disabled: float, rs: vec2) -> vec4 {
|
|
let live = 1.0 - disabled
|
|
let hov = hover * live
|
|
let drg = drag * live
|
|
let big = step(30.0, rad)
|
|
let span = 6.2831853 - gap
|
|
let a0 = gap * 0.5
|
|
let a1 = a0 + span
|
|
let av = a0 + span * pos
|
|
let ao = a0 + span * org
|
|
let s0 = mix(a0, min(ao, av), arc_org)
|
|
let s1 = mix(av, max(ao, av), arc_org)
|
|
let q = p - c
|
|
let rl = length(q)
|
|
let a = bp_ang(q)
|
|
let lw = 2.0 * px
|
|
var ink = mix(bp_ink(), bp_white(), max(hov, drg))
|
|
ink = mix(ink, bp_off(), disabled)
|
|
var sky = mix(bp_sky(), bp_sky_hi(), drg)
|
|
sky = mix(sky, bp_off(), disabled)
|
|
let dimc = mix(bp_dimc(), bp_off(), disabled)
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
|
|
// The scale.
|
|
let n = mix(10.0, 20.0, big)
|
|
let f = (a - a0) / span
|
|
let tq = f * n
|
|
let ti = floor(tq + 0.5)
|
|
let tx = abs(tq - ti) * span / n * rl
|
|
let major = step(fract(ti / 5.0 + 0.01), 0.05)
|
|
let scaled = step(12.0, rad)
|
|
let tl = rad * mix(mix(0.10, 0.17, major), mix(0.05, 0.09, major), big)
|
|
let tk = Finish.cover(tx - 0.5 * px, px) * step(rad - tl, rl) * step(rl, rad) * step(-0.5, ti) * step(ti, n + 0.5) * scaled
|
|
out = bp_put(out, dimc, tk)
|
|
|
|
// The travel band.
|
|
let tmax = rad * mix(0.17, 0.09, big) * scaled
|
|
let bo = rad - tmax - Finish.snap(mix(1.0, 1.5, big), px) * scaled
|
|
let bw = max(Finish.snap(rad * mix(mix(0.24, 0.15, scaled), 0.07, big), px), mix(3.0, 4.0, scaled) * px)
|
|
let rb = bo - bw
|
|
let rm = bo - bw * 0.5
|
|
let bd = bp_arcband(rl, a, rm, bw * 0.5, a0, a1)
|
|
let ld = bp_arcband(rl, a, rm, bw * 0.5 - px, s0, s1)
|
|
out = bp_put(out, bp_face(), Finish.cover(bd, px) * 0.85)
|
|
out = bp_put(out, sky, Finish.cover(ld, px) * step(0.001, s1 - s0))
|
|
out = bp_put(out, ink, Finish.band(bd, 0.0, px, px))
|
|
|
|
// The body.
|
|
let bdd = rl - rb
|
|
let bin = Finish.cover(bdd, px)
|
|
out = bp_put(out, mix(bp_face(), bp_face_hi(), hov * 0.6), bin)
|
|
let right = step(0.0, q.x) * big
|
|
|
|
// The section, in the right half of a big dial: the housing wall
|
|
// hatched, the bearing race and its balls, the shaft hatched.
|
|
let wall = step(rb * 0.80, rl) * Finish.cover(bdd + lw, px)
|
|
out = bp_put(out, ink, wall * bp_hatch(q, 2.5, px) * right * 0.55)
|
|
out = bp_put(out, ink, Finish.cover(abs(rl - rb * 0.80) - 0.5 * px, px) * right)
|
|
let race = Finish.cover(abs(abs(rl - rb * 0.6) - rb * 0.075) - 0.5 * px, px) * step(rl, rb * 0.79)
|
|
out = bp_put(out, dimc, race * right)
|
|
let bstep = 0.3926991
|
|
let ba = atan2(q.y, q.x)
|
|
let bk = clamp(floor(ba / bstep + 0.5), -3.0, 3.0)
|
|
let bc = vec2(cos(bk * bstep), sin(bk * bstep)) * rb * 0.6
|
|
let ball = Finish.cover(abs(length(q - bc) - rb * 0.055) - 0.5 * px, px)
|
|
out = bp_put(out, ink, ball * right)
|
|
let shaft = rl - rb * 0.18
|
|
out = bp_put(out, ink, Finish.cover(shaft, px) * bp_hatch(q, 1.6, px) * right * 0.7)
|
|
out = bp_put(out, ink, Finish.band(shaft, 0.0, px, px) * big)
|
|
// The section plane: a chain line down the middle.
|
|
let plane = Finish.cover(abs(q.x) - 0.5 * px, px) * step(abs(q.y), rb) * bp_chain(q.y + rb) * big
|
|
out = bp_put(out, dimc, plane)
|
|
|
|
// The body's line, and the centre lines standing out at the sides.
|
|
out = bp_put(out, ink, Finish.band(bdd, 0.0, lw, px))
|
|
let cl = Finish.cover(abs(q.y) - 0.5 * px, px) * step(rad + 1.0, abs(q.x)) * step(abs(q.x), rad + 4.5) * scaled
|
|
out = bp_put(out, dimc, cl)
|
|
// The centre mark.
|
|
let arm = max(rb * 0.16, 1.5)
|
|
let cm = max(Finish.cover(abs(q.y) - 0.5 * px, px) * step(abs(q.x), arm), Finish.cover(abs(q.x) - 0.5 * px, px) * step(abs(q.y), arm)) * (1.0 - big)
|
|
out = bp_put(out, dimc, cm)
|
|
let hline = Finish.cover(abs(q.y) - 0.5 * px, px) * step(q.x, 0.0) * step(0.0 - rb, q.x) * bp_chain(0.0 - q.x) * big
|
|
out = bp_put(out, dimc, hline)
|
|
|
|
// The pointer.
|
|
let pd = bp_seg(q, bp_dir(av) * rb * mix(0.22, 0.24, big), bp_dir(av) * (rb - Finish.snap(2.0, px)))
|
|
out = bp_put(out, ink, Finish.cover(pd - mix(1.0, 1.5, big) * px, px))
|
|
|
|
// The balloons of a big dial, in the lower corners of its box.
|
|
if big > 0.5 {
|
|
let br = max(5.5, 0.085 * rad)
|
|
let cap = br * 0.95
|
|
let b1 = vec2(c.x - min(0.98 * rad, c.x - br + 2.0), c.y + 0.98 * rad)
|
|
let b2 = vec2(c.x + min(0.98 * rad, rs.x - c.x - br + 2.0), c.y + 0.98 * rad)
|
|
let t1 = c + vec2(0.25, 0.86) * rb
|
|
let t2 = c + vec2(0.7071, 0.7071) * rb * 0.6
|
|
let u1 = normalize(t1 - b1)
|
|
let u2 = normalize(t2 - b2)
|
|
var bl = Finish.cover(abs(length(p - b1) - br) - 0.5 * px, px)
|
|
bl = max(bl, Finish.cover(abs(length(p - b2) - br) - 0.5 * px, px))
|
|
bl = max(bl, Finish.cover(bp_seg(p, b1 + u1 * br, t1) - 0.5 * px, px))
|
|
bl = max(bl, Finish.cover(bp_seg(p, b2 + u2 * br, t2) - 0.5 * px, px))
|
|
bl = max(bl, Finish.cover(min(length(p - t1), length(p - t2)) - 1.2, px))
|
|
out = bp_put(out, dimc, bl)
|
|
let gw = max(px, cap * 0.13)
|
|
let g1 = bp_char(p, b1 - vec2(cap * 1.9 / 6.0, cap * 0.5), cap, 1.0, gw, px)
|
|
let g2 = bp_char(p, b2 - vec2(cap * 2.0 / 6.0, cap * 0.5), cap, 2.0, gw, px)
|
|
out = bp_put(out, ink, max(g1, g2))
|
|
}
|
|
|
|
// Focus: the marquee round the body.
|
|
return bp_focus(out, p, c, vec2(rad, rad), rad, px, focus * live)
|
|
}
|
|
// The quad is grown by 8 points for the centre lines and the balloons. A
|
|
// box with no room for a dial of 4 points in radius draws nothing.
|
|
mod.widgets.RotaryFlat.clip_x = false
|
|
mod.widgets.RotaryFlat.clip_y = false
|
|
mod.widgets.RotaryFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(8.0, 8.0), self.rect_size + vec2(16.0, 16.0))
|
|
}
|
|
mod.widgets.RotaryFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(16.0, 16.0)) - vec2(8.0, 8.0)
|
|
let dia = min(self.rect_size.x, self.rect_size.y - 22.0)
|
|
let r = dia * 0.5 - 5.0
|
|
let c = vec2(Finish.snap(self.rect_pos.x + self.rect_size.x * 0.5, px), Finish.snap(self.rect_pos.y + 22.0 + dia * 0.5, px)) - self.rect_pos
|
|
return bp_knob(p, c, max(r, 4.0), px, self.gap * 0.017453, self.slide_pos, self.origin_pos, self.arc_origin, self.hover, self.focus, self.drag, self.disabled, self.rect_size) * step(4.0, r)
|
|
}
|
|
mod.widgets.RotaryKnob.clip_x = false
|
|
mod.widgets.RotaryKnob.clip_y = false
|
|
mod.widgets.RotaryKnob.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(8.0, 8.0), self.rect_size + vec2(16.0, 16.0))
|
|
}
|
|
mod.widgets.RotaryKnob.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(16.0, 16.0)) - vec2(8.0, 8.0)
|
|
let dia = min(self.rect_size.x, self.rect_size.y)
|
|
let r = dia * 0.5 - 5.0
|
|
let c = vec2(Finish.snap(self.rect_pos.x + self.rect_size.x * 0.5, px), Finish.snap(self.rect_pos.y + self.rect_size.y - dia * 0.5, px)) - self.rect_pos
|
|
return bp_knob(p, c, max(min(r, 29.0), 4.0), px, self.gap * 0.017453, self.slide_pos, self.origin_pos, self.arc_origin, self.hover, self.focus, self.drag, self.disabled, self.rect_size) * step(4.0, r)
|
|
}
|
|
mod.widgets.RotaryKnob.draw_text.color = #eef6ff
|
|
mod.widgets.RotaryKnob.draw_text.color_hover = #ffffff
|
|
mod.widgets.RotaryKnob.draw_text.color_focus = #ffffff
|
|
mod.widgets.RotaryKnob.draw_text.color_drag = #ffffff
|
|
mod.widgets.RotaryKnob.draw_text.color_disabled = #86a6cb
|
|
mod.widgets.RotaryKnob.draw_text.text_style = mod.theme.font_regular{font_size: 8.5}
|
|
|
|
// READOUTS. The value beside a dial is a boxed figure, as a drawing boxes
|
|
// a basic dimension: the face under the two-pixel line.
|
|
let bp_readout = fn(p: vec2, o: vec2, s: vec2, px: float) -> vec4 {
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px)
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 2.0)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.9 * inside, 0.9 * inside)
|
|
return bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
mod.widgets.RotaryFlat.text_input.min_height = 0.0
|
|
mod.widgets.RotaryFlat.text_input.padding = mod.turtle.Inset{left: 6.0 right: 6.0 top: 3.0 bottom: 3.0}
|
|
mod.widgets.RotaryFlat.text_input.draw_text.color = #eef6ff
|
|
mod.widgets.RotaryFlat.text_input.draw_text.text_style = mod.theme.font_regular{font_size: 9.0}
|
|
// The value is selected while the dial is dragged, so typing replaces
|
|
// it; the selection is never painted, in any state, so the number
|
|
// stays readable under the hand.
|
|
mod.widgets.RotaryFlat.text_input.draw_selection.color = #0000
|
|
mod.widgets.RotaryFlat.text_input.draw_selection.color_hover = #0000
|
|
mod.widgets.RotaryFlat.text_input.draw_selection.color_focus = #0000
|
|
mod.widgets.RotaryFlat.text_input.draw_selection.color_down = #0000
|
|
mod.widgets.RotaryFlat.text_input.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_readout(self.pos * self.rect_size, self.rect_pos, self.rect_size, px)
|
|
}
|
|
// The value inside a slider is a bare figure: the field row's height must
|
|
// not reach it, or its text drops below the rail.
|
|
mod.widgets.SliderMinimal.text_input.min_height = 0.0
|
|
mod.widgets.SliderFlat.text_input.min_height = 0.0
|
|
mod.widgets.SliderRoundFlat.text_input.min_height = 0.0
|
|
mod.widgets.SliderFlat.text_input.draw_text.color = #eef6ff
|
|
mod.widgets.SliderMinimal.text_input.draw_text.color = #eef6ff
|
|
mod.widgets.SliderRoundFlat.text_input.draw_text.color = #eef6ff
|
|
mod.widgets.SliderFlat.text_input.draw_text.text_style = mod.theme.font_regular{font_size: 9.5}
|
|
mod.widgets.SliderMinimal.text_input.draw_text.text_style = mod.theme.font_regular{font_size: 9.5}
|
|
mod.widgets.SliderRoundFlat.text_input.draw_text.text_style = mod.theme.font_regular{font_size: 9.5}
|
|
mod.widgets.ComboBoxFlat.input.min_height = 0.0
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// TEXT FIELDS. The two-pixel line round a well the paper shows through, so
|
|
// the grid runs on under the field; under the pointer the line turns white,
|
|
// on focus it takes the sky and the marquee stands off it; read only, the
|
|
// line is dashed in the dim ink.
|
|
let bp_field = fn(p: vec2, o: vec2, s: vec2, px: float, hover: float, down: float, focus: float, disabled: float) -> vec4 {
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px)
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let d = Material.sd_box(p, c, h, 2.0)
|
|
let live = 1.0 - disabled
|
|
let hv = hover * live
|
|
let fc = focus * live
|
|
let dn = down * live
|
|
let inside = Finish.cover(d, px)
|
|
var face = mix(bp_well(), bp_face_hi(), hv * 0.4)
|
|
face = mix(face, bp_face_lo(), dn)
|
|
let fa = mix(0.55, 0.3, disabled)
|
|
var out = vec4(face * fa * inside, fa * inside)
|
|
var lc = mix(bp_ink(), bp_white(), hv)
|
|
lc = mix(lc, bp_sky(), max(fc, dn))
|
|
lc = mix(lc, bp_off(), disabled)
|
|
let dash = mix(1.0, bp_dash(p.x + p.y, 5.0, 0.6), disabled)
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, 2.0 * px, px) * dash)
|
|
return bp_focus(out, p, c, h, 2.0, px, fc)
|
|
}
|
|
mod.widgets.TextInputFlat.clip_x = false
|
|
mod.widgets.TextInputFlat.clip_y = false
|
|
mod.widgets.TextInputFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.TextInputFlat.draw_bg.pixel = fn() {
|
|
if self.border_size < 0.01 {
|
|
return vec4(0.0, 0.0, 0.0, 0.0)
|
|
}
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_field(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.disabled)
|
|
}
|
|
mod.widgets.TextInputFlat.padding.left = 9.0
|
|
mod.widgets.TextInputFlat.padding.right = 9.0
|
|
mod.widgets.FieldWell.clip_x = false
|
|
mod.widgets.FieldWell.clip_y = false
|
|
mod.widgets.FieldWell.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_field(self.pos * self.rect_size, self.rect_pos, self.rect_size, px, self.hover, 0.0, self.focus, self.disabled)
|
|
}
|
|
mod.widgets.NumberField.clip_x = false
|
|
mod.widgets.NumberField.clip_y = false
|
|
mod.widgets.NumberField.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.NumberField.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_field(p, self.rect_pos, self.rect_size, px, self.hover, 0.0, self.focus, self.disabled)
|
|
}
|
|
// The stepper: its own column behind a two-pixel divider, split across
|
|
// the middle by a hairline; the half under the pointer takes the wash at
|
|
// a third, the held half the recess hatch; the arrows are the white ink.
|
|
mod.widgets.NumberSpin.draw_text.color = #eef6ff
|
|
mod.widgets.NumberSpin.draw_text.text_style = mod.theme.font_regular{font_size: 6.0 line_spacing: 1.0}
|
|
mod.widgets.NumberSpin.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let mid = Finish.snap(self.rect_pos.y + self.rect_size.y * 0.5, px) - self.rect_pos.y
|
|
let upper = step(p.y, mid)
|
|
let live = 1.0 - self.disabled
|
|
let hot = mix(max(0.0, 0.0 - self.hot), max(0.0, self.hot), upper) * live
|
|
let down = mix(max(0.0, 0.0 - self.down), max(0.0, self.down), upper) * live
|
|
let x0 = Finish.snap(self.rect_pos.x, px) - self.rect_pos.x
|
|
let a = 0.35 * hot * step(x0 + 2.0 * px, p.x) * step(2.0 * px, p.y) * step(p.y, self.rect_size.y - 2.0 * px)
|
|
var out = vec4(bp_wash() * a, a)
|
|
out = bp_put(out, bp_ink(), bp_hatch(p, 2.5, px) * down * 0.5 * step(x0 + 2.0 * px, p.x) * step(2.0 * px, p.y) * step(p.y, self.rect_size.y - 2.0 * px))
|
|
let groove = Finish.cover(abs(p.y - mid - 0.5 * px) - 0.5 * px, px) * step(x0 + 2.0 * px, p.x) * step(p.x, self.rect_size.x - 2.0 * px)
|
|
let side = step(x0, p.x) * step(p.x, x0 + 2.0 * px)
|
|
var lc = mix(bp_ink(), bp_off(), self.disabled)
|
|
out = bp_put(out, mix(bp_dimc(), bp_off(), self.disabled), groove)
|
|
return bp_put(out, lc, side)
|
|
}
|
|
|
|
// DROP-DOWNS. The button's face and line, a two-pixel divider 22 points
|
|
// from the right edge and a chevron in the cell it makes; open, the face
|
|
// takes the wash and the chevron turns over.
|
|
let bp_dropdown = fn(p: vec2, o: vec2, s: vec2, px: float, hover: float, down: float, focus: float, open: float, disabled: float) -> vec4 {
|
|
let live = 1.0 - disabled
|
|
var f = bp_button(p, o, s, px, hover, down * hover, focus, disabled, 0.0)
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px)
|
|
let inside = Finish.cover(Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5 - vec2(2.0 * px, 2.0 * px), 1.0), px)
|
|
f = bp_put(f, bp_wash(), inside * open * live * 0.8)
|
|
var lc = mix(bp_ink(), bp_white(), hover * live)
|
|
lc = mix(lc, bp_off(), disabled)
|
|
let dx = Finish.snap(o.x + s.x - 22.0, px) - o.x
|
|
let div = step(dx, p.x) * step(p.x, dx + 2.0 * px) * step(5.0, p.y) * step(p.y, s.y - 5.0)
|
|
f = bp_put(f, lc, div)
|
|
let c = vec2(s.x - 11.0, Finish.snap(o.y + s.y * 0.5, px) - o.y)
|
|
let fl = mix(1.0, -1.0, open)
|
|
let a = c + vec2(-3.5, -1.75 * fl)
|
|
let b = c + vec2(0.0, 1.75 * fl)
|
|
let e = c + vec2(3.5, -1.75 * fl)
|
|
let ch = min(bp_seg(p, a, b), bp_seg(p, b, e))
|
|
return bp_put(f, lc, Finish.cover(ch - 0.75 * px, px))
|
|
}
|
|
mod.widgets.DropDownFlat.clip_x = false
|
|
mod.widgets.DropDownFlat.clip_y = false
|
|
mod.widgets.DropDownFlat.padding.left = 10.0
|
|
mod.widgets.DropDownFlat.padding.right = 30.0
|
|
mod.widgets.DropDownFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.DropDownFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
return bp_dropdown(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, self.active, self.disabled)
|
|
}
|
|
mod.widgets.ComboBoxFlat.clip_x = false
|
|
mod.widgets.ComboBoxFlat.clip_y = false
|
|
mod.widgets.ComboBoxFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.ComboBoxFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
return bp_dropdown(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, 0.0, self.disabled)
|
|
}
|
|
|
|
// OPEN LISTS. A sheet of the face under the two-pixel line; a row under
|
|
// the hand takes the wash, the chosen row a sky bar at its left and the
|
|
// wash at a third.
|
|
let bp_menu = fn(p: vec2, size: vec2, px: float) -> vec4 {
|
|
let d = Material.sd_box(p, size * 0.5, size * 0.5 - vec2(0.5 * px, 0.5 * px), 2.0)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * inside, inside)
|
|
return bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
let bp_row = fn(p: vec2, size: vec2, px: float, hover: float, active: float, disabled: float) -> vec4 {
|
|
let inb = step(3.0 * px, p.x) * step(p.x, size.x - 3.0 * px)
|
|
let a = max(0.75 * hover * (1.0 - disabled), 0.35 * active) * inb
|
|
var out = vec4(bp_wash() * a, a)
|
|
let bar = step(4.0 * px, p.x) * step(p.x, 7.0 * px) * step(3.0, p.y) * step(p.y, size.y - 3.0)
|
|
return bp_put(out, bp_sky(), bar * active)
|
|
}
|
|
mod.widgets.PopupMenuFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_menu(self.pos * self.rect_size, self.rect_size, px)
|
|
}
|
|
mod.widgets.PopupMenuItem.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_row(self.pos * self.rect_size, self.rect_size, px, self.hover, self.active, self.disabled)
|
|
}
|
|
mod.widgets.PopupMenuItem.draw_text.color = #eef6ff
|
|
mod.widgets.PopupMenuItem.draw_text.color_hover = #ffffff
|
|
mod.widgets.PopupMenuItem.draw_text.color_active = #ffffff
|
|
mod.widgets.ComboBoxFlat.draw_popup_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_menu(self.pos * self.rect_size, self.rect_size, px)
|
|
}
|
|
mod.widgets.ComboBoxFlat.draw_item.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_row(self.pos * self.rect_size, self.rect_size, px, self.hover, self.active, 0.0)
|
|
}
|
|
mod.widgets.ComboBoxFlat.draw_item_text.color = #eef6ff
|
|
|
|
// The select wears a button built before this sheet: it is given the
|
|
// drop-down's face, chevron and all, and the same grown quad.
|
|
mod.widgets.Select.clip_x = false
|
|
mod.widgets.Select.clip_y = false
|
|
mod.widgets.MultiSelect.clip_x = false
|
|
mod.widgets.MultiSelect.clip_y = false
|
|
mod.widgets.Select.face.clip_x = false
|
|
mod.widgets.Select.face.clip_y = false
|
|
mod.widgets.Select.face.padding = mod.turtle.Inset{left: 10.0 right: 30.0 top: 4.0 bottom: 4.0}
|
|
mod.widgets.Select.face.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.Select.face.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
return bp_dropdown(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, 0.0, self.disabled)
|
|
}
|
|
mod.widgets.MultiSelect.face.clip_x = false
|
|
mod.widgets.MultiSelect.face.clip_y = false
|
|
mod.widgets.MultiSelect.face.padding = mod.turtle.Inset{left: 10.0 right: 30.0 top: 4.0 bottom: 4.0}
|
|
mod.widgets.MultiSelect.face.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.MultiSelect.face.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
return bp_dropdown(p, self.rect_pos, self.rect_size, px, self.hover, self.down, self.focus, 0.0, self.disabled)
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// PROGRESS. A slot with round ends in the two-pixel line; the done part is
|
|
// section-hatched in the intent's ink and closed by a two-pixel cut line;
|
|
// the unknown amount is a dotted line along the slot, held still (a face
|
|
// may not read the pass clock).
|
|
let bp_hues = fn(i: float) -> vec3 {
|
|
var h = vec3(0.612, 0.847, 0.980)
|
|
if i > 0.5 { h = vec3(0.557, 0.941, 0.722) }
|
|
if i > 1.5 { h = vec3(1.0, 0.820, 0.400) }
|
|
if i > 2.5 { h = vec3(0.957, 0.420, 0.400) }
|
|
if i > 3.5 { h = vec3(0.612, 0.847, 0.980) }
|
|
if i > 4.5 { h = vec3(0.569, 0.773, 0.969) }
|
|
return h
|
|
}
|
|
mod.widgets.ProgressBarFlat.clip_x = false
|
|
mod.widgets.ProgressBarFlat.clip_y = false
|
|
mod.widgets.ProgressBarFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(4.0, 4.0), self.rect_size + vec2(8.0, 8.0))
|
|
}
|
|
mod.widgets.ProgressBarFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(8.0, 8.0)) - vec2(4.0, 4.0)
|
|
let o = self.rect_pos
|
|
let hue = bp_hues(self.intent)
|
|
let th = min(max(self.thickness, 8.0), self.rect_size.y)
|
|
let y0 = Finish.snap(o.y + (self.rect_size.y - th) * 0.5, px) - o.y
|
|
let y1 = y0 + Finish.snap(th, px)
|
|
let x0 = Finish.snap(o.x + self.rect_size.x * self.start, px) - o.x
|
|
let x1 = Finish.snap(o.x + self.rect_size.x * self.end, px) - o.x
|
|
let c = vec2((x0 + x1) * 0.5, (y0 + y1) * 0.5)
|
|
let h = vec2((x1 - x0) * 0.5, (y1 - y0) * 0.5)
|
|
let d = Material.sd_box(p, c, h, h.y)
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px) * self.track
|
|
var out = vec4(bp_face() * 0.85 * inside, 0.85 * inside)
|
|
let fi = d + lw + px
|
|
if self.value >= 0.0 {
|
|
let xv = Finish.snap(o.x + mix(x0, x1, clamp((self.value - self.start) / max(self.end - self.start, 0.0001), 0.0, 1.0)), px) - o.x
|
|
let done = Finish.cover(max(fi, p.x - xv), px)
|
|
out = bp_put(out, hue, done * bp_hatch(p, 3.0, px))
|
|
let cut = step(xv - 2.0 * px, p.x) * step(p.x, xv) * Finish.cover(d + lw, px) * step(x0 + 3.0, xv)
|
|
out = bp_put(out, hue, cut)
|
|
} else {
|
|
let u = p.x - x0
|
|
let dq = vec2(u - 4.0 * floor(u / 4.0 + 0.5), p.y - c.y)
|
|
out = bp_put(out, hue, Finish.cover(length(dq) - 0.9, px) * Finish.cover(fi, px))
|
|
}
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, lw, px) * self.track)
|
|
return out * self.opacity
|
|
}
|
|
|
|
// RINGS, ARCS AND GAUGES. A ring is drawn as a circle in the dimension
|
|
// hairline with the reading over it as a stroke of the intent's ink, and
|
|
// where there is room a scale of 21 ticks inside it, every fifth longer.
|
|
// The unknown amount is a still quarter arc.
|
|
let bp_ring_seg = fn(rl: float, f: float, f0: float, f1: float, rc: float, w: float, sweep: float) -> float {
|
|
let dr = abs(rl - rc) - w * 0.5
|
|
let da = max(f0 - f, f - f1) * sweep * rl
|
|
return max(dr, da)
|
|
}
|
|
let bp_ring_ticks = fn(rl: float, f: float, f0: float, f1: float, r1: float, rad: float, sweep: float, px: float) -> vec2 {
|
|
let tq = f * 20.0
|
|
let ti = floor(tq + 0.5)
|
|
let tx = abs(tq - ti) * sweep / 20.0 * rl
|
|
let major = step(fract(ti / 5.0 + 0.01), 0.05)
|
|
let r0 = r1 - mix(0.06, 0.11, major) * rad
|
|
let tk = Finish.cover(tx - 0.5 * px, px) * step(r0, rl) * step(rl, r1) * step(-0.5, ti) * step(ti, 20.5) * step(f0 - 0.001, ti / 20.0) * step(ti / 20.0, f1 + 0.001)
|
|
return vec2(tk, major)
|
|
}
|
|
let bp_ring = fn(q: vec2, rad: float, inset: float, px: float, sweep: float, dir: float, f0: float, f1: float, value: float, ink: vec3, track: float, ticks: float) -> vec4 {
|
|
let w = clamp(floor(0.07 * 2.0 * rad + 0.5), 2.0, 5.0) * px
|
|
let rc = rad - inset - w * 0.5 - px
|
|
let rl = length(q)
|
|
let a0 = (6.2831853 - sweep) * 0.5
|
|
var f = (bp_ang(q) - a0) / max(sweep, 0.001)
|
|
f = mix(f, 1.0 - f, step(dir, 0.0))
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
let tk = bp_ring_ticks(rl, f, f0, f1, rc - w * 0.5 - 2.0 * px, rad, sweep, px)
|
|
out = bp_put(out, bp_dimc(), tk.x * ticks)
|
|
let td = bp_ring_seg(rl, f, f0, f1, rc, px, sweep)
|
|
out = bp_put(out, bp_dimc(), Finish.cover(td, px) * track)
|
|
if value >= 0.0 {
|
|
let v = clamp(value, f0, f1)
|
|
let on = step(0.0005, v - f0)
|
|
let ld = bp_ring_seg(rl, f, f0, v, rc, w, sweep)
|
|
out = bp_put(out, ink, Finish.cover(ld, px) * on)
|
|
} else {
|
|
let qe = f0 + 0.25 * (f1 - f0)
|
|
let ld = bp_ring_seg(rl, f, f0, qe, rc, w, sweep)
|
|
out = bp_put(out, ink, Finish.cover(ld, px))
|
|
}
|
|
return out
|
|
}
|
|
mod.widgets.ProgressRingFlat.draw_bg.sweep = 4.712389
|
|
mod.widgets.ProgressRingFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let c = vec2(self.rect_size.x * 0.5, self.rect_size.y * self.center_y)
|
|
let rad = min(self.rect_size.x * 0.5, self.rect_size.y * self.center_y)
|
|
let ink = bp_hues(self.intent)
|
|
let ticks = step(44.0, 2.0 * rad) * step(self.inset, 0.01)
|
|
return bp_ring(p - c, rad, self.inset, px, self.sweep, self.direction, self.start, self.end, self.value, ink, self.track, ticks) * self.opacity
|
|
}
|
|
mod.widgets.ActivityRings.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let c = vec2(self.rect_size.x * 0.5, self.rect_size.y * self.center_y)
|
|
let rad = min(self.rect_size.x * 0.5, self.rect_size.y * self.center_y)
|
|
return bp_ring(p - c, rad, self.inset, px, self.sweep, self.direction, self.start, self.end, self.value, bp_sky(), self.track, 0.0) * self.opacity
|
|
}
|
|
|
|
// The gauge: the ring over 270 degrees, lit in sky to the warning mark,
|
|
// the amber pencil to the critical one, the red pencil above; the needle a
|
|
// white line with a small square tip on an outlined pivot. Laid flat, the
|
|
// progress slot with a needle across it.
|
|
let bp_zone = fn(f: float, warn: float, crit: float) -> vec3 {
|
|
var z = vec3(0.612, 0.847, 0.980)
|
|
if f > warn {
|
|
z = vec3(1.0, 0.820, 0.400)
|
|
}
|
|
if f > crit {
|
|
z = vec3(0.957, 0.420, 0.400)
|
|
}
|
|
return z
|
|
}
|
|
let bp_gauge_arc = fn(q: vec2, rad: float, px: float, sweep: float, v: float, warn: float, crit: float, needle: float) -> vec4 {
|
|
let w = clamp(floor(0.07 * 2.0 * rad + 0.5), 2.0, 5.0) * px
|
|
let rc = rad - w * 0.5 - px
|
|
let rl = length(q)
|
|
let a0 = (6.2831853 - sweep) * 0.5
|
|
let f = (bp_ang(q) - a0) / max(sweep, 0.001)
|
|
let z = bp_zone(f, warn, crit)
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
let r1 = rc - w * 0.5 - 2.0 * px
|
|
let tk = bp_ring_ticks(rl, f, 0.0, 1.0, r1, rad, sweep, px)
|
|
out = bp_put(out, bp_dimc(), tk.x)
|
|
out = bp_put(out, bp_dimc(), Finish.cover(bp_ring_seg(rl, f, 0.0, 1.0, rc, px, sweep), px))
|
|
out = bp_put(out, z, Finish.cover(bp_ring_seg(rl, f, warn, 1.0, rc, w, sweep), px) * 0.35)
|
|
out = bp_put(out, z, Finish.cover(bp_ring_seg(rl, f, 0.0, v, rc, w, sweep), px) * step(0.001, v))
|
|
let av = a0 + v * sweep
|
|
let dir = vec2(0.0 - sin(av), cos(av))
|
|
let tip = dir * (r1 - 0.12 * rad)
|
|
let nd = bp_seg(q, dir * 3.0, tip)
|
|
out = bp_put(out, bp_ink(), Finish.cover(nd - 0.75 * px, px) * needle)
|
|
out = bp_put(out, bp_ink(), Finish.band(rl - 2.5, 0.0, px, px) * needle)
|
|
let sq = max(abs(q.x - tip.x), abs(q.y - tip.y)) - px
|
|
return bp_put(out, bp_white(), Finish.cover(sq, px) * needle)
|
|
}
|
|
let bp_gauge_bar = fn(p: vec2, o: vec2, s: vec2, px: float, v: float, warn: float, crit: float, needle: float) -> vec4 {
|
|
let bh = Finish.snap(min(8.0, s.y), px)
|
|
let y0 = Finish.snap(o.y + (s.y - bh) * 0.5, px) - o.y
|
|
let lo = vec2(Finish.snap(o.x, px) - o.x, y0)
|
|
let hi = vec2(floor((o.x + s.x) / px) * px - o.x, y0 + bh)
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, bh * 0.5)
|
|
let f = clamp((p.x - lo.x) / max(hi.x - lo.x, 1.0), 0.0, 1.0)
|
|
let z = bp_zone(f, warn, crit)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.85 * inside, 0.85 * inside)
|
|
let fi = d + 3.0 * px
|
|
let xv = mix(lo.x + 3.0 * px, hi.x - 3.0 * px, v)
|
|
out = bp_put(out, z, Finish.cover(max(fi, p.x - xv), px) * bp_hatch(p, 3.0, px) * step(0.001, v))
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
let nx = Finish.snap(o.x + xv, px) - o.x
|
|
let nl = Finish.cover(abs(p.x - nx) - 0.75 * px, px) * step(lo.y - 4.0, p.y) * step(p.y, hi.y + 4.0)
|
|
return bp_put(out, bp_white(), nl * needle)
|
|
}
|
|
mod.widgets.Gauge.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let v = clamp(self.value, 0.0, 1.0)
|
|
var out = vec4(0.0, 0.0, 0.0, 0.0)
|
|
if self.linear > 0.5 {
|
|
out = bp_gauge_bar(p, self.rect_pos, self.rect_size, px, v, self.zone_warn, self.zone_critical, self.needle)
|
|
} else {
|
|
let c = self.rect_size * 0.5
|
|
let rad = min(self.rect_size.x, self.rect_size.y) * 0.5
|
|
out = bp_gauge_arc(p - c, rad, px, self.sweep, v, self.zone_warn, self.zone_critical, self.needle)
|
|
}
|
|
return out * self.opacity
|
|
}
|
|
mod.widgets.Gauge.draw_range.color = #b3d2f2
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// LAMPS. An LED set in a socket cut in the paper, drawn inside an outlined
|
|
// drafting circle with its centre marked by four short ticks outside it.
|
|
// The lens is a dome of coloured glass: lit, a white-hot core burning
|
|
// toward white, the most saturated colour at its rim and a tight halo in
|
|
// its own hue gone within the socket's ring; half lit, the same LED at
|
|
// lower current; out, dark tinted glass with a catch light along its
|
|
// lower rim. The socket is shaded under its upper edge and catches light
|
|
// along its lower one; a glint sits on the dome. Light is added, never
|
|
// painted.
|
|
let bp_led_add = fn(res: vec4, light: vec3, ground: vec3) -> vec4 {
|
|
let est = res.rgb + ground * (1.0 - res.a)
|
|
let add = (vec3(1.0, 1.0, 1.0) - exp(-light)) * max(vec3(1.0, 1.0, 1.0) - est, vec3(0.0, 0.0, 0.0))
|
|
return vec4(res.rgb + add, res.a)
|
|
}
|
|
let bp_led_full = fn(ink: vec3) -> vec3 {
|
|
return ink / max(max(ink.x, max(ink.y, ink.z)), 0.01)
|
|
}
|
|
let bp_led_hue = fn(ink: vec3, vivid: float) -> vec3 {
|
|
let f = bp_led_full(ink)
|
|
let mn = min(f.x, min(f.y, f.z))
|
|
let ch = 1.0 - mn
|
|
let pure = (f - vec3(mn, mn, mn)) / max(ch, 0.001)
|
|
return mix(f, pure, clamp(vivid, 0.0, 1.0) * 0.72 * smoothstep(0.03, 0.12, ch))
|
|
}
|
|
// The lamp: its lens a rounded box `hb` either side of `c` (round when the
|
|
// two are equal), `lit` its current, `ink` its colour, `bw` the socket's
|
|
// width round the lens, `ring` how far out the drafting outline stands.
|
|
let bp_led = fn(p: vec2, c: vec2, hb: vec2, lit: float, ink: vec3, vivid: float, px: float, bw: float, ring: float) -> vec4 {
|
|
let ground = vec3(0.082, 0.271, 0.467)
|
|
let rt = max(min(hb.x, hb.y), 0.4)
|
|
let d = Material.sd_box(p, c, hb, rt)
|
|
let ds = d - bw
|
|
let L = clamp(lit, 0.0, 1.0)
|
|
let b = bp_led_full(ink)
|
|
let hue = bp_led_hue(ink, vivid)
|
|
let pw = L * sqrt(L)
|
|
let white = vec3(1.0, 1.0, 1.0)
|
|
let ex = max(hb.x - hb.y, 0.0)
|
|
let ey = max(hb.y - hb.x, 0.0)
|
|
let qx = p.x - c.x
|
|
let qy = p.y - c.y
|
|
let q = vec2(qx - clamp(qx, 0.0 - ex, ex), qy - clamp(qy, 0.0 - ey, ey)) / rt
|
|
let t = clamp(length(q), 0.0, 1.0)
|
|
let nrm = q / max(length(q), 0.001)
|
|
var res = vec4(0.0, 0.0, 0.0, 0.0)
|
|
// The drafting outline and its centre ticks.
|
|
let rd = d - ring
|
|
let lc = vec3(0.890, 0.945, 1.0)
|
|
res = bp_put(res, lc, Finish.band(rd, 0.0, px, px) * 0.9)
|
|
let tkx = Finish.cover(abs(qy) - 0.5 * px, px) * step(hb.x + ring + 1.0, abs(qx)) * step(abs(qx), hb.x + ring + 3.0)
|
|
let tky = Finish.cover(abs(qx) - 0.5 * px, px) * step(hb.y + ring + 1.0, abs(qy)) * step(abs(qy), hb.y + ring + 3.0)
|
|
res = bp_put(res, vec3(0.569, 0.773, 0.969), max(tkx, tky))
|
|
// The socket: the paper cut away, shaded under its upper edge, a catch
|
|
// light along its lower one.
|
|
let a_s = Finish.cover(ds, px)
|
|
let gy = clamp(nrm.y * t, -1.0, 1.0)
|
|
var sc = ground * mix(0.42, 0.78, smoothstep(-0.9, 0.9, gy))
|
|
sc = mix(sc, min(ground * 1.1 + vec3(0.30, 0.30, 0.30), white), Finish.band(ds, 0.0, max(px, 0.45), px) * smoothstep(0.2, 0.95, nrm.y) * 0.85)
|
|
res = Finish.over(res, vec4(sc * a_s, a_s))
|
|
// The light, held inside the drafting outline.
|
|
if L > 0.001 {
|
|
let xl = max(d, 0.0)
|
|
let halo = exp(0.0 - xl / max(0.30 * rt, 0.4)) * 1.5 + exp(0.0 - xl / max(0.65 * rt, 0.7)) * 0.32
|
|
let hwin = 1.0 - smoothstep(bw * 0.6, ring - 0.5, xl)
|
|
res = bp_led_add(res, mix(hue, white, 0.15 * pw) * halo * pw * hwin, ground)
|
|
}
|
|
// The dome.
|
|
let top = smoothstep(-1.0, 0.6, q.y)
|
|
let pool = exp(0.0 - (q.y - 0.55) * (q.y - 0.55) / 0.09 - q.x * q.x / 0.30)
|
|
var on = mix(hue * mix(0.55, 0.8, L), mix(b, hue, 0.5), top)
|
|
on = mix(on, min(mix(b, hue, 0.4) + vec3(0.35, 0.35, 0.35), white), pool * 0.5)
|
|
on = mix(on, vec3(1.0, 0.995, 0.985), exp(0.0 - t * t / 0.26) * smoothstep(0.5, 1.0, L) * 0.95)
|
|
on = mix(on, hue * (0.82 + 0.18 * L), smoothstep(0.62, 1.0, t))
|
|
on = on * (0.42 + 0.58 * L)
|
|
let offc = mix(vec3(0.05, 0.07, 0.11), b * 0.35, 0.16)
|
|
var off = mix(offc * 0.62, offc * 1.08, top)
|
|
off = mix(off, min(offc + vec3(0.16, 0.16, 0.18), white), pool * 0.35)
|
|
off = off * mix(1.0, 0.75, smoothstep(0.75, 1.0, t))
|
|
let catchl = smoothstep(0.62, 0.9, t) * (1.0 - smoothstep(0.9, 1.0, t)) * smoothstep(0.2, 0.9, nrm.y)
|
|
off = off + vec3(0.30, 0.32, 0.36) * catchl
|
|
var col = mix(off, min(on, white), smoothstep(0.0, 0.35, L))
|
|
let e = length(vec2(q.x / 0.62, (q.y + 0.46) / 0.30))
|
|
let spec = (1.0 - smoothstep(0.55, 1.0, e)) * mix(1.0, 0.3, clamp((q.y + 0.76) / 0.6, 0.0, 1.0))
|
|
col = mix(col, white, spec * mix(0.8, 0.55, L) * smoothstep(0.9, 2.2, rt))
|
|
col = min(col, white)
|
|
let a_l = Finish.cover(d, px)
|
|
return Finish.over(res, vec4(col * a_l, a_l))
|
|
}
|
|
// The Lamp widget and the bar lamp. A dot is a little over a third of its
|
|
// box across with its socket and outline in the rest; a bar is a light
|
|
// pipe set three points in from the start of its box, so the whole lamp,
|
|
// outline and all, takes the first twenty points of its cell and leaves
|
|
// the rest of the row free.
|
|
mod.widgets.Lamp.halo = 0.3
|
|
mod.widgets.Lamp.halo_reach = 1.0
|
|
mod.widgets.Lamp.draw_bg.color_accent = uniform(#4fb8ff)
|
|
mod.widgets.Lamp.draw_bg.color_success = uniform(#2ee88a)
|
|
mod.widgets.Lamp.draw_bg.color_warning = uniform(#ffc21a)
|
|
mod.widgets.Lamp.draw_bg.color_error = uniform(#ff3a32)
|
|
mod.widgets.Lamp.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos, self.rect_size)
|
|
}
|
|
mod.widgets.Lamp.draw_bg.pixel = fn() {
|
|
let p = self.pos * self.rect_size
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let sz = self.rect_size
|
|
let bar = step(0.5, self.bar)
|
|
let m = min(sz.x, sz.y) * 0.5
|
|
let th = mix(m * 0.42, min(m * 0.26, 3.0), bar)
|
|
let hb = vec2(mix(th, 6.0, bar), th)
|
|
let bw = mix(clamp(0.3 * th, 1.2, 2.2), 1.3, bar)
|
|
let ring = bw + mix(Finish.snap(m * 0.16, px), 1.6, bar)
|
|
let c = vec2(mix(sz.x * 0.5, 3.0 + ring + hb.x, bar), sz.y * 0.5)
|
|
let res = bp_led(p, c, hb, self.lit, self.intent_color().rgb, 1.0 - step(3.5, self.intent), px, bw, ring)
|
|
return res * self.opacity
|
|
}
|
|
|
|
// LEVEL METERS. The two-pixel slot with round ends lying, square standing;
|
|
// lying and thick enough, its cells are dots one rung and a third apart;
|
|
// else short bars one rung apart. A cell is lit green, the amber pencil
|
|
// past the meter's first hot mark, the red pencil past its second; unlit,
|
|
// a faint ghost of its ink; the held peak in white. A meter given no rungs
|
|
// is one fill with the peak a white line across it. The over lamp is a
|
|
// small LED in its drafting circle beside the slot.
|
|
mod.widgets.LevelMeter.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p0 = self.pos * self.rect_size
|
|
let along = mix(self.rect_size.x, self.rect_size.y, self.vertical)
|
|
let across = mix(self.rect_size.y, self.rect_size.x, self.vertical)
|
|
let p = vec2(mix(p0.x, self.rect_size.y - p0.y, self.vertical), mix(p0.y, p0.x, self.vertical))
|
|
let lamp_room = self.lamp * (across + 4.0)
|
|
let bar = max(4.0, along - lamp_room)
|
|
let hi = vec2(Finish.snap(bar, px), Finish.snap(across, px))
|
|
let thin = step(across, 7.5)
|
|
let dots = (1.0 - thin) * (1.0 - self.vertical)
|
|
let solid = step(self.segment, 0.5)
|
|
let r = mix(1.5, hi.y * 0.5, 1.0 - self.vertical)
|
|
let d = Material.sd_box(p, hi * 0.5, hi * 0.5, mix(r, 1.0, thin))
|
|
let lw = mix(2.0 * px, px, thin)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.85 * inside, 0.85 * inside)
|
|
let pad = mix(3.0, 2.0, thin) * px + lw
|
|
let span = max(1.0, bar - pad * 2.0)
|
|
let pitch = mix(max(self.segment, 3.0), max(self.segment * 1.375, 4.5), dots)
|
|
let n = max(floor((span + 1.0) / pitch), 1.0)
|
|
let ci = floor((p.x - pad) / pitch)
|
|
let cx = pad + ci * pitch + pitch * 0.5
|
|
let share = mix((ci + 0.5) / n, (p.x - pad) / span, solid)
|
|
var hue = bp_green()
|
|
if share > self.hot_at {
|
|
hue = bp_amber()
|
|
}
|
|
if share > self.hot_to {
|
|
hue = bp_red()
|
|
}
|
|
let inbar = step(0.0, ci) * step(ci, n - 1.0)
|
|
let dotd = length(vec2(p.x - cx, p.y - hi.y * 0.5)) - min(hi.y * 0.5 - pad, 2.0)
|
|
let bard = Material.sd_box(p, vec2(cx, hi.y * 0.5), vec2(pitch * 0.5 - mix(1.0, 0.75, thin), hi.y * 0.5 - pad), 0.0)
|
|
let cd = mix(bard, dotd, dots)
|
|
let lit = step(share, self.level)
|
|
let held = step(abs(share - self.hold), 0.5 / n) * step(0.002, self.hold) * (1.0 - solid)
|
|
let ink = mix(mix(bp_face(), hue, 0.22), mix(hue, bp_white(), 0.5 * held), max(lit, held))
|
|
out = bp_put(out, ink, Finish.cover(cd, px) * inbar * (1.0 - solid))
|
|
// Solid, the reading is one fill and the mark a white line across it.
|
|
let fill = Finish.cover(max(d + lw + px, p.x - pad - self.level * span), px) * step(0.001, self.level)
|
|
out = bp_put(out, hue, fill * solid)
|
|
let mk = Finish.cover(abs(p.x - pad - self.hold * span) - px, px) * Finish.cover(d + lw, px) * step(0.002, self.hold)
|
|
out = bp_put(out, bp_white(), mk * solid)
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, lw, px))
|
|
if self.lamp > 0.5 {
|
|
let lr = across * 0.5
|
|
let lc = vec2(bar + 4.0 + lr, across * 0.5)
|
|
let led = bp_led(p, lc, vec2(lr * 0.45, lr * 0.45), step(0.5, self.over), vec3(1.0, 0.227, 0.196), 1.0, px, lr * 0.18, lr * 0.75)
|
|
out = Finish.over(out, led)
|
|
}
|
|
return out * self.opacity
|
|
}
|
|
mod.widgets.LevelMeterColumn.width = 14.0
|
|
|
|
// SCROLL BARS. The rail is a slim slot in hairlines; the thumb a two-pixel
|
|
// sky line inside it, three pixels and white under the hand.
|
|
mod.widgets.ScrollBar.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p0 = self.pos * self.rect_size
|
|
let along = mix(self.rect_size.x, self.rect_size.y, self.is_vertical)
|
|
let across = mix(self.rect_size.y, self.rect_size.x, self.is_vertical)
|
|
let p = vec2(mix(p0.x, p0.y, self.is_vertical), mix(p0.y, p0.x, self.is_vertical))
|
|
let o = mix(self.rect_pos.y, self.rect_pos.x, self.is_vertical)
|
|
let mid = Finish.snap(o + across * 0.5, px) - o
|
|
let rail = Material.sd_box(p, vec2(along * 0.5, mid), vec2(along * 0.5 - 2.0, 2.5), 2.5)
|
|
var out = vec4(bp_face() * 0.6 * Finish.cover(rail, px), 0.6 * Finish.cover(rail, px))
|
|
out = bp_put(out, bp_dimc(), Finish.band(rail, 0.0, px, px) * 0.8)
|
|
let a = along * self.norm_scroll
|
|
let b = a + along * self.norm_handle
|
|
let warm = max(self.hover, self.drag)
|
|
let w = mix(1.0, 1.5, warm) * px
|
|
let d = Material.sd_box(p, vec2((a + b) * 0.5, mid), vec2(max((b - a) * 0.5 - 4.0, 2.0), w), w)
|
|
out = bp_put(out, mix(bp_sky(), bp_white(), warm), Finish.cover(d, px))
|
|
return out * self.opacity
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// TABS. On the tab strip every tab is an outlined arrow, pointing on to the
|
|
// next; a radio tab is a plain box that shows its line only under the
|
|
// pointer and while chosen. The chosen tab takes the wash, the two-pixel
|
|
// line and a short sky bar laid on its foot line under its title (`mark`;
|
|
// a dock's tab, whose title sits low on its bar, goes without).
|
|
let bp_tab = fn(p: vec2, o: vec2, s: vec2, px: float, hover: float, focus: float, active: float, down: float, arrow: float, mark: float) -> vec4 {
|
|
let lo = bp_lo(o, px) + vec2(0.0, Finish.snap(1.0, px))
|
|
let hi = bp_hi(o, s, px) - vec2(Finish.snap(2.0, px) * arrow, Finish.snap(2.0, px))
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let k = h.y * 0.36
|
|
// The arrow: a box whose right end is a point.
|
|
let tip = vec2(hi.x, c.y)
|
|
let n1 = normalize(vec2(h.y, 0.0 - k))
|
|
let n2 = normalize(vec2(h.y, k))
|
|
var da = max(max(lo.x - p.x, lo.y - p.y), p.y - hi.y)
|
|
da = max(da, max(dot(p - tip, n1), dot(p - tip, n2)))
|
|
let db = Material.sd_box(p, c, h, 2.0)
|
|
let d = mix(db, da, arrow)
|
|
let inside = Finish.cover(d, px)
|
|
let wash = (0.4 * hover * (1.0 - active) + 0.85 * active) * inside
|
|
var out = vec4(mix(bp_wash(), bp_face_lo(), down * (1.0 - active)) * wash, wash)
|
|
out = bp_put(out, bp_face(), inside * 0.85 * arrow * (1.0 - max(active, hover)))
|
|
let shown = max(max(arrow, active), hover * 0.8)
|
|
var lc = mix(bp_ink(), bp_white(), max(hover, active))
|
|
out = bp_put(out, lc, Finish.band(d, 0.0, mix(px, 2.0 * px, max(active, arrow)), px) * shown)
|
|
let ux0 = lo.x + 9.0
|
|
let ux1 = lo.x + 9.0 + max((hi.x - lo.x - 18.0 - 12.0 * arrow) * 0.45, 10.0)
|
|
let ul = step(ux0, p.x) * step(p.x, ux1) * step(hi.y - 3.0 * px, p.y) * step(p.y, hi.y)
|
|
out = bp_put(out, bp_sky(), ul * active * mark)
|
|
return bp_focus(out, p, c, h, 2.0, px, focus * (1.0 - active))
|
|
}
|
|
mod.widgets.Tabs.height = 28.0
|
|
mod.widgets.Tabs.clip_x = false
|
|
mod.widgets.Tabs.clip_y = false
|
|
mod.widgets.Tabs.draw_tab_active.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.Tabs.draw_tab_active.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_tab(p, self.rect_pos, self.rect_size, px, 0.0, 0.0, 1.0, 0.0, 1.0, 1.0)
|
|
}
|
|
mod.widgets.Tabs.draw_tab_hover.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_tab(self.pos * self.rect_size, self.rect_pos, self.rect_size, px, 1.0, 0.0, 0.0, 0.0, 1.0, 1.0)
|
|
}
|
|
mod.widgets.Tabs.draw_tab.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return bp_tab(self.pos * self.rect_size, self.rect_pos, self.rect_size, px, 0.0, 0.0, 0.0, 0.0, 1.0, 1.0)
|
|
}
|
|
mod.widgets.Tabs.draw_bg.pixel = fn() {
|
|
return vec4(0.0, 0.0, 0.0, 0.0)
|
|
}
|
|
mod.widgets.Tabs.draw_sep.pixel = fn() {
|
|
return vec4(0.0, 0.0, 0.0, 0.0)
|
|
}
|
|
mod.widgets.Tabs.draw_text.color = #eef6ff
|
|
mod.widgets.Tabs.draw_text_active.color = #ffffff
|
|
mod.widgets.Tabs.draw_text_active.text_style = mod.theme.font_regular{font_size: mod.theme.font_size_p}
|
|
mod.widgets.Tabs.draw_mark.color = #eef6ff
|
|
|
|
// The dock's tab: the plain box, no bar.
|
|
mod.widgets.Tab.clip_x = false
|
|
mod.widgets.Tab.clip_y = false
|
|
mod.widgets.Tab.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.Tab.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
return bp_tab(p, self.rect_pos, self.rect_size, px, self.hover, 0.0, self.active, 0.0, 0.0, 0.0)
|
|
}
|
|
mod.widgets.Tab.draw_text.color = #d6e8fb
|
|
mod.widgets.Tab.draw_text.color_hover = #ffffff
|
|
mod.widgets.Tab.draw_text.color_active = #ffffff
|
|
|
|
// The radio tab reads as a tab.
|
|
mod.widgets.RadioButtonTabFlat.clip_x = false
|
|
mod.widgets.RadioButtonTabFlat.clip_y = false
|
|
mod.widgets.RadioButtonTabFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(5.0, 5.0), self.rect_size + vec2(10.0, 10.0))
|
|
}
|
|
mod.widgets.RadioButtonTabFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(10.0, 10.0)) - vec2(5.0, 5.0)
|
|
let live = 1.0 - self.disabled
|
|
return bp_tab(p, self.rect_pos, self.rect_size, px, self.hover * live, self.focus * live, self.active * live, self.down * live, 0.0, 1.0)
|
|
}
|
|
mod.widgets.RadioButtonTabFlat.draw_text.color = #d6e8fb
|
|
mod.widgets.RadioButtonTabFlat.draw_text.color_hover = #ffffff
|
|
mod.widgets.RadioButtonTabFlat.draw_text.color_active = #ffffff
|
|
mod.widgets.RadioButtonTabFlat.draw_text.color_disabled = #86a6cb
|
|
|
|
// SEGMENTED. The two-pixel line round the row over the face; the chosen
|
|
// segment is drawn pushed in: a box of its own inside the row in the wash,
|
|
// the recess hatch inside its top and left edges and the sky underline,
|
|
// its title lit white.
|
|
mod.widgets.SegmentedControl.segment_height = 26.0
|
|
mod.widgets.SegmentedControlFlat.segment_height = 26.0
|
|
mod.widgets.SegmentedControlFlat.segment_padding = 12.0
|
|
mod.widgets.SegmentedControlFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let o = self.rect_pos
|
|
// Both far edges are floored to a device pixel, so the lower and the
|
|
// right line stay inside the quad.
|
|
let lo = bp_lo(o, px)
|
|
let hi = vec2(floor((o.x + self.rect_size.x) / px) * px, floor((o.y + self.rect_size.y) / px) * px) - o
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 2.0)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.9 * inside, 0.9 * inside)
|
|
return bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
mod.widgets.SegmentedControlFlat.draw_pill.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let o = self.rect_pos
|
|
let lo = bp_lo(o, px) + vec2(Finish.snap(3.0, px), Finish.snap(3.0, px))
|
|
let hi = bp_hi(o, self.rect_size, px) - vec2(Finish.snap(3.0, px), Finish.snap(3.0, px))
|
|
let c = (lo + hi) * 0.5
|
|
let d = Material.sd_box(p, c, (hi - lo) * 0.5, 1.5)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_wash() * inside, inside)
|
|
out = bp_put(out, bp_ink(), bp_recess(p, lo, d, 2.0 * px, 2.5, px) * 0.5)
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
let uw = max((hi.x - lo.x) * 0.22, 6.0)
|
|
let ul = step(abs(p.x - c.x), uw) * step(hi.y - 3.0 * px, p.y) * step(p.y, hi.y)
|
|
return bp_put(out, bp_sky(), ul)
|
|
}
|
|
mod.widgets.SegmentedControlFlat.draw_text.color = #eef6ff
|
|
mod.widgets.SegmentedControlFlat.draw_text_selected.color = #ffffff
|
|
mod.widgets.SegmentedControlFlat.draw_text_selected.text_style = mod.theme.font_bold{font_size: 9.5}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// THE GROUND under everything: the window is a sheet of cyanotype paper.
|
|
// The print's tone drifts a few percent in broad soft swells and a finer
|
|
// mottle, and falls off a little toward the sheet's edges; short paper
|
|
// fibres and grit lie in it at the device pixel. On it a drafting grid of
|
|
// one-device-pixel lines, a minor line every 18 points and a stronger major
|
|
// line every fifth, counted from the frame. The frame is a two-pixel
|
|
// border 3 points in and a hairline 7 points in, with a zone tick between
|
|
// them at every major line, and a drafting title block hangs from its top
|
|
// line, its lettering generic.
|
|
let bp_title_block = fn(col: vec3, p: vec2, lo: vec2, px: float) -> vec3 {
|
|
let q = p - lo
|
|
var c = col
|
|
let ink = vec3(0.890, 0.945, 1.0)
|
|
// Its rules: the outer line and the cell lines.
|
|
let box = Material.sd_box(q, vec2(180.0, 11.0), vec2(180.0, 11.0), 0.0)
|
|
let edge = Finish.band(box, 0.0, 2.0 * px, px)
|
|
let cells = Finish.cover(min(min(abs(q.x - 190.0), abs(q.x - 260.0)), abs(q.x - 310.0)) - 0.5 * px, px) * step(q.y, 22.0)
|
|
c = mix(c, ink, max(edge, cells) * 0.9)
|
|
// The lettering: the small labels, then the values.
|
|
let wl = px
|
|
var t = bp_text(q, vec2(3.0, 3.0), 3.6, 1.0, wl, px)
|
|
t = max(t, bp_text(q, vec2(193.0, 3.0), 3.6, 2.0, wl, px))
|
|
t = max(t, bp_text(q, vec2(263.0, 3.0), 3.6, 4.0, wl, px))
|
|
t = max(t, bp_text(q, vec2(313.0, 3.0), 3.6, 8.0, wl, px))
|
|
let wv = max(px, 0.9)
|
|
t = max(t, bp_text(q, vec2(36.0, 11.0), 7.0, 0.0, wv, px))
|
|
t = max(t, bp_text(q, vec2(211.0, 11.5), 6.5, 3.0, wv, px))
|
|
t = max(t, bp_text(q, vec2(277.0, 11.5), 6.5, 5.0, wv, px))
|
|
c = mix(c, ink, t * 0.95)
|
|
// The revision in red pencil: an A in a delta.
|
|
let tc = vec2(342.0, 13.6)
|
|
let tq = q - tc
|
|
let tri = max(abs(tq.x) * 0.866 - tq.y * 0.5 - 3.3, tq.y - 3.3)
|
|
let rp = vec3(0.957, 0.420, 0.400)
|
|
c = mix(c, rp, Finish.cover(abs(tri) - 0.5, px) * 0.95)
|
|
c = mix(c, rp, bp_text(q, tc - vec2(1.13, 1.4), 3.4, 9.0, max(px, 0.75), px) * 0.95)
|
|
return c
|
|
}
|
|
let bp_ground = fn(p: vec2, size: vec2, px: float) -> vec3 {
|
|
var col = bp_paper()
|
|
let broad = Finish.fbm(p / 380.0 + vec2(3.1, 7.7)) - 0.5
|
|
let mott = Finish.fbm(p / 64.0 + vec2(11.3, 2.9)) - 0.5
|
|
col = col * (1.0 + 0.10 * broad + 0.04 * mott)
|
|
let e = min(min(p.x, size.x - p.x), min(p.y, size.y - p.y))
|
|
col = col * (0.95 + 0.05 * smoothstep(0.0, 160.0, e))
|
|
let fib = Finish.noise(vec2(p.x / 7.0, p.y / 1.3)) - 0.5
|
|
let grit = Finish.noise(p / 1.7 + vec2(5.0, 1.0)) - 0.5
|
|
col = col * (1.0 + 0.03 * fib + 0.025 * grit)
|
|
let paper = col
|
|
// The grid, counted in device pixels from the frame's hairline, so
|
|
// every line is exactly one pixel wide.
|
|
let g0 = Finish.snap(7.0, px)
|
|
let cell = floor(18.0 / px + 0.5)
|
|
let big = cell * 5.0
|
|
let ix = floor((p.x - g0) / px)
|
|
let iy = floor((p.y - g0) / px)
|
|
let mx = ix - cell * floor(ix / cell)
|
|
let my = iy - cell * floor(iy / cell)
|
|
let jx = ix - big * floor(ix / big)
|
|
let jy = iy - big * floor(iy / big)
|
|
let minor = max(step(mx, 0.5), step(my, 0.5))
|
|
let major = max(step(jx, 0.5), step(jy, 0.5))
|
|
let ingrid = step(g0, p.x) * step(g0, p.y) * step(p.x, size.x - g0) * step(p.y, size.y - g0)
|
|
col = col + (vec3(0.020, 0.026, 0.026) * minor * (1.0 - major) + vec3(0.052, 0.062, 0.056) * major) * ingrid
|
|
// The frame.
|
|
let ink = vec3(0.890, 0.945, 1.0)
|
|
let o1 = Finish.snap(3.0, px)
|
|
let dO = Material.sd_box(p, size * 0.5, size * 0.5 - vec2(o1, o1), 0.0)
|
|
let dI = Material.sd_box(p, size * 0.5, size * 0.5 - vec2(g0, g0), 0.0)
|
|
let outer = Finish.band(dO, 0.0, 2.0 * px, px)
|
|
let inner = Finish.band(dI, 0.0, px, px)
|
|
let margin = step(dO, 0.0 - 2.0 * px) * step(0.0, dI)
|
|
let side = step(p.x, g0) + step(size.x - g0, p.x)
|
|
let zx = abs(ix - big * floor(ix / big + 0.5))
|
|
let zy = abs(iy - big * floor(iy / big + 0.5))
|
|
let zt = margin * max(step(zx, 0.5) * (1.0 - min(side, 1.0)), step(zy, 0.5) * min(side, 1.0))
|
|
col = mix(col, ink, max(outer, inner) * 0.85 + zt * 0.6)
|
|
// The title block: a strip hung from the frame's top line in the
|
|
// window's caption band, between the window's title and its buttons,
|
|
// where nothing of the content ever reaches; on a window too narrow
|
|
// to hold it clear of the title, none.
|
|
let tlo = vec2(size.x - 510.0, g0)
|
|
let room = step(1200.0, size.x)
|
|
if room * step(tlo.x - 1.0, p.x) * step(tlo.y, p.y) * step(p.x, tlo.x + 361.0) * step(p.y, tlo.y + 23.0) > 0.5 {
|
|
col = bp_title_block(paper, p, tlo, px)
|
|
}
|
|
return col + vec3(1.0, 1.0, 1.0) * Finish.grain(p / px, 1.0 / 255.0)
|
|
}
|
|
mod.widgets.Window.show_bg = true
|
|
mod.widgets.Window.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
return vec4(bp_ground(self.pos * self.rect_size, self.rect_size, px), 1.0)
|
|
}
|
|
|
|
// DIVIDERS: a hairline of the dimension ink between two extension ticks.
|
|
mod.widgets.Hr.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let y = Finish.snap(self.rect_pos.y + self.rect_size.y * 0.5, px) - self.rect_pos.y
|
|
let line = step(y - px, p.y) * step(p.y, y)
|
|
let tick = step(min(p.x, self.rect_size.x - p.x), px) * step(abs(p.y - y + 0.5 * px), 3.0)
|
|
let a = max(line, tick)
|
|
return vec4(bp_dimc() * a, a)
|
|
}
|
|
mod.widgets.Vr.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let x = Finish.snap(self.rect_pos.x + self.rect_size.x * 0.5, px) - self.rect_pos.x
|
|
let line = step(x - px, p.x) * step(p.x, x)
|
|
let tick = step(min(p.y, self.rect_size.y - p.y), px) * step(abs(p.x - x + 0.5 * px), 3.0)
|
|
let a = max(line, tick)
|
|
return vec4(bp_dimc() * a, a)
|
|
}
|
|
// A splitter is a centre line, a chain of the dimension ink; under the
|
|
// hand or dragged, a solid two-pixel line of sky along its grip.
|
|
mod.widgets.Splitter.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let v = step(0.5, self.is_vertical)
|
|
let mid = self.rect_size * 0.5
|
|
let s = mix(p.x, p.y, v)
|
|
let t = mix(p.y - mid.y, p.x - mid.x, v)
|
|
let chain = Finish.cover(abs(t) - 0.5 * px, px) * bp_chain(s)
|
|
var out = vec4(bp_dimc() * chain * 0.7, chain * 0.7)
|
|
let hv = clamp(max(self.hover, max(self.drag, self.focus)), 0.0, 1.0)
|
|
let lm = mix(self.rect_size.x, self.rect_size.y, v) * 0.5
|
|
let grip = Finish.cover(abs(t) - px, px) * step(abs(s - lm), self.bar_size * 0.5)
|
|
return bp_put(out, bp_sky(), grip * hv)
|
|
}
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// SURFACES. A panel is drawn as a raised slab: its face is the paper with
|
|
// the grid showing faintly through, in the two-pixel line, and its depth
|
|
// is drawn as two hatched sides falling away to the lower right, with a
|
|
// width dimension under it, figure and all, where it is big enough to
|
|
// carry one. The inset panel is a well: the two-pixel line, a band of
|
|
// section hatching inside it and a second line round the sunken floor.
|
|
let bp_panel = fn(p: vec2, o: vec2, s: vec2, px: float) -> vec4 {
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px) - vec2(Finish.snap(6.0, px), Finish.snap(6.0, px))
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let d = Material.sd_box(p, c, h, 2.0)
|
|
let dep = Finish.snap(6.0, px)
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.55 * inside, 0.55 * inside)
|
|
// The sides: the right side and the foot, swept down to the right.
|
|
let xr = p.x - hi.x
|
|
let rs = step(0.0, xr) * step(xr, dep) * step(lo.y + xr, p.y) * step(p.y, hi.y + xr)
|
|
let yb = p.y - hi.y
|
|
let bs = step(0.0, yb) * step(yb, dep) * step(lo.x + yb, p.x) * step(p.x, hi.x + yb)
|
|
let sides = max(rs, bs) * (1.0 - inside)
|
|
out = bp_put(out, bp_face(), sides * 0.85)
|
|
out = bp_put(out, bp_ink(), rs * (1.0 - inside) * bp_hatch(vec2(0.0 - p.x, p.y), 2.2, px) * 0.75)
|
|
out = bp_put(out, bp_ink(), bs * (1.0 - inside) * bp_hatch(p, 2.2, px) * 0.75)
|
|
var e = bp_seg(p, vec2(hi.x - 1.0, lo.y + 1.0), vec2(hi.x + dep, lo.y + dep))
|
|
e = min(e, bp_seg(p, vec2(hi.x + dep, lo.y + dep), vec2(hi.x + dep, hi.y + dep)))
|
|
e = min(e, bp_seg(p, vec2(lo.x + dep, hi.y + dep), vec2(hi.x + dep, hi.y + dep)))
|
|
e = min(e, bp_seg(p, vec2(lo.x + 1.0, hi.y - 1.0), vec2(lo.x + dep, hi.y + dep)))
|
|
out = bp_put(out, bp_ink(), Finish.cover(e - 0.75 * px, px))
|
|
out = bp_put(out, bp_ink(), Finish.cover(bp_seg(p, vec2(hi.x, hi.y), vec2(hi.x + dep, hi.y + dep)) - 0.5 * px, px))
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, lw, px))
|
|
let room = step(120.0, s.x) * step(60.0, s.y)
|
|
// The width dimension under the slab: extension lines down from the
|
|
// face's two lower corners, a dimension line between them with
|
|
// arrowheads at both ends, broken for its figure, the face's width in
|
|
// points.
|
|
let wy = hi.y + dep + 13.0
|
|
let fw = hi.x - lo.x
|
|
let wex = Finish.cover(abs(p.x - lo.x) - 0.5 * px, px) * step(hi.y + 2.0, p.y) * step(p.y, wy + 3.0) + Finish.cover(abs(p.x - hi.x) - 0.5 * px, px) * step(hi.y + dep + 1.5, p.y) * step(p.y, wy + 3.0)
|
|
let gapw = 16.0
|
|
let wl = Finish.cover(abs(p.y - wy) - 0.5 * px, px) * step(lo.x, p.x) * step(p.x, hi.x) * step(gapw, abs(p.x - (lo.x + hi.x) * 0.5))
|
|
let wa = max(bp_arrow(p, vec2(lo.x, wy), vec2(-1.0, 0.0), 5.0, 1.7, px), bp_arrow(p, vec2(hi.x, wy), vec2(1.0, 0.0), 5.0, 1.7, px))
|
|
let wt = bp_num(p, vec2((lo.x + hi.x) * 0.5, wy), 6.0, fw, max(px, 0.75), px)
|
|
out = bp_put(out, bp_dimc(), max(max(wex, wl), wa) * room)
|
|
out = bp_put(out, bp_ink(), wt * room)
|
|
return out
|
|
}
|
|
let bp_inset = fn(p: vec2, o: vec2, s: vec2, px: float) -> vec4 {
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, s, px)
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let d = Material.sd_box(p, c, h, 2.0)
|
|
let bw = Finish.snap(min(6.0, 0.12 * min(h.x, h.y) * 2.0), px)
|
|
let di = Material.sd_box(p, c, h - vec2(bw, bw), 1.0)
|
|
let lw = 2.0 * px
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_face() * 0.55 * inside, 0.55 * inside)
|
|
let band = inside * (1.0 - Finish.cover(di, px))
|
|
out = bp_put(out, bp_ink(), band * bp_hatch(p, 2.4, px) * 0.75)
|
|
out = bp_put(out, bp_well(), Finish.cover(di + lw, px) * 0.35)
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, lw, px))
|
|
return bp_put(out, bp_ink(), Finish.ring_out(di, 0.0, lw, px) * inside)
|
|
}
|
|
mod.widgets.PanelView.clip_x = false
|
|
mod.widgets.PanelView.clip_y = false
|
|
mod.widgets.PanelView.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(4.0, 4.0), self.rect_size + vec2(8.0, 30.0))
|
|
}
|
|
mod.widgets.PanelView.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(8.0, 30.0)) - vec2(4.0, 4.0)
|
|
if self.sunken > 0.5 {
|
|
return bp_inset(p, self.rect_pos, self.rect_size, px)
|
|
}
|
|
return bp_panel(p, self.rect_pos, self.rect_size + vec2(6.0, 6.0), px)
|
|
}
|
|
|
|
// Cards are sheets laid one on another: the face in the two-pixel line,
|
|
// corners of three points, and a second sheet's line showing past its
|
|
// lower right edge, 4 points down and across.
|
|
mod.widgets.Card.draw_bg.vertex = fn() {
|
|
self.rect_size3 = self.rect_size + vec2(12.0, 12.0)
|
|
self.rect_shift = vec2(0.0, 0.0)
|
|
return self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.Card.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
let o = self.rect_pos
|
|
let lo = bp_lo(o, px)
|
|
let hi = bp_hi(o, self.rect_size, px) - vec2(Finish.snap(4.0, px), Finish.snap(4.0, px))
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let off = vec2(Finish.snap(4.0, px), Finish.snap(4.0, px))
|
|
let d = Material.sd_box(p, c, h, 3.0)
|
|
let d2 = Material.sd_box(p, c + off, h, 3.0)
|
|
let hv = self.hover
|
|
let lw = 2.0 * px
|
|
let outlined = step(0.01, self.border_size)
|
|
let filled = step(0.1, Finish.lum(self.color.rgb)) * (1.0 - outlined)
|
|
var face = mix(bp_face(), self.color.rgb, filled * 0.0)
|
|
face = mix(face, bp_face_hi(), hv * 0.6)
|
|
face = mix(face, bp_face_lo(), self.down)
|
|
let behind = Finish.cover(d2, px) * (1.0 - Finish.cover(d, px))
|
|
var out = vec4(bp_face() * 0.85 * behind, 0.85 * behind)
|
|
out = bp_put(out, bp_ink(), Finish.band(d2, 0.0, lw, px) * (1.0 - Finish.cover(d, px)))
|
|
let inside = Finish.cover(d, px)
|
|
out = bp_put(out, face, inside * 0.85)
|
|
return bp_put(out, mix(bp_ink(), bp_white(), hv), Finish.band(d, 0.0, lw, px))
|
|
}
|
|
|
|
// A card's title is a surface caption like a panel's.
|
|
mod.widgets.H4.draw_text.color = #ffffff
|
|
mod.widgets.H4.draw_text.text_style = mod.theme.font_bold{font_size: 10.0}
|
|
|
|
// LIST ROWS. 22 points tall and clear; the pointer brings a faint wash;
|
|
// the chosen row takes the wash, a dashed hairline round it and a sky bar
|
|
// at its left end, as a drawing flags the item a note refers to.
|
|
mod.widgets.ListItem.height = 22.0
|
|
mod.widgets.ListItemOne.height = 22.0
|
|
mod.widgets.ListItem.padding = mod.turtle.Inset{left: 12.0 right: 8.0 top: 0.0 bottom: 0.0}
|
|
mod.widgets.ListItemOne.padding = mod.turtle.Inset{left: 12.0 right: 8.0 top: 0.0 bottom: 0.0}
|
|
mod.widgets.ListItem.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let o = self.rect_pos
|
|
let live = 1.0 - self.disabled
|
|
let lo = bp_lo(o, px) + vec2(0.0, Finish.snap(1.0, px))
|
|
let hi = vec2(floor((o.x + self.rect_size.x) / px) * px, floor((o.y + self.rect_size.y) / px) * px) - o - vec2(Finish.snap(3.0, px), Finish.snap(1.0, px))
|
|
let sel = self.selected * live
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 1.0)
|
|
let inside = Finish.cover(d, px)
|
|
let wash = (0.4 * self.hover + 0.6 * self.down) * (1.0 - sel) * live + 0.7 * sel
|
|
var out = vec4(bp_wash() * wash * inside, wash * inside)
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, px, px) * bp_dash(p.x + p.y, 5.0, 0.6) * sel)
|
|
let bar = step(lo.x + 2.0 * px, p.x) * step(p.x, lo.x + 5.0 * px) * step(lo.y + 3.0, p.y) * step(p.y, hi.y - 3.0)
|
|
return bp_put(out, bp_sky(), bar * sel)
|
|
}
|
|
mod.widgets.ListItem.draw_text.color = #eef6ff
|
|
mod.widgets.ListItemOne.draw_text.color = #eef6ff
|
|
mod.widgets.ListItem.draw_text_2.color = #b3d2f2
|
|
|
|
// The rows of the side tree stand on the paper, clear; the open row takes
|
|
// the wash, a dashed hairline round it and the sky bar at its left end.
|
|
mod.widgets.FileTreeNode.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let lo = vec2(Finish.snap(1.0, px), Finish.snap(1.0, px))
|
|
let hi = self.rect_size - vec2(Finish.snap(2.0, px), Finish.snap(1.0, px))
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 1.0)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(bp_wash() * 0.7 * inside, 0.7 * inside) * self.active
|
|
out = bp_put(out, bp_ink(), Finish.band(d, 0.0, px, px) * bp_dash(p.x + p.y, 5.0, 0.6) * self.active)
|
|
let bar = step(lo.x + 2.0 * px, p.x) * step(p.x, lo.x + 5.0 * px) * step(lo.y + 3.0, p.y) * step(p.y, hi.y - 3.0)
|
|
return bp_put(out, bp_sky(), bar * self.active)
|
|
}
|
|
mod.widgets.FileTreeNode.draw_text.color_active = #ffffff
|
|
mod.widgets.FileTreeNode.draw_icon.color_active = #ffffff
|
|
mod.widgets.FileTree.filler.pixel = fn() {
|
|
return vec4(0.0, 0.0, 0.0, 0.0)
|
|
}
|
|
|
|
// The rounded view keeps its caller's colours with a true device-pixel
|
|
// edge; a view given no line of its own is outlined in a faint hairline of
|
|
// the ink, as every surface on a drawing is.
|
|
mod.widgets.RoundedView.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let lower = vec2(self.border_inset.x, self.border_inset.y)
|
|
let upper = self.rect_size - vec2(self.border_inset.z, self.border_inset.w)
|
|
let c = (lower + upper) * 0.5
|
|
let h = max((upper - lower) * 0.5, vec2(0.5, 0.5))
|
|
let r = min(self.border_radius, min(h.x, h.y))
|
|
let d = Material.sd_box(p, c, h, r)
|
|
var fill = self.color
|
|
if self.color_2.x > -0.5 {
|
|
let dir = if self.gradient_fill_horizontal > 0.5 self.pos.x else self.pos.y
|
|
fill = mix(self.color, self.color_2, dir)
|
|
}
|
|
var stroke = self.border_color
|
|
if self.border_color_2.x > -0.5 {
|
|
let dir = if self.gradient_border_horizontal > 0.5 self.pos.x else self.pos.y
|
|
stroke = mix(self.border_color, self.border_color_2, dir)
|
|
}
|
|
var col = vec4(fill.rgb * fill.a, fill.a)
|
|
let has = step(0.001, self.border_size)
|
|
let bw = max(self.border_size, px) * has + px * (1.0 - has)
|
|
let sa = mix(0.55 * step(0.5, fill.a), stroke.a, has)
|
|
let sc = mix(vec3(0.890, 0.945, 1.0), stroke.rgb, has)
|
|
col = bp_put(col, sc, Finish.band(d, 0.0, bw, px) * sa)
|
|
return col * Finish.cover(d, px)
|
|
}
|
|
|
|
// CHIPS. A small box in the two-pixel line over the face; the pointer
|
|
// lifts it, a press recesses it.
|
|
mod.widgets.ChipFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let o = self.rect_pos
|
|
let lo = bp_lo(o, px) + vec2(0.0, Finish.snap(1.0, px))
|
|
let hi = vec2(floor((o.x + self.rect_size.x) / px) * px - o.x, Finish.snap(o.y + self.rect_size.y - 1.0, px) - o.y)
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 2.0)
|
|
var face = mix(bp_face(), bp_face_hi(), self.hover)
|
|
face = mix(face, bp_face_lo(), self.down)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(face * 0.9 * inside, 0.9 * inside)
|
|
out = bp_put(out, bp_ink(), bp_recess(p, lo, d, 2.0 * px, 2.5, px) * self.down * 0.5)
|
|
return bp_put(out, mix(bp_ink(), bp_white(), self.hover), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
mod.widgets.ChipFlat.draw_text.color = #eef6ff
|
|
mod.widgets.ChipFlat.palette.on_neutral_container = #eef6ff
|
|
mod.widgets.Chip.palette.on_neutral_container = #eef6ff
|
|
|
|
// BADGES. A count is a boxed figure: the face in the two-pixel line, the
|
|
// figure in white.
|
|
mod.widgets.BadgePalette.neutral = #11416f
|
|
mod.widgets.BadgePalette.on_neutral = #eef6ff
|
|
mod.widgets.BadgeFlat.draw_text.text_style = mod.theme.font_regular{font_size: 8.5}
|
|
mod.widgets.Badge.draw_text.text_style = mod.theme.font_regular{font_size: 8.5}
|
|
mod.widgets.BadgeFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let o = self.rect_pos
|
|
let bh = min(18.0, self.rect_size.y)
|
|
let lo = vec2(Finish.snap(o.x, px), Finish.snap(o.y + (self.rect_size.y - bh) * 0.5, px)) - o
|
|
let hi = vec2(floor((o.x + self.rect_size.x) / px) * px - o.x, lo.y + Finish.snap(bh, px))
|
|
let d = Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5, 1.5)
|
|
let a = Finish.cover(d, px) * self.color.a
|
|
var out = vec4(self.color.rgb * a, a)
|
|
return bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
|
|
// SPINNERS: the arc face; the stock face turns on the pass clock, which
|
|
// only the library's own shader may read.
|
|
mod.widgets.SpinnerFlat.face = mod.widgets.SpinnerFace.Arc
|
|
|
|
// ---------------------------------------------------------------- band
|
|
|
|
// THE BAND is the sheet's own slider with two thumbs: the same rail, scale
|
|
// and fill, the value lit between two round thumbs with their centre
|
|
// marks. The widget's grab geometry is set to the thumbs' own, so what is
|
|
// drawn is what is dragged.
|
|
mod.widgets.RangeSliderFlat.clip_x = false
|
|
mod.widgets.RangeSliderFlat.clip_y = false
|
|
mod.widgets.RangeSliderFlat.track_inset = 0.0
|
|
mod.widgets.RangeSliderFlat.handle_size = 13.0
|
|
mod.widgets.RangeSliderFlat.draw_bg.vertex = fn() {
|
|
self.vertex_pos = self.clip_and_transform_vertex(self.rect_pos - vec2(6.0, 6.0), self.rect_size + vec2(12.0, 12.0))
|
|
}
|
|
mod.widgets.RangeSliderFlat.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * (self.rect_size + vec2(12.0, 12.0)) - vec2(6.0, 6.0)
|
|
let far = bp_slider(p, self.rect_pos, self.rect_size, px, 23.0, 6.5, 6.5, self.end_pos, self.start_pos, self.hot_end, self.focus, self.drag * self.hot_end, self.disabled, 1.0, 1.0)
|
|
let near = bp_slider(p, self.rect_pos, self.rect_size, px, 23.0, 6.5, 6.5, self.start_pos, self.end_pos, self.hot_start, self.focus, self.drag * self.hot_start, self.disabled, 1.0, 1.0)
|
|
let mid = 6.5 + (self.start_pos + self.end_pos) * 0.5 * (self.rect_size.x - 13.0)
|
|
return mix(near, far, step(mid, p.x))
|
|
}
|
|
|
|
// ---------------------------------------------------------------- screens and meter
|
|
|
|
// THE READOUTS AND THE SCREEN sit in a drafting window: the paper a shade
|
|
// deeper, framed by the two-pixel line and a hairline 2.5 points inside
|
|
// it, with no glass over it. The figures are the white ink.
|
|
let bp_window = fn(p: vec2, lo: vec2, hi: vec2, px: float, face: vec3) -> vec4 {
|
|
let c = (lo + hi) * 0.5
|
|
let h = (hi - lo) * 0.5
|
|
let d = Material.sd_box(p, c, h, 2.0)
|
|
let inside = Finish.cover(d, px)
|
|
var out = vec4(face * inside, inside)
|
|
let di = Material.sd_box(p, c, h - vec2(2.5, 2.5), 1.0)
|
|
out = bp_put(out, bp_dimc(), Finish.band(di, 0.0, px, px) * 0.75)
|
|
return bp_put(out, bp_ink(), Finish.band(d, 0.0, 2.0 * px, px))
|
|
}
|
|
mod.widgets.ScreenView.clip_x = false
|
|
mod.widgets.ScreenView.clip_y = false
|
|
mod.widgets.ScreenView.padding = mod.turtle.Inset{top: 8.0 right: 10.0 bottom: 8.0 left: 10.0}
|
|
mod.widgets.ScreenView.draw_bg.pixel = fn() {
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let p = self.pos * self.rect_size
|
|
let lo = bp_lo(self.rect_pos, px)
|
|
let hi = bp_hi(self.rect_pos, self.rect_size, px)
|
|
return bp_window(p, lo, hi, px, self.color.rgb)
|
|
}
|
|
mod.widgets.ScreenView.sheen = 0.0
|
|
mod.widgets.ScreenView.draw_glass.pixel = fn() {
|
|
return vec4(0.0, 0.0, 0.0, 0.0)
|
|
}
|
|
|
|
// THE NEEDLE METER is the same window: its scale a hairline arc with a
|
|
// tick at every division, the red zone a two-pixel band of red pencil
|
|
// along the arc, the needle a white line from an outlined pivot with a
|
|
// centre mark.
|
|
mod.widgets.NeedleMeter.clip_x = false
|
|
mod.widgets.NeedleMeter.clip_y = false
|
|
mod.widgets.NeedleMeter.draw_bg.color = uniform(#0f3b69)
|
|
mod.widgets.NeedleMeter.draw_bg.color_scale = uniform(#e3f1ff)
|
|
mod.widgets.NeedleMeter.draw_bg.color_zone = uniform(#f46b66)
|
|
mod.widgets.NeedleMeter.draw_bg.color_needle = uniform(#ffffff)
|
|
mod.widgets.NeedleMeter.draw_bg.pixel = fn() {
|
|
let p = self.pos * self.rect_size
|
|
let px = 1.0 / max(self.draw_pass.dpi_factor, 0.5)
|
|
let lo = bp_lo(self.rect_pos, px)
|
|
let hi = bp_hi(self.rect_pos, self.rect_size, px)
|
|
var out = bp_window(p, lo, hi, px, self.color.rgb)
|
|
let pv = self.pivot()
|
|
let rr = self.scale_radius()
|
|
let q = p - pv
|
|
let r = length(q)
|
|
let ang = atan2(q.x, 0.0 - q.y)
|
|
let sweep = self.sweep * 0.017453293
|
|
let t = ang / sweep + 0.5
|
|
let on_scale = step(-0.0001, t) * step(t, 1.0001)
|
|
let inside = Finish.cover(Material.sd_box(p, (lo + hi) * 0.5, (hi - lo) * 0.5 - vec2(3.0, 3.0), 1.0), px)
|
|
// The scale.
|
|
let arc = Finish.cover(abs(r - rr) - px * 0.5, px) * on_scale
|
|
let n = max(floor(self.majors + 0.5), 1.0) * max(floor(self.minors + 0.5), 1.0)
|
|
let k = floor(clamp(t, 0.0, 1.0) * n + 0.5)
|
|
let ak = (k / n - 0.5) * sweep
|
|
let perp = abs(q.x * cos(ak) + q.y * sin(ak))
|
|
let mn = max(floor(self.minors + 0.5), 1.0)
|
|
let major = 1.0 - step(0.5, k - mn * floor(k / mn + 0.0001))
|
|
let len = mix(self.tick_minor, self.tick_major, major)
|
|
let radial = max(rr - len - r, r - rr)
|
|
let tick = Finish.cover(perp - px * mix(0.5, 1.0, major), px) * Finish.cover(radial, px) * step(0.0, 0.0 - q.y * cos(ak) + q.x * sin(ak))
|
|
out = bp_put(out, self.color_scale.rgb, max(arc, tick) * inside)
|
|
if self.zone < 0.999 {
|
|
let zone_t = Finish.cover((self.zone - t) * sweep * r, px) * Finish.cover((t - 1.0) * sweep * r, px)
|
|
let zone_r = Finish.cover(max(rr + 2.0 * px - r, r - rr - 2.5), px)
|
|
out = bp_put(out, self.color_zone.rgb, zone_t * zone_r * inside)
|
|
}
|
|
// The needle, from the pivot to just past the scale.
|
|
let na = self.needle_angle(self.value)
|
|
let nd = vec2(sin(na), 0.0 - cos(na))
|
|
let along = dot(q, nd)
|
|
let across = abs(q.x * nd.y - q.y * nd.x)
|
|
let needle = Finish.cover(across - px * 0.75, px) * Finish.cover(along - (rr + 3.0), px) * Finish.cover(0.0 - along + self.pivot_size, px)
|
|
out = bp_put(out, self.color_needle.rgb, needle * inside)
|
|
let pd = r - self.pivot_size
|
|
out = bp_put(out, self.color.rgb, Finish.cover(pd, px) * inside)
|
|
out = bp_put(out, self.color_scale.rgb, Finish.band(pd, 0.0, 2.0 * px, px) * inside)
|
|
let cm = max(Finish.cover(abs(q.x) - 0.5 * px, px) * step(abs(q.y), self.pivot_size * 0.55), Finish.cover(abs(q.y) - 0.5 * px, px) * step(abs(q.x), self.pivot_size * 0.55))
|
|
out = bp_put(out, bp_dimc(), cm * inside)
|
|
return out * self.opacity
|
|
}
|
|
mod.widgets.NeedleMeter.draw_label.color = #eef6ff
|
|
true
|