fractal-core/utils/ssr.js

A minimalist and well crafted app, content or component is our conviction

"use strict";
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
Object.defineProperty(exports, "__esModule", { value: true });
const toHTML_1 = require("../toHTML");
exports.toHTML = toHTML_1.default;
exports.renderHTML = (op) => {
    return new Promise((resolve, reject) => {
        return (() => __awaiter(this, void 0, void 0, function* () {
            try {
                var app = yield op.runModule(op.root, false, { render: false });
                if (op.cb)
                    yield op.cb(app);
                const Root = app.rootCtx.components.Root;
                let view = yield Root.interfaces['view'](Root.state, Root.interfaceHelpers);
                let styleStr = (op.css || '') + app.rootCtx.groupHandlers['style'].state.instance.getStyles();
                let renderData = {
                    view,
                    style: styleStr,
                };
                let html;
                if (op.htmlFn) {
                    html = yield op.htmlFn(op, renderData, app);
                }
                else {
                    html = yield transformHTML(op, renderData, app);
                }
                resolve(html);
            }
            catch (err) {
                reject(err);
            }
        }))();
    });
};
function transformHTML(op, renderData, app) {
    let html = op.html.replace('<!--##HTML##-->', toHTML_1.default(renderData.view));
    html = html.replace('<!--##STYLES##-->', '<style>' + renderData.style + '</style>');
    html = html.replace('<!--##ENCODING##-->', op.encoding || 'utf-8');
    html = html.replace('<!--##DESCRIPTION##-->', op.description || '');
    html = html.replace('<!--##KEYWORDS##-->', op.keywords || '');
    html = html.replace('<!--##AUTHOR##-->', op.author || '');
    html = html.replace('<!--##TITLE##-->', op.title || '');
    html = html.replace('<!--##URL##-->', op.url || '/');
    html = html.replace('<!--##BASE##-->', op.base || '/');
    let bundles = op.bundlePaths.map(p => `<script defer src="${p}?v=${op.version || ''}"></script>`).join('');
    html = html.replace('<!--##BUNDLES##-->', bundles);
    html = html.replace('<!--##EXTRAS##-->', op.extras || '');
    html = html.replace('<!--##LANG##-->', op.lang || 'en');
    html = html.replace('<!--##VERSION##-->', op.version || '');
    let components = {};
    let key;
    let subkey;
    for (key in app.rootCtx.components) {
        if (op.componentNames && op.componentNames.indexOf(key) === -1) {
            continue;
        }
        components[key] = {};
        for (subkey in app.rootCtx.components[key]) {
            if (['state'].indexOf(subkey) !== -1) {
                // avoid cyclic structure
                components[key][subkey] = app.rootCtx.components[key][subkey];
            }
        }
    }
    html = html.replace('<!--##COMPONENTS##-->', JSON.stringify(components));
    html = html.replace('<!--##INITIALIZED##-->', 'true');
    return html;
}
exports.transformHTML = transformHTML;
//# sourceMappingURL=ssr.js.map