0.3.1 • Published 7 years ago
mobiledoc-html-renderer v0.3.1
Mobiledoc HTML Renderer
This package is deprecated and will not be updated. Please see Rendering HTML on the mobiledoc-dom-renderer README.md
for a supported path to render Mobiledoc as HTML.
This is an HTML renderer for the Mobiledoc format used by Mobiledoc-Kit.
To learn more about Mobiledoc cards and renderers, see the Mobiledoc Cards docs.
The renderer is a small library intended for use in servers that are building HTML documents. It may be of limited use inside browsers as well.
Usage
var mobiledoc = {
version: "0.2.0",
sections: [
[ // markers
['B']
],
[ // sections
[1, 'P', [ // array of markups
// markup
[
[0], // open markers (by index)
0, // close count
'hello world'
]
]
]
]
};
var renderer = new HTMLRenderer({cards: []});
var rendered = renderer.render(mobiledoc);
console.log(rendererd.result); // "<div><p><b>hello world</b></p></div>"
The Renderer constructor accepts a single object with the following optional properties:
cards
array - The list of card objects that the renderer may encounter in the mobiledoccardOptions
object - Options to pass to cards when they are renderedunknownCardHandler
function - Will be called when any unknown card is enounteredunknownAtomHandler
function - Will be called when any unknown atom is enounteredsectionElementRenderer
object - A map of hooks for section element rendering.- Valid keys are P, H1, H2, H3, BLOCKQUOTE, PULL-QUOTE
- A valid value is a function that returns an element
The return value from renderer.render(mobiledoc)
is an object with two properties:
result
string - The rendered resultteardown
function - When called, this function will tear down the rendered mobiledoc and call any teardown handlers that were registered by cards when they were rendered
sectionElementRenderer
Use this renderer option to customize what element is used when rendering a section.
var renderer = new MobiledocHTMLRenderer({
sectionElementRenderer: {
P: function() { return document.createElement('span'); },
H1: function() { return document.createElement('h2'); },
H2: function() {
var element = document.createElement('h2');
element.setAttribute('class', 'subheadline');
return element;
}
/* Valid keys are P, H1, H2, H3, BLOCKQUOTE, PULL-QUOTE */
}
});
var rendered = renderer.render(mobiledoc);
Tests
Command-line:
npm test
Or in the browser:
broccoli serve
- visit http://localhost:4200/tests
Releasing
npm version patch
orminor
ormajor
npm run build
git push bustle --tags
npm publish