From f0c25dfc41035ab11497215d7a8b8703308bb1a9 Mon Sep 17 00:00:00 2001 From: Jeff Avallone Date: Wed, 10 Dec 2014 19:01:57 -0500 Subject: [PATCH] Simplifying code related to passing rendering through to nested node --- src/js/parser/javascript/any_character.js | 2 +- src/js/parser/javascript/base.js | 20 ++++- src/js/parser/javascript/charset.js | 4 +- src/js/parser/javascript/charset_range.js | 4 +- src/js/parser/javascript/escape.js | 2 +- src/js/parser/javascript/literal.js | 2 +- src/js/parser/javascript/match.js | 38 ++++----- src/js/parser/javascript/match_fragment.js | 41 +++++---- src/js/parser/javascript/regexp.js | 96 +++++++++++----------- src/js/parser/javascript/root.js | 4 +- src/js/parser/javascript/subexp.js | 15 ++-- 11 files changed, 115 insertions(+), 113 deletions(-) diff --git a/src/js/parser/javascript/any_character.js b/src/js/parser/javascript/any_character.js index e3710da..01948f3 100644 --- a/src/js/parser/javascript/any_character.js +++ b/src/js/parser/javascript/any_character.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'any-character', - render() { + _render() { this.label = this.renderLabel(this.container, 'any character'); } }); diff --git a/src/js/parser/javascript/base.js b/src/js/parser/javascript/base.js index 1461e50..6ea0166 100644 --- a/src/js/parser/javascript/base.js +++ b/src/js/parser/javascript/base.js @@ -39,6 +39,24 @@ export default { }, render() { + this._render(); + }, + + position() { + if (this._proxy) { + this._proxy.position(); + } else { + this._position(); + } + }, + + proxy(node) { + this._proxy = node; + this._proxy.setContainer(this.container); + this._proxy.render(); + }, + + _render() { console.log(this); this.container.addClass('placeholder'); @@ -51,7 +69,7 @@ export default { }); }, - position() { + _position() { this.positionLabel(this.label); }, diff --git a/src/js/parser/javascript/charset.js b/src/js/parser/javascript/charset.js index c8d6da2..33540de 100644 --- a/src/js/parser/javascript/charset.js +++ b/src/js/parser/javascript/charset.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'charset', - render() { + _render() { this.renderLabeledBox(this.invert() ? 'None of:' : 'One of:'); this.partContainer = this.container.group(); @@ -15,7 +15,7 @@ export default _.extend({}, Base, { }).bind(this)); }, - position() { + _position() { _.invoke(this.parts.elements, 'position'); this.spaceVertically(this.parts.elements, { diff --git a/src/js/parser/javascript/charset_range.js b/src/js/parser/javascript/charset_range.js index 14366a9..7c08ad6 100644 --- a/src/js/parser/javascript/charset_range.js +++ b/src/js/parser/javascript/charset_range.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'charset-range', - render() { + _render() { this.first.setContainer(this.container.group()); this.first.render(); @@ -17,7 +17,7 @@ export default _.extend({}, Base, { }); }, - position() { + _position() { var box; this.first.position(); diff --git a/src/js/parser/javascript/escape.js b/src/js/parser/javascript/escape.js index 03d8455..6cf8db9 100644 --- a/src/js/parser/javascript/escape.js +++ b/src/js/parser/javascript/escape.js @@ -12,7 +12,7 @@ export default _.extend({}, Base, { return this.esc.arg.textValue; }, - render() { + _render() { this.label = this.renderLabel(this.container, _.result(this, this.code())); this.label.select('rect').attr({ diff --git a/src/js/parser/javascript/literal.js b/src/js/parser/javascript/literal.js index 6c7e447..3234bf4 100644 --- a/src/js/parser/javascript/literal.js +++ b/src/js/parser/javascript/literal.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'literal', - render() { + _render() { this.label = this.renderLabel(this.container, '"' + this.literal.textValue + '"'); this.label.select('rect').attr({ diff --git a/src/js/parser/javascript/match.js b/src/js/parser/javascript/match.js index 2e7ce06..4848bdf 100644 --- a/src/js/parser/javascript/match.js +++ b/src/js/parser/javascript/match.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'match', - render() { + _render() { var parts = this.parts(); if (this.anchorStart() || this.anchorEnd() || parts.length !== 1) { @@ -26,33 +26,27 @@ export default _.extend({}, Base, { .addClass('anchor'); } } else { - this.content = parts[0]; - this.content.setContainer(this.container); - this.content.render(); + this.proxy(parts[0]); } }, - position() { + _position() { var items; - if (this.contents) { - if (this.contents.anchor_start) { - this.positionLabel(this.contents.anchor_start); - } - - if (this.contents.anchor_end) { - this.positionLabel(this.contents.anchor_end); - } - - _.invoke(this.contents.parts, 'position'); - - items = _(this.contents).values().flatten().value(); - this.spaceHorizontally(items, { - padding: 10 - }); - } else { - this.content.position(); + if (this.contents.anchor_start) { + this.positionLabel(this.contents.anchor_start); } + + if (this.contents.anchor_end) { + this.positionLabel(this.contents.anchor_end); + } + + _.invoke(this.contents.parts, 'position'); + + items = _(this.contents).values().flatten().value(); + this.spaceHorizontally(items, { + padding: 10 + }); }, anchorStart() { diff --git a/src/js/parser/javascript/match_fragment.js b/src/js/parser/javascript/match_fragment.js index 6485483..c357cda 100644 --- a/src/js/parser/javascript/match_fragment.js +++ b/src/js/parser/javascript/match_fragment.js @@ -4,41 +4,38 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'match-fragment', - render() { + _render() { if (this._repeat.textValue === '') { - this._content.setContainer(this.container); + this.proxy(this._content); } else { this._content.setContainer(this.container.group()); + this._content.render(); } - this._content.render(); }, - position() { + _position() { var box, paths = []; this._content.position(); + this._content.container.transform(this._repeat.contentPosition()); - if (this._repeat.textValue !== '') { - this._content.container.transform(this._repeat.contentPosition()); + box = this._content.getBBox(); - box = this._content.getBBox(); + if (this._repeat.hasSkip()) { + paths.push(Snap.format('M0,{cy}q10,0 10,-10v-{vert}q0,-10 10,-10h{horiz}q10,0 10,10v{vert}q0,10 10,10', _.extend({ + vert: box.height / 2 - 10, + horiz: box.width - 10 + }, box))); + } - if (this._repeat.hasSkip()) { - paths.push(Snap.format('M0,{cy}q10,0 10,-10v-{vert}q0,-10 10,-10h{horiz}q10,0 10,10v{vert}q0,10 10,10', _.extend({ - vert: box.height / 2 - 10, - horiz: box.width - 10 - }, box))); - } + if (this._repeat.hasLoop()) { + paths.push(Snap.format('M{x},{cy}q-10,0 -10,10v{vert}q0,10 10,10h{width}q10,0 10,-10v-{vert}q0,-10 -10,-10', _.extend({ + vert: box.height / 2 - 10 + }, box))); + } - if (this._repeat.hasLoop()) { - paths.push(Snap.format('M{x},{cy}q-10,0 -10,10v{vert}q0,10 10,10h{width}q10,0 10,-10v-{vert}q0,-10 -10,-10', _.extend({ - vert: box.height / 2 - 10 - }, box))); - } - - if (paths.length) { - this.container.path(paths.join('')); - } + if (paths.length) { + this.container.path(paths.join('')); } } }); diff --git a/src/js/parser/javascript/regexp.js b/src/js/parser/javascript/regexp.js index 62d285c..f83f233 100644 --- a/src/js/parser/javascript/regexp.js +++ b/src/js/parser/javascript/regexp.js @@ -4,12 +4,11 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'regexp', - render() { + _render() { var matches = this.matches(); if (matches.length === 1) { - matches[0].setContainer(this.container); - matches[0].render(); + this.proxy(matches[0]); } else { this.matchContainer = this.container.group() .addClass('regexp-matches'); @@ -22,66 +21,63 @@ export default _.extend({}, Base, { } }, - position() { + _position() { var matches = this.matches(), - includeLines = (matches.length > 1), containerBox, paths; _.invoke(matches, 'position'); - if (includeLines) { - this.spaceVertically(matches, { - padding: 5 - }); + this.spaceVertically(matches, { + padding: 5 + }); - this.matchContainer.transform(Snap.matrix() - .translate(20, 0)); + this.matchContainer.transform(Snap.matrix() + .translate(20, 0)); - containerBox = this.getBBox(); - paths = _.map(matches, match => { - var box = match.getBBox(), - direction = box.cy > containerBox.cy ? 1 : -1, - distance = Math.abs(box.cy - containerBox.cy), - pathStr; + containerBox = this.getBBox(); + paths = _.map(matches, match => { + var box = match.getBBox(), + direction = box.cy > containerBox.cy ? 1 : -1, + distance = Math.abs(box.cy - containerBox.cy), + pathStr; - if (distance >= 15) { - pathStr = [ - 'M10,{box.cy}m0,{shift}q0,{curve} 10,{curve}', - 'M{containerBox.width},{box.cy}m30,{shift}q0,{curve} -10,{curve}' - ].join(''); - } else { - pathStr = [ - 'M0,{containerBox.cy}c10,0 10,{anchor.y} 20,{anchor.y}', - 'M{containerBox.width},{containerBox.cy}m40,0c-10,0 -10,{anchor.y} -20,{anchor.y}' - ].join(''); + if (distance >= 15) { + pathStr = [ + 'M10,{box.cy}m0,{shift}q0,{curve} 10,{curve}', + 'M{containerBox.width},{box.cy}m30,{shift}q0,{curve} -10,{curve}' + ].join(''); + } else { + pathStr = [ + 'M0,{containerBox.cy}c10,0 10,{anchor.y} 20,{anchor.y}', + 'M{containerBox.width},{containerBox.cy}m40,0c-10,0 -10,{anchor.y} -20,{anchor.y}' + ].join(''); + } + + return Snap.format(pathStr, { + containerBox, + box, + shift: -10 * direction, + curve: 10 * direction, + anchor: { + x: box.x + 20, + y: box.cy - containerBox.cy } - - return Snap.format(pathStr, { - containerBox, - box, - shift: -10 * direction, - curve: 10 * direction, - anchor: { - x: box.x + 20, - y: box.cy - containerBox.cy - } - }); }); + }); - paths.push(Snap.format([ - 'M0,{box.cy}q10,0 10,-10V{top}', - 'M0,{box.cy}q10,0 10,10V{bottom}', - 'M{box.width},{box.cy}m40,0q-10,0 -10,-10V{top}', - 'M{box.width},{box.cy}m40,0q-10,0 -10,10V{bottom}' - ].join(''), { - box: containerBox, - top: _.first(matches).getBBox().cy + 10, - bottom: _.last(matches).getBBox().cy - 10 - })); + paths.push(Snap.format([ + 'M0,{box.cy}q10,0 10,-10V{top}', + 'M0,{box.cy}q10,0 10,10V{bottom}', + 'M{box.width},{box.cy}m40,0q-10,0 -10,-10V{top}', + 'M{box.width},{box.cy}m40,0q-10,0 -10,10V{bottom}' + ].join(''), { + box: containerBox, + top: _.first(matches).getBBox().cy + 10, + bottom: _.last(matches).getBBox().cy - 10 + })); - this.container.prepend(this.container.path(paths.join(''))); - } + this.container.prepend(this.container.path(paths.join(''))); }, matches() { diff --git a/src/js/parser/javascript/root.js b/src/js/parser/javascript/root.js index 8b7806d..343aba1 100644 --- a/src/js/parser/javascript/root.js +++ b/src/js/parser/javascript/root.js @@ -4,7 +4,7 @@ import Base from './base.js'; export default _.extend({}, Base, { type: 'root', - render() { + _render() { this.regexp.setContainer(this.container.group().transform(Snap.matrix() .translate(10, 0))); this.regexp.render(); @@ -17,7 +17,7 @@ export default _.extend({}, Base, { .attr({ r: 5 }); }, - position() { + _position() { var contentBox; this.regexp.position(); diff --git a/src/js/parser/javascript/subexp.js b/src/js/parser/javascript/subexp.js index ab812f7..2f8263d 100644 --- a/src/js/parser/javascript/subexp.js +++ b/src/js/parser/javascript/subexp.js @@ -12,7 +12,7 @@ export default _.extend({}, Base, { '?!': 'negative lookahead' }, - render() { + _render() { var label = this.groupLabel(); if (label) { @@ -21,19 +21,16 @@ export default _.extend({}, Base, { this.regexp.setContainer(this.container.group()); this.regexp.render(); } else { - this.regexp.setContainer(this.container); - this.regexp.render(); + this.proxy(this.regexp); } }, - position() { + _position() { this.regexp.position(); - if (this.groupLabel()) { - this.positionLabeledBox(this.regexp.container, { - padding: 10 - }); - } + this.positionLabeledBox(this.regexp.container, { + padding: 10 + }); }, groupLabel() {