Adding documentation to root.js

This commit is contained in:
Jeff Avallone 2015-04-23 19:37:24 -04:00
parent c6af61659f
commit 661e7fa6fb

View File

@ -1,3 +1,6 @@
// Root nodes contain the top-level [Regexp](./regexp.html) node. Any flags
// and a few decorative elements are rendered by the root node.
import _ from 'lodash'; import _ from 'lodash';
export default { export default {
@ -9,17 +12,22 @@ export default {
m: 'Multiline' m: 'Multiline'
}, },
// Renders the root into the currently set container.
_render() { _render() {
var flagText; var flagText;
// Render a label for any flags that have been set of the expression.
if (this.flags.length > 0) { if (this.flags.length > 0) {
flagText = this.container.text(0, 0, `Flags: ${this.flags.join(', ')}`); flagText = this.container.text(0, 0, `Flags: ${this.flags.join(', ')}`);
} }
// Render the content of the regular expression.
return this.regexp.render(this.container.group()) return this.regexp.render(this.container.group())
.then(() => { .then(() => {
var box; var box;
// Move rendered regexp to account for flag label and to allow for
// decorative elements.
if (flagText) { if (flagText) {
this.regexp.transform(Snap.matrix() this.regexp.transform(Snap.matrix()
.translate(10, flagText.getBBox().height)); .translate(10, flagText.getBBox().height));
@ -30,6 +38,7 @@ export default {
box = this.regexp.getBBox(); box = this.regexp.getBBox();
// Render decorative elements.
this.container.path(`M${box.ax},${box.ay}H0M${box.ax2},${box.ay}H${box.x2 + 10}`); this.container.path(`M${box.ax},${box.ay}H0M${box.ax2},${box.ay}H${box.x2 + 10}`);
this.container.circle(0, box.ay, 5); this.container.circle(0, box.ay, 5);
this.container.circle(box.x2 + 10, box.ay, 5); this.container.circle(box.x2 + 10, box.ay, 5);
@ -37,6 +46,7 @@ export default {
}, },
setup() { setup() {
// Convert list of flags into text describing each flag.
this.flags = _(this.properties.flags.textValue).unique().sort().map(flag => { this.flags = _(this.properties.flags.textValue).unique().sort().map(flag => {
return this.flagLabels[flag]; return this.flagLabels[flag];
}).value(); }).value();