ender-js

0.5.0 • Public • Published

ENDER-JS

This is the home of ender's client code. It's what provides the glue for pulling together otherwise independent modules into a single cohesive library.

THE API

The bridge is what Ender uses to connect modules to the main ender object.

noConflict

It's key to note that Ender users have the optional ability to call noConflict() on Ender in case the top-level $ symbol is already taken. With that in mind, Developers should always wrap their Ender extensions as such:

!function ($) {
  // extend ender
}(ender);

Top level methods

To create top level methods, like for example $.myUtility(...), you can hook into Ender by calling the ender method:

!function ($) {
  $.ender({
    myUtility: myLibFn
  });
}(ender);

(note - this is the default integration if no bridge is supplied)

The Internal chain

Another common case for Plugin developers is to be able hook into the internal collection chain. To do this, simply call the same ender method but pass true as the second argument:

!function ($) {
  $.ender(myExtensions, true);
}(ender);

Within this scope the internal prototype is exposed to the developer with an existing elements instance property representing the node collection. Have a look at how the Bonzo DOM utility does this. Also note that the internal chain can be augmented at any time (outside of this build) during your application. For example:

<script src="ender.js"></script>
<script>
// an example of creating a utility that returns a random element from the matched set
!function ($) {

  $.ender({
    rand: function () {
      return this[Math.floor(Math.random() * (this.length))];
    }
  }, true);

}(ender);
$('p').rand();
</script>

Selector Engine API

Ender also exposes a unique privileged variable called $._select, which allows you to set the Ender selector engine. Setting the selector engine provides ender with the $ method, like this:

$('#foo .bar')

Setting the selector engine is done like so:

$._select = mySelectorEngine;

You can see it in practice inside Qwery's ender bridge

If you're building a Mobile Webkit or Android application, it may be a good idea to simply set it equal to QSA:

$._select = function (selector, root) {
  return (root || document).querySelectorAll(selector);
}

CommonJS like Module system

Ender exposes a module API which is based on CommonJS Modules spec v1.1.1. There are two methods it exposes to do this.

The first method is require. Require takes a string which corresponds to a package name and returns a package object. For example:

var _ = require('underscore') //return the underscore object

To register a package use the provide method. The provide method looks like this:

provide("myPackage", myPackageObj)

These methods are particularly useful when working with microlibs which are already CommonJS compliant (like underscore, backbone, etc.). It is also great when you run into libs who are competing for the same namespace. So for example, if microlib "foo" and microlib "bar" both expose a method baz -- you could use require to gain access to the method being overridden -- as well as set which method you would prefer to be on ender's internal chain... for example:

$.ender({baz: require('foo').baz}); // sets $.baz to be foo's method baz
$.ender({baz: require('bar').baz}); // changes $.baz to be bar's method baz

require('foo').baz() //foo's baz is still accessible at any time.

License

Ender (the wrapper) is licensed under MIT - copyright 2011 Dustin Diaz & Jacob Thornton

For the individual modules, see their respective licenses.

Readme

Keywords

none

Package Sidebar

Install

npm i ender-js

Weekly Downloads

3

Version

0.5.0

License

none

Last publish

Collaborators

  • fat
  • ded
  • rvagg
  • amccollum
  • luk