An adapter allows BeamToIX to decouple from DOM by serving as an agent
between the BeamToIX library and elements and scenes.
For DOM adapters, BeamToIX uses jQuery to query DOM and
maps special properties such text and html to
textContent and innerHTML.
DOM adapters map [DOM Properties](DOM Property) into either HtmlElement attributes
or CSS properties, depending on the Animation Property name.
For HtmlElement attributes, the DOM Adapter uses element.getAttribute.
For CSS Properties, it uses element.style, but if it's empty,
it retrieves all the computed CSS properties via window.getComputedStyle
and caches its content.
DOM Adapters use the attribute data-beamtoix-display to define which
value will be used in display when visible is set to true.
If it's not defined, it will be set to inline for span tags,
and block for all the other tags.
'DOM Scenes' are typically a DIV. 'DOM Elements' can be any HtmlElement.
'DOM Scenes' can provide Virtual Elements via ids starting with %,
and story.onGetVirtualElement.
For Virtual adapters there is a direct connection to the Virtual Element
and Scene property.
Unlike DOM elements which only provide textual values, Virtual Elements can
get and set numerical values.
DevToIX
Description
An adapter allows BeamToIX to decouple from DOM by serving as an agent between the BeamToIX library and elements and scenes.
For DOM adapters, BeamToIX uses
jQueryto query DOM and maps special properties suchtextandhtmltotextContentandinnerHTML.DOM adapters map [DOM Properties](DOM Property) into either HtmlElement attributes or CSS properties, depending on the Animation Property name.
For HtmlElement attributes, the DOM Adapter uses
element.getAttribute. For CSS Properties, it useselement.style, but if it's empty, it retrieves all the computed CSS properties viawindow.getComputedStyleand caches its content.DOM Adapters use the attribute
data-beamtoix-displayto define which value will be used indisplaywhen visible is set to true. If it's not defined, it will be set toinlineforspantags, andblockfor all the other tags.'DOM Scenes' are typically a DIV. 'DOM Elements' can be any HtmlElement.
'DOM Scenes' can provide Virtual Elements via ids starting with
%, andstory.onGetVirtualElement.For Virtual adapters there is a direct connection to the Virtual Element and Scene property.
Unlike DOM elements which only provide textual values, Virtual Elements can get and set numerical values.