wrapper for using bean outside of ender

[devth]

I want to use the familiar syntax for querying, dom manip, events, etc:

$('.foo').on('click', function() { alert('bar') });

but without the ender glue that typically allows it. I've got bonzo and qwery working together with a snippet I found:

function $(selector) {
  return bonzo(qwery(selector));
}

How do I then glue bean into this mix? Just wrapping it doesn't work.

[JacksonGariety]

+1

.setSelectorEngine feels a bit jacky to use outside of an Ender bridge.

[rvagg]

Depends on your use-case, this one made @JacksonGariety happy because he's using Browserify: https://github.com/rvagg/nodei.co/blob/master/browser-lib/ender.js

But it still uses ender-js to glue them together. @devth are you trying to avoid using ender-js here in particular? It does the magic that builds $ nicely but it's not exactly super-complex so you could write your own replacement if need be.

[mrmartineau]

+1

Does anyone have a solution to this?

[rvagg]

You could try bonzo.aug(bean) because Bonzo has some basic augmentation functionality built in for this case, see this method. The methods on the object you feed it will be added to Bonzo.prototype and should be usable from wherever Bonzo is being used.

Depends on precisely how you're piecing these things together and if you're using some other tool to bundle the components together.

[ryanve]

A standalone solution I often use in my own modules is to create the .fn methods in the main file (not in the ender bridge) such that they are callable standalone like bean.fn.on.call(els, type, fn). See vibe for example. Having the effins exposed lets them augment any existing wrapper.

[ryanve]

Maybe bean deserves its own simple wrapper:

function Bean(o) {
    [].push.apply(this, null == o ? [] : o.nodeType || o.window == o ? [o] : o);
}
function bean(o) {
    return new Bean(o);
}
bean.fn = bean.prototype = Bean.prototype;

[devth]

@rvagg yeah, I just wanted to pick a couple lightweight modules according to my needs without relying on the package management side of Ender, which felt pretty heavy for a little prototype I was working on. Didn't realize ender-js was the glue, maybe that's what I'm missing.