Skip to content

How the Component Handler works

Jonathan Garbee edited this page Jun 8, 2015 · 4 revisions

The component handler is a powerful object that makes sure the JavaScript runs on your application against the elements it is supposed to. Here is a quick run-down of its execution.

  1. The component handler itself is created with an empty registry.
  2. Objects for components are added to the code. Each registers itself to the registry. The registry requires:
    • The object to run the element through.
    • A string to identify this component through. Should be unique throughout all components.
    • The css class to look for on an element for this component to be initialized. This also needs to be unique for all components. It is good practice to use a class not associated with any styling.
  3. The upgradeAllRegistered() method is called from the handler.
    • In short this goes over all registered components. Queries for all nodes with the provided CSS class. Loops over those and instantiates them one-by-one. When the upgrade is done on a node, the upgraded object is added to the dataset. This object contains a comma separated list of component classAsString properties to identify which upgrades have been done.
  4. If you chose to downgrade components, then all registered components to the element will be downgraded if possible.