Overview

XBLUI provides user interface enhancements for HTML. Enhancements are implemented with element bindings using the W3C's XML Binding Language (XBL)1. XBL provides a simple method of applying and extending the built-in enhancements.

XBLUI is a cross-browser Javascript library and incorporates Javascript and DOM fixes and enhancements to promote standards-based, browser-agnostic web-development.

Since no current browser has a native XBL implementation XBLUI has its own partial, cross-browser implementation. Native XBL implementations will improve the performance of XBLUI enhancements.

To facilitate development XBLUI incorporates cross-browser logging. More tracing features will arrive in future releases.

Notes:
  1. Also commonly referred to as XBL2, not to be confused with the non-compatible Mozilla XBL also known as XBL1.

Quick start

Using XBLUI in your web-page is typically a three step process:

  1. include the XBLUI script
  2. create a XBL document to specify which elements receive user interface enhancements
  3. include the XBL document with a link or style element (similar to including a CSS document)

The following example illustrates the simple case of adding numeric input functionality to a HTML input element as in the Web Forms 2 specification:

<html>

<head>

<script src="http://dist.meekostuff.net/XBLUI/default/XBLUI.js"></script>1,2

<style type="application/xml">3,4

<xbl xmlns="http://www.w3.org/ns/xbl">

<binding

element="input[type=number]"

extends="http://dist.meekostuff.net/XBLUI/default/WF2.xml#WF2NumberInput"/>

</xbl>

</style>

</head>

<body>

<label>Enter a number from 0 to 100

<input type="number" min="0" max="100" value="50" />

</label>

</body>

</html>
Notes:
  1. This is the default script path. You can also choose a specific version. See Distribution
  2. In general the script element should be at the top of the head element.
  3. The type attribute of the style element must be "application/xml". See Including Binding Documents
  4. The XBL specification also allows bindings to be applied using CSS style-sheets. This is not yet available using XBLUI.

License

Long-term licensing is still to be decided.

Until further notice you may use the XBLUI library by including the following line in a web-page:

<script src="http://dist.meekostuff.net/XBLUI/default/XBLUI.js"></script>

No other use is permitted.