Erik,
I really should put a practical example together so people can use it as a reference. But basically you have options. If you want to have modules handle their own rendering that is up to you. In the past I typically provide rendering at the Kernel level through an extension. Here is a trivial example:
Kernel.extend(Kernel, {
// Gets called for each module when using Kernel.start or Kernel.startAll
onStart: function(instance) {
if (instance.render) this.renderModule(instance);
},
renderModule: function(instance) {
// Do stuff, inject html into your app, render a module "shell" if you want
// And don't forget to call init() when you are done.
instance.init();
}
});
However, recently I have moved rendering to the module itself because in many cases I want to defer the rendering until I have gotten some data from somewhere. In those cases I simply use onStart to add a few helper methods to my modules:
Kernel.extend(Kernel, {
// Gets called for each module when using Kernel.start or Kernel.startAll
onStart: function(instance) {
if (instance.render) this.addHelpers(instance);
// Don't forget to call init()
instance.init();
},
addHelpers: function(instance) {
// We'll make sure that all modules with a `render` method also have an `applyTemplate` method
instance.applyTemplate = instance.applyTemplate || function(data) {
// Assumes the module has an `el` reference to a valid element
instance.el.innerHTML = instance.template(data);
}
}
});
Ok so the above is pseudo code but you get the idea. As a module is started a new method `applyTemplate` is added to the module. This method will call the module's `template` method (which accepts data as a parameter) and then assign the results (presumably html) into the module's `el` property which should be a valid html node. Then your module code would look something like this:
Kernel.module.define('MyModule', {
init: function() {
var that = this;
// Get some data from somewhere
request = $.ajax(. . .);
request.done(function(data) {
that.applyTemplate(data);
})
},
template: function(data) {
// Take the data and return html
}
});
This is just an example, you can do it however you want. If you get further into an implementation and want to have me look at it I would be happy to help. Right now I'm afraid your question is still a bit too broad as you can go in many directions with Kernel, it does not recommend a specific way to implement rendering.
Hope this helps.
Alan