Dynamically creating controller bindings/listeners/subscribers

[Thomas Reynolds]

Hi guys,

With JavascriptMVC 2, I used to dynamically add new bindings like so:

this["somethingCustom subscribe"] = function() { /* do something */ };

However, with 3.0, it seems the logic for subscribing to events has
moved to earlier in the controller evaluation and has been hidden away
inside a local _bindings variable.

Can I/we get a documented api for adding new listeners to an already
instantiated controller? Please :)

Thanks,

-Thomas Reynolds

[Brian Moschel]

Hi Thomas,

In 3.0 this openajax publish/suscribe functionality is part of the jquery/controller/subscribe plugin.

so do:

steal.plugins('jquery/controller/subscribe')

Then you can do stuff like:

            $.Controller.extend('subscribeTest',{

                onDocument: false

            },

            {

                "#subscribe1 click": function(el, ev){

                    ev.stopPropagation();

                    this.publish("oaSubscribe1", {"params":"Hola Mundo"});

                },

                "oaSubscribe1 subscribe": function(called, data){

                    alert("subscribe1 " + data.params + " : " + this.Class.shortName);

                }

--
You received this message because you are subscribed to the Google Groups "JavaScriptMVC" group.
To post to this group, send email to javasc...@googlegroups.com.
To unsubscribe from this group, send email to javascriptmv...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/javascriptmvc?hl=en.

--
Brian Moschel

Jupiter Consulting
\Development\Training\Support
847-727-1609
brian....@gmail.com

[Justin Meyer]

There's delegate and bind. We probably need a subscribe.

Sent from my iPhone

[Justin Meyer]

He's talking about dynamically adding them I think?

Sent from my iPhone

[Thomas Reynolds]

Yes, but I need to dynamically add them. Say I want "#subscribe1" in your example to have that #1 be dynamic. A variable that I pass in during instantiation.

I suppose this could work:

OpenAjax.hub.subscribe("someevent, this.callback(function() {

}));

May I suggest a round of code cleanup/commenting before 3.0 is released. The end-user documentation is getting very nice, but trying to understand/read something like jquery/controller/controller.js is still pretty rough.

I fully understand javascript, but some better variable names or splitting things out into well-named methods would help. I'd love to contribute, but some of this stuff is pretty dense:

var funcName, 

convertedName, 

func, 

a, 

act, 

c = this.Class, 

b = c.breaker, 

cb;

//adds bindings

this._bindings = [];

for(funcName in c.actions){

var ready = c.actions[funcName]

cb = this.callback(funcName)

this._bindings.push( ready.action(element, ready.parts[2], ready.parts[1], cb, this) )

}

[Thomas Reynolds]

Actually, the following won't work because it won't listen for strings like "#elem click"

OpenAjax.hub.subscribe("someevent, this.callback(function() {

}));

-Thomas

[Justin Meyer]

I'm not sure what you mean. :-(

Sent from my iPhone

[Justin Meyer]

I think I understand ...

You want something like what we do with menu, where we can change the type of event that opens a menu (mouseenter, click, hoverenter, etc), but you want that on a selector.  Well, you are in luck :).

You can have parameterized action names like:

"#todo{todoId} click" : function(){ 

};

But this only works with the ad-hoc classes.  I can probably change that so something like this would work:

$.Controller.extend("Alertable",{

  "#alertable{alertId} click" : function(el){

    alert(el.attr('id');

  }

})

$("#container').alertable({alertId: 5});

Would that work for you?

Justin Meyer

Jupiter Consulting
\Development\Training\Support

847-924-6039
justin...@gmail.com

[Justin Meyer]

It is dense ... let me see what I can do.

Justin Meyer

Jupiter Consulting
\Development\Training\Support
847-924-6039
justin...@gmail.com

[Justin Meyer]

Ok, done.  Let me know if controller makes any more sense to you.  Here's how it basically works:

Controller.setup

Create the jQuery plugin

Go through the list of methods, check if they are an action

If they are an action, save the processor and the parts

Controller.prototype.setup

Set up the controller in data, it's element, so it can be destroyed, etc

Go through the cached actions, use the processor to bind a callback to the action's method.

Processors:

Processors are something that takes a selector / event pair, an element, a controller, and a callback, and binds that callback appropriately.  It returns a function that when called, unbinds the callback.

It's quite simple in concept.  However, there a lot of weird logic to make controllers easy to add new processors and run fast.