Bonaparte Core - API

  var bp = require('bonaparte');

• bp.attribute

• get()
• matchName()
• remove()
• set()

• bp.module

• mixin()

• bp.tag

• closest()
• contains()
• create()
• DOMReady()
• observe()
• triggerEvent()

bp.attribute

Utility functions that should be used to handle attributes. They automatically handle both name and data-name attributes in one go and normalize events across browsers.

bp.attribute.get();

Get an attribute from the given tag by attribute name. Automatically checks for data-[name] as well. Return: attribute value.

bp.attribute.get(
  (HTMLElement)   element,
  (String)        attributeName,
)

bp.attribute.matchName();

Compares two attribute names and checks if they are the same with: "attributeName" === "data-attributeName" Returns: true|false

bp.attribute.matchName(
  (String)      attributeName1,
  (String)      attributeName2
)

bp.attribute.remove();

Removes an attribute from the given tag. Checks automatically if the attribute exists with or without data- prefix.

bp.attribute.remove(
  (HTMLElement)   element,
  (String)        attributeName
)

bp.attribute.set();

Set an attribute on the given tag. Checks automatically if the attribute exists with or without data- prefix.

bp.attribute.set(
  (HTMLElement)   element,
  (String)        attributeName,
  (String)        value
)

bp.module

bp.module.mixin()

Combines modules into a new module Returns a module.

var module = bp.modules.mixin(
    (Function)   module,                 // Modules to be combined
    (Function)   module,                 // Modules will be instanciated in the order they they are passed to the mixin funcition.
    ...
)

Modules are combinded to an objct. Read more about the objct library here

bp.tag

bp.tag.closest();

Traverses up the element tree to find the first element that matches the given selector. Returns: Element|undefined

bp.tag.closest(
  (HTMLElement)   element,
  (querySelector) selector
)

bp.tag.contains();

Checks one Element is placed inside another. Returns: true|false

bp.tag.contains(
  (HTMLElement) parent,
  (HTMLElement) child
)

bp.tag.create();

Creates a new bonaparte-tag from modules. Returns Tag Factory.

var tag = bp.tag.create( 
    (String) name,                    // Tag name. "-bonaparte" is automatically appended.
    (Array|Function) modules,         // Modules the new tag includes.
  [ (HTMLElement) htmlBaseElement ]   // Define the html element this tag inherits from (Default: HTMLElement)
)

////////////
// Static functions

tag.register();                         // Registers tag in HTML. After calling this function, the tag can be used in HTML.
tag.initialize( (HTMLElement) tag );    // Initializes the tag on an existion HTMLElement.
tag.mixin( (Array) mixins );            // Define mixins to chustomize existing tags behaviors.      

The returned Tag Factory that can be.

• Used as a mixin in other tags to extend their functionality.
• Registered to the DOM with tag.register()
• Initiated on an existing element in the DOM with tag.initialize(element)
• Extended with modules through tag.mixin(module)

A Tag Factory is an objct. Read more about the objct library here

Static methods on modules become static methods on the Tag Factory.

bp.tag.DOMReady();

Calls the handler function when the DOM is ready. If the DOM is already completed, the handler is called imediately.

bp.tag.DOMReady(
  (function) handler
)

bp.tag.observe();

Sets on observer on the given Element. The observed element now emits bonaparte.tag.attributeChanged and bonaparte.tag.attributeUpdated events.

bp.tag.observe(
  (HTMLElement) element
)

bp.tag.triggerEvent();

Triggers a event on the given HTMLElement Returns: undefined

bp.tag.triggerEvent(
  (String)        event,
  (HTMLElement)   target,
  (Object)        data,
 [(Boolean)       bubbles = true ]
 [(Boolean)       cancelable=true]
)