marko-real-state
Version:
Marko (v3) Real State ===========================
154 lines (127 loc) • 6.65 kB
JavaScript
/*
This is added from marko-widget 6.6.6 lib/defineRenderer.js
The code is almost the same, except we stripped the part
that is going to be used in the original file and
def.getInitialState is always retrieve from def
instead of being cached locally. In this way we
can replace it with a version where this is bound
to the widget
You can see the difference with the original with:
*/
var marko = require('marko');
var extend = require('raptor-util/extend');
module.exports = function defineRenderer(def) {
var template = def.template;
var getInitialProps = def.getInitialProps;
var getTemplateData = def.getTemplateData;
var getWidgetConfig = def.getWidgetConfig;
var getInitialBody = def.getInitialBody;
var extendWidget = def.extendWidget;
var loadedTemplate;
// Create a renderer function that takes care of translating
// the input properties to a view state. Also, this renderer
// takes care of re-using existing widgets.
return function renderer(input, out) {
var global = out.global;
var newProps = input;
if (!newProps) {
// Make sure we always have a non-null input object
newProps = {};
}
if (!loadedTemplate) {
// Lazily load the template on first render to avoid potential problems
// with circular dependencies
loadedTemplate = template.render ? template : marko.load(template);
}
var widgetState;
if (def.getInitialState) {
// This is a state-ful widget. If this is a rerender then the "input"
// will be the new state. If we have state then we should use the input
// as the widget state and skip the steps of converting the input
// to a widget state.
if (global.__rerenderWidget && global.__rerenderState) {
var isFirstWidget = !global.__firstWidgetFound;
if (!isFirstWidget || extendWidget) {
// We are the not first top-level widget or we are being extended
// so use the merged rerender state as defaults for the input
// and use that to rebuild the new state. This is kind of a hack
// but extending widgets requires this hack since there is no
// single state since the widget state is split between the
// widget being extended and the widget doing the extending.
for (var k in global.__rerenderState) {
if (global.__rerenderState.hasOwnProperty(k) && !input.hasOwnProperty(k)) {
newProps[k] = global.__rerenderState[k];
}
}
} else {
// We are the first widget and we are not being extended
// and we are not extending so use the input as the state
widgetState = input;
newProps = null;
}
}
}
if (!widgetState) {
// If we do not have state then we need to go through the process
// of converting the input to a widget state, or simply normalizing
// the input using getInitialProps
if (getInitialProps) {
// This optional method is used to normalize input state
newProps = getInitialProps(newProps, out) || {};
}
if (def.getInitialState) {
// This optional method is used to derive the widget state
// from the input properties
widgetState = def.getInitialState(newProps, out);
}
}
global.__firstWidgetFound = true;
// Use getTemplateData(state, props, out) to get the template
// data. If that method is not provided then just use the
// the state (if provided) or the input data.
var templateData = getTemplateData ?
getTemplateData(widgetState, newProps, out) :
widgetState || newProps;
if (templateData) {
// We are going to be modifying the template data so we need to
// make a shallow clone of the object so that we don't
// mutate user provided data.
templateData = extend({}, templateData);
} else {
// We always should have some template data
templateData = {};
}
if (widgetState) {
// If we have widget state then pass it to the template
// so that it is available to the widget tag
templateData.widgetState = widgetState;
}
if (newProps) {
// If we have widget props then pass it to the template
// so that it is available to the widget tag. The widget props
// are only needed so that we can call widget.shouldUpdate(newProps)
templateData.widgetProps = newProps;
if (getInitialBody) {
// If we have widget a widget body then pass it to the template
// so that it is available to the widget tag and can be inserted
// at the w-body marker
templateData.widgetBody = getInitialBody(newProps, out);
} else {
// Default to using the nested content as the widget body
// getInitialBody was not implemented
templateData.widgetBody = newProps.renderBody;
}
if (getWidgetConfig) {
// If getWidgetConfig() was implemented then use that to
// get the widget config. The widget config will be passed
// to the widget constructor. If rendered on the server the
// widget config will be serialized to a JSON-like data
// structure and stored in a "data-w-config" attribute.
templateData.widgetConfig = getWidgetConfig(newProps, out);
}
}
// Render the template associated with the component using the final template
// data that we constructed
loadedTemplate.render(templateData, out);
};
};