DOM helpers¶
Source code: src/lib_graph.js,
src/lib_icons.js,
src/yui_inputs.js,
src/yui_toolbar.js
Classes of a set of elements¶
Each function takes a container and a selector, and it works on every element that matches inside the container.
addClasses($container, selector, ...classNames)¶
Adds the classes.
removeClasses($container, selector, ...classNames)¶
Removes the classes.
toggleClasses($container, selector, ...classNames)¶
Adds the classes that are absent, and removes the classes that are present.
removeChildElements($element)¶
Removes every child of an element.
disableElements($container, selector)¶
Disables the elements that match.
enableElements($container, selector)¶
Enables the elements that match.
States of an action¶
The functions below write the state of a set of elements. The first three write a color; the fourth writes the look of a control that is pressed.
set_submit_state($container, selector, set)¶
Writes the state of “there are changes to save”, in orange.
set_cancel_state($container, selector, set)¶
Writes the state of “the cancel is possible”, in red.
set_active_state($container, selector, set)¶
Writes the state of “active”, in violet. The library uses it for the buttons of the history, undo and redo.
set_pressed_state($container, selector, set)¶
Writes the state of “this toggle is on”. It does not use a color: it gives the control the look of a button that is pressed, an inverted neutral. A color of the group above tells which KIND of action a control does, and a toggle that is on is not an action — it is a state. Two controls of the same toolbar with the same color, for two different reasons, are more difficult to read than one control that looks pressed.
Color¶
getStrokeColor(fillColor, theme, factor)¶
Gives a color of line for a color of fill, in the form rgba(). It makes the
color lighter or darker by factor, which is 0.2 by default, and the direction
depends on the theme. It accepts the hexadecimal form and the rgb() form.
Icons¶
inject_svg_icons()¶
Puts the set of SVG symbols in the document. A second call does nothing, because a guard on the identifier of the element stops it.
Inputs¶
attach_clear($control, $input, on_clear)¶
Adds a button of clear to a control that holds an input, and gives the button back. The button appears only when the input holds a value and accepts a write.
refresh_clear($input)¶
Looks at the button of clear again, after a change that the code made: a value that a form loaded, or a change of the read-only state. Neither of those sends an event of input, so nothing else looks. It does nothing on an input that has no button of clear.
Toolbar¶
yui_toolbar(attrs, items)¶
Builds a toolbar that scrolls, with an arrow at each end when the items do not
fit. The arrows take the icons of the set of the library, and they take their
color from currentColor, so the two themes work.