Define available callbacks for events used as directives

[paleo]

Hi, thanks for this amazing template engine. Here is a suggestion.

I currently use events with this kind of code:

<input type="text" :onchange="{{ ctrl.changeText }}">

import Template from './Template.monk';
let state = {
  someStateVariable: 'abc',
  ctrl: {
    changeText: e => { /* ... */ }
  }
}
view = Monkberry.render(Template, el, {
  directives: { /* ... */ }
})
view.update(state)

I would like to configure available callbacks the same way as for directives:

import Template from './Template.monk';
let state = {
  someStateVariable: 'abc'
}
view = Monkberry.render(Template, el, {
  directives: { /* ... */},
  callacks: {
    changeText: e => { /* ... */ }
  }
})
view.update(state)

I prefer to not extend the template class. I just need to define available callbacks, like methods in Vue.

---

NB: Personally, I would prefer to use the delegating way. But I can't, because the selector is applied after the rendering of directives. I have sub-components included by directives. The following code interferes with DOM nodes of the sub-components:

view.on('click', 'div', (event) => { ... });

IMO the selector should be applied before to render the directives.

[antonmedv]

So you proposing to add methods? Like this:

Monkberry.render(Template, el, {methods:
  callback: () => {...}
});

[paleo]

Yes, but I'm unsure that "methods" is the right term. A method is in the context of the OOP. But it is precisely in order to avoid OOP that I need this feature. If callbacks is not correct, maybe "functions"? Or "procedures"?

Or perhaps we can consider it is a way to provide methods of the template (the template is like an instance), but IMO it's not the proper term because we don't use this to call them.

[antonmedv]

callbacks?

[paleo]

It is my first proposition. A callback is:

In computer programming, a callback is a piece of executable code that is passed as an argument to other code, which is expected to call back (execute) the argument at some convenient time.

We can consider that we pass a list of callbacks as arguments to the code of the template, which we expect that they will be called back at some convenient time. It seems OK.

It depends on which is the syntax in the template, too. For example, we want to define a callback named onChangeText. In the template, which syntax have we to use?

<input type="text" :onchange="{{ onChangeText }}">

or with a prefix (if we need a prefix, then I suggest controller)?

<input type="text" :onchange="{{ controller.onChangeText }}">

Without a prefix, a callbacks option seems a good term:

Monkberry.render(Template, el, {
  callbacks: {
    onChangeText: (event) => {...}
  }
});

However, if the syntax requires a prefix, then I think it would be better to use the same prefix in options:

Monkberry.render(Template, el, {
  controller: {
    onChangeText: (event) => {...}
  }
});

[antonmedv]

Maybe allow to use or not prefixes?

Monkberry.render(Template, el, {
  callbacks: {
    controller: {
       onChangeText: (event) => {...}
    }
  }
});

[paleo]

I'd like that!

[antonmedv]

Will try to implement it in next release.

[paleo]

Hello, is there a date scheduled for the release of this feature?

[antonmedv]

Hi, I haven't time for scheduled work on this project any more. But I have plans on releasing new major version v5, but again – I don't know when. If you, or somebody else wants to become a maintainer – your're welcome.