wire/dom/jquery

[tmk]

Hi Everybody,

I'm new to cujojs which I've been learning for the last couple of weeks.

Sor far I'm REALLY impressed, most notably by wire.

I've got tons of newbie questions some please bear with me :-)

One major question I have is regarding objects wired using wire/dom/jquery

Fist question: How am I suppose to use a component rendered using wire/dom/jquery

For exemple consider the following component:

    template: {

        render: {

            template: { module: 'text!app/cropper/template.html' },

            css: { module: 'css!/app/cropper/style.css' },

        }

    }

After injecting this component as an object property, I expected to get a full-flegged jQuery object.

But it doesn't seem to be the case. So Im not sure what to do with this component. 

For example how to I insert it into the DOM? Are the DOM event connections set in wire preserved?

Hope the question makes sense.

Thanks for any help

/tmk

[tmk]

Oops sorry my post below got mixed up with another one.

My question below is not directly related to wire/dom/js but to the render factory.

So I guess my question is how to use a DOM component directly in the code (i.e. not by using the insert facet)?

[unscriptable]

Hey tmk,

We'd debated whether to $-wrap dom nodes when using wire/dom/jquery.  However, doing that would remove one of the current benefits: library independence.  

(As we discussed on irc) the render factory returns a plain dom node, so you should be able to wrap it fairly easily, if needed.

> For example how to I insert it into the DOM? 

We like to use the "insert" facet, but you can also do it in code via `parentNode.appendChild(template)` or similar.

> Are the DOM event connections set in wire preserved?

Yes.  They are removed when the context is destroyed, too.

Regards,

-- John

[Brian Cavalier]

On Thursday, October 3, 2013 10:58:26 AM UTC-4, unscriptable wrote:

> Are the DOM event connections set in wire preserved?

Yes.  They are removed when the context is destroyed, too.

To add to what unscriptable says: in general, wire attempts to manage the lifecycle of whatever components it creates.  When you wire a spec, the result is a set of fully realized components that exist inside a "context" (a really generic name, but that's what we call it!).  When that context is destroyed, all its components will be destroyed.  Wire plugins can effectively register to manage components of different types.

For example, in the case of a DOM node, if you create one using wire (e.g. using the render factory), and then add event handlers to it (e.g. using "on" from wire/on, wire/jquery/on, or wire/dojo/on), when the enclosing context is destroyed (either explicitly, or as a result of its parent context being destroyed), the node will be removed from the DOM, and all its event connections disconnected automatically.

Component lifecycle management is a big part of wire: anything you ask wire to create, you can pretty much rely on it automatically cleaning up for you.  The converse is, of course, that when you create things programmatically outside of wire, you need to clean them up yourself (as always!).

[tmk]

Thanks for clarifying that, it is indeed a great benefit of using wire.

I should keep that in mind and leverage wire more where I can instead of doing thing in code :-).

[tmk]

Hey John,

On Thursday, October 3, 2013 4:58:26 PM UTC+2, unscriptable wrote:

Hey tmk,

We'd debated whether to $-wrap dom nodes when using wire/dom/jquery.  However, doing that would remove one of the current benefits: library independence.  

I agree that it's best to preserve that benefit especially since there are (as you and Brian kindly pointed out on irc) many ways to achieve similar results while preserving that independance.

Thanks.