Adding documentation to root.js
This commit is contained in:
parent
c6af61659f
commit
661e7fa6fb
@ -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();
|
||||||
|
Loading…
Reference in New Issue
Block a user