Module Brr.El

DOM elements.

Warning. Reactive DOM element mutators (rset_att, rset_children, etc.) and definers (def_att, def_children, etc.) use Note loggers to perform their action. To prevent memory leaks, these loggers, and thus their action, automatically get destroyed whenever the element is removed from the HTML DOM.

Elements

type name = Jstr.t

The type for element names.

type el

The type for elements.

type t = [
| `El of el
]

The type for elements.

type child = [
| t
| `Txt of Jstr.t
]

The type for element children.

val v : ?⁠atts:Att.t list -> name -> child list -> [> t ]

v ?atts name cs is an element name with attribute atts (defaults to []) and children cs. If atts specifies an attribute more than once, the last one takes over with the exception of Att.klass, whose occurences accumulate to define the final value.

val el : t -> Js_of_ocaml.Dom_html.element Js_of_ocaml.Js.t

el (`El e) is e.

val tag_name : t -> Jstr.t

tag_name e is the tag name of the element.

val find_id : Jstr.t -> [> t ] option

find_id id is the element with id id in the browser document (if any).

val find_class : Jstr.t -> [> t ] list

find_class cl are the element with class cs in the browser document.

val document : unit -> [> t ]

document is the document's element of the current browser document.

val document_body : unit -> [> t ]

document_body is the body element of the current browser document.

val document_active : unit -> [> t ] option

document_active is the element of the DOM that currently has focus (if any).

Children

val set_children : t -> child list -> unit

set_children e children sets e's children to children

val rset_children : t -> on:child list Note.event -> unit

rset_children e ~on sets e's children with the value of on whenever it occurs.

val def_children : t -> child list Note.signal -> unit

def_children e cs defines e's children over time with the value of signal cs. Warning. This assumes cs is the only entity interacting with the children.

Attributes

val get_att : Att.name -> t -> Jstr.t option

get_att a e is the value of the attribute a of e (if any).

val set_att : Att.name -> Jstr.t option -> t -> unit

set_att a v e sets the value of attribute a of e to v. If v is None this removes the attribute.

val rset_att : Att.name -> on:Jstr.t option Note.event -> t -> unit

rset_att a ~on e sets attribute a of e with the value of e whenever it occurs. If the value is None this removes the attribute.

val def_att : Att.name -> Jstr.t option Note.signal -> t -> unit

def_att a v e defines the attribute a of e over time with the value of v. Whenever the signal value is None, the attribute is removed. Warning. This assumes v is the only entity interacting with that attribute.

Classes

val get_class : Jstr.t -> t -> bool

get_class c e is the membership of e to class c.

val set_class : Jstr.t -> bool -> t -> unit

set_class c b e sets the membership of e to class c according to b.

val rset_class : Jstr.t -> on:bool Note.event -> t -> unit

rset_class a ~on e sets the membership of e to class e with the value of on whenever it occurs.

val def_class : Jstr.t -> bool Note.signal -> t -> unit

rdef_class a b e defines the membership of e to class e over time with the value of b. Warning. This assumes b is the only entity interacting with that class.

Properties

val get_prop : 'a Prop.t -> t -> 'a

get_prop p e is the property p of element e if defined and p's undefined value otherwise.

val set_prop : 'a Prop.t -> 'a -> t -> unit

set_prop p v o sets property p of element e to v.

val rset_prop : 'a Prop.t -> on:'a Note.event -> t -> unit

rset_prop p ~on e sets property p of e to the value of on whenever it occurs.

val def_prop : 'a Prop.t -> 'a Note.signal -> t -> unit

def_prop p v e defines the property p of e over time with the value of v. Warning. This assumes v is the only entity interacting with that property.

Style

module Style : sig ... end

Style property names.

val get_computed_style : Style.prop -> t -> Jstr.t

get_computed_style p e is the computed style property p of e.

val get_style : Style.prop -> t -> Jstr.t

get_style p e is the inline style property p of e.

val set_style : ?⁠important:bool -> Style.prop -> Jstr.t -> t -> unit

set_style ~important p v e sets the inline style property p of e to v with priority important (defaults to false).

val rset_style : ?⁠important:bool -> Style.prop -> on:Jstr.t Note.event -> t -> unit

rset_style ~important p ~on e sets the inline style property p of e to the value of on whenever it occurs with priority important (defaults to false).

val def_style : ?⁠important:bool -> Style.prop -> Jstr.t Note.signal -> t -> unit

def_style p v e sets the inline style property p of e over time with the value of v. Warning. This assumes v is the only entity interacting with that property.

Focus

val set_focus : bool -> t -> unit

focus b e sets the focus of e to b.

val rset_focus : on:bool Note.event -> t -> unit

rset_focus e ~on sets e's focus with the value of on whenever it occurs.

val def_focus : bool Note.signal -> t -> unit

def_focus e v defines the focus of e over time with the value of v. Warning. This asumes v is the only entity interacting with e's focus.

Click simulation

val click : t -> unit

click e simulates a click on e.

val select_txt : t -> unit

select_txt e selects the textual contents of e. If the DOM element e has no select method this does nothing.

Life-cycle callbacks

The browser document is watched for changes via a global MutationObserver. Whenever an element is added in the HTML DOM, its on_add callbacks get called and disposed. Whenever an element is removed from the HTML DOM, on_rem callbacks get called and disposed. A element is deemed part of the HTML DOM if its root node is the browser document.

val on_add : (unit -> unit) -> t -> unit

on_add f e references f until e is inserted in the HTML DOM, at which point f () is invoked.

val on_rem : (unit -> unit) -> t -> unit

on_rem f e references f until e is removed from the HTML DOM, at which point f () is invoked.

Note loggers

val call : ('a -> t -> unit) -> on:'a Note.event -> t -> unit

call f ~on e calls f on e with the value of e whenever on occurs. The underlying logger is held by e.

val hold_logr : t -> Note.Logr.t -> unit

hold_logr e l lets e hold logger l and destroy it via on_rem once e is removed from the document.

val may_hold_logr : t -> Note.Logr.t option -> unit

may_hold_logr e l is like hold_logr but does nothing on None.

Element constructors

Convention. Whenever an element name conflicts with an OCaml keyword we prime it, see for example object'.

module Name : sig ... end

Element names.

type 'a cons = ?⁠atts:Att.t list -> child list -> [> t ] as a

The type for element constructors. This is simply v with a pre-applied element name.

val a : 'a cons

a

val abbr : 'a cons

abbr

val address : 'a cons

address

val area : 'a cons

area

val article : 'a cons

article

val aside : 'a cons

aside

val audio : 'a cons

audio

val b : 'a cons

b

val base : 'a cons

base

val bdi : 'a cons

bdi

val bdo : 'a cons

bdo

val blockquote : 'a cons

blockquote

val body : 'a cons

body

val br : 'a cons

br

val button : 'a cons

button

val canvas : 'a cons

canvas

val caption : 'a cons

caption

val cite : 'a cons

cite

val code : 'a cons

code

val col : 'a cons

col

val colgroup : 'a cons

colgroup

val command : 'a cons

command

val datalist : 'a cons

datalist

val dd : 'a cons

dd

val del : 'a cons

del

val details : 'a cons

details

val dfn : 'a cons

dfn

val div : 'a cons

div

val dl : 'a cons

dl

val dt : 'a cons

dt

val em : 'a cons

em

val embed : 'a cons

embed

val fieldset : 'a cons

fieldset

val figcaption : 'a cons

figcaption

val figure : 'a cons

figure

footer

val form : 'a cons

form

val h1 : 'a cons

h1

val h2 : 'a cons

h2

val h3 : 'a cons

h3

val h4 : 'a cons

h4

val h5 : 'a cons

h5

val h6 : 'a cons

h6

val head : 'a cons

head

val header : 'a cons

header

val hgroup : 'a cons

hgroup

val hr : 'a cons

hr

val html : 'a cons

html

val i : 'a cons

i

val iframe : 'a cons

iframe

val img : 'a cons

img

val input : 'a cons

input

val ins : 'a cons

ins

val kbd : 'a cons

kbd

val keygen : 'a cons

keygen

val label : 'a cons

label

val legend : 'a cons

legend

val li : 'a cons

li

link

val map : 'a cons

map

val mark : 'a cons

mark

val menu : 'a cons

menu

val meta : 'a cons

meta

val meter : 'a cons

meter

val nav : 'a cons

nav

val noscript : 'a cons

noscript

val object' : 'a cons

object

val ol : 'a cons

ol

val optgroup : 'a cons

optgroup

val option : 'a cons

option

val output : 'a cons

output

val p : 'a cons

p

val param : 'a cons

param

val pre : 'a cons

pre

val progress : 'a cons

progress

val q : 'a cons

q

val rp : 'a cons

rp

val rt : 'a cons

rt

val ruby : 'a cons

ruby

val s : 'a cons

s

val samp : 'a cons

samp

val script : 'a cons

script

val section : 'a cons

section

val select : 'a cons

select

val small : 'a cons

small

val source : 'a cons

source

val span : 'a cons

span

val strong : 'a cons

strong

val style : 'a cons

style

val sub : 'a cons

sub

val summary : 'a cons

summary

val sup : 'a cons

sup

val table : 'a cons

table

val tbody : 'a cons

tbody

val td : 'a cons

td

val textarea : 'a cons

textarea

val tfoot : 'a cons

tfoot

val th : 'a cons

th

val thead : 'a cons

thead

val time : 'a cons

time

val title : 'a cons

title

val tr : 'a cons

tr

val track : 'a cons

track

val u : 'a cons

u

val ul : 'a cons

ul

val var : 'a cons

var

val video : 'a cons

video

val wbr : 'a cons

wbr