Orkuncakilkaya
637d07400e
- Natives: ui_native(tag, measure, draw) makes an element the program draws itself; ui_fire runs its on-<event> with event.value. input, select and textarea have simple defaults. - React: - keyed <each>, <let>, <provide> context through components, <fragment>; - named slots, default props on <component>; - on-mount / on-unmount; - inline text inside text elements. - CSS: - custom properties and var(); - position relative/absolute/fixed with insets and z-index; - em/rem/vw/vh and @media; - wrapping text and ellipsis, overflow; - + and ~ combinators, :nth-child(an+b), :checked, :active. - Developing: errors with file:line, ui_errors(), ui_reload() keeping state, and an inspector-style ui_dump. - view fields infer the type of a literal or a named function's result. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
91 lines
3.4 KiB
Text
91 lines
3.4 KiB
Text
# draw.ludic - the laid-out nodes through the renderer: background, border, then content
|
|
function fr_draw(n: UiNode) -> void {
|
|
if n.kind == UI_BUTTON {
|
|
fr_button(n)
|
|
return
|
|
}
|
|
if n.kind == UI_NATIVE {
|
|
n.native.draw(n)
|
|
return
|
|
}
|
|
if n.bg >= 0 and ui_be.rect != null { ui_be.rect(n.x, n.y, n.cw, n.ch, n.bg, n.alpha) }
|
|
fr_border(n)
|
|
if n.kind == UI_TEXT { fr_text(n) }
|
|
if n.kind == UI_IMAGE and ui_be.image != null { ui_be.image(n.src, n.x + n.pl + n.border, n.y + n.pt + n.border, n.cw - ly_hin(n), n.ch - ly_vin(n), n.rfg, n.alpha) }
|
|
var off = 0.0
|
|
if n.kind == UI_SCROLL and ui_be.scroll_begin != null { off = ui_be.scroll_begin(n.key, n.x, n.y, n.cw, n.ch, n.content_h) }
|
|
if off != 0.0 {
|
|
for i in 0 .. len(n.children) { fr_shift(n.children[i], off) }
|
|
}
|
|
if n.children != null { fr_children(n) }
|
|
if n.kind == UI_SCROLL and ui_be.scroll_end != null { ui_be.scroll_end() }
|
|
}
|
|
# a text's lines (one, or the wrapped ones), each placed by text-align, the last cut by an ellipsis
|
|
function fr_text(n: UiNode) -> void {
|
|
let y = n.y + n.pt + n.border
|
|
if n.lines == null {
|
|
var s = n.text
|
|
if n.ellipsis { s = ly_ellipsis(s, n.rsize, n.cw - ly_hin(n)) }
|
|
ui_be.text(fr_line_x(n, s), y, s, n.rsize, n.rfg)
|
|
return
|
|
}
|
|
for i in 0 .. len(n.lines) { ui_be.text(fr_line_x(n, n.lines[i]), y + float(i) * n.rsize * 1.25, n.lines[i], n.rsize, n.rfg) }
|
|
}
|
|
function fr_text_x(n: UiNode) -> float { return fr_line_x(n, n.text) }
|
|
# where a line starts: text-align within the room the box gives it
|
|
function fr_line_x(n: UiNode, s: string) -> float {
|
|
let x = n.x + n.pl + n.border
|
|
if n.talign == UI_START { return x }
|
|
let spare = n.cw - ly_hin(n) - ly_text_w(s, n.rsize)
|
|
if n.talign == UI_CENTER { return x + spare / 2.0 }
|
|
return x + spare
|
|
}
|
|
# the children in painting order: those in the flow first, then positioned ones by z-index
|
|
function fr_children(n: UiNode) -> void {
|
|
var positioned = 0
|
|
for i in 0 .. len(n.children) {
|
|
if n.children[i].pos == 0 { fr_draw(n.children[i]) } else { positioned += 1 }
|
|
}
|
|
if positioned == 0 { return }
|
|
var lo = 1000000
|
|
var hi = -1000000
|
|
for i in 0 .. len(n.children) {
|
|
if n.children[i].pos != 0 {
|
|
lo = Math.min(lo, n.children[i].z)
|
|
hi = Math.max(hi, n.children[i].z)
|
|
}
|
|
}
|
|
for z in lo .. hi + 1 {
|
|
for i in 0 .. len(n.children) {
|
|
if n.children[i].pos != 0 and n.children[i].z == z { fr_draw(n.children[i]) }
|
|
}
|
|
}
|
|
}
|
|
function fr_border(n: UiNode) -> void {
|
|
if n.border <= 0.0 or ui_be.rect == null { return }
|
|
var c = n.border_c
|
|
if c < 0 { c = n.rfg }
|
|
let b = n.border
|
|
ui_be.rect(n.x, n.y, n.cw, b, c, n.alpha)
|
|
ui_be.rect(n.x, n.y + n.ch - b, n.cw, b, c, n.alpha)
|
|
ui_be.rect(n.x, n.y, b, n.ch, c, n.alpha)
|
|
ui_be.rect(n.x + n.cw - b, n.y, b, n.ch, c, n.alpha)
|
|
}
|
|
# the renderer's own button when it has one: it draws, focuses and answers the press
|
|
function fr_button(n: UiNode) -> void {
|
|
if ui_be.button != null {
|
|
if ui_be.button(n.x, n.y, n.cw, n.ch, n.text, n.enabled) and n.enabled { ui_fire(n, "press", Value.null()) }
|
|
return
|
|
}
|
|
var bg = n.bg
|
|
if bg < 0 { bg = 4210752 }
|
|
if ui_be.rect != null { ui_be.rect(n.x, n.y, n.cw, n.ch, bg, n.alpha) }
|
|
fr_border(n)
|
|
ui_be.text(fr_text_x(n), n.y + n.pt + n.border, n.text, n.rsize, n.rfg)
|
|
}
|
|
function fr_shift(n: UiNode, off: float) -> void {
|
|
n.y = n.y - off
|
|
if n.children != null {
|
|
for i in 0 .. len(n.children) { fr_shift(n.children[i], off) }
|
|
}
|
|
}
|