Refactoring to remove the container argument to render methods
A reference was being kept generally, so it was more useful to keep it connected to the node
This commit is contained in:
parent
6a9d498bf6
commit
a88c4821b7
@ -4,23 +4,21 @@ import Snap from 'snapsvg';
|
||||
// Testing code
|
||||
(function() {
|
||||
var result = parser.parse('^test?(foo)[a-z]asdf$'),
|
||||
svg = Snap('#regexp-render svg'),
|
||||
container;
|
||||
svg = Snap('#regexp-render svg');
|
||||
|
||||
if (svg) {
|
||||
container = svg.group().transform(Snap.matrix()
|
||||
.translate(10, 10));
|
||||
|
||||
|
||||
document.body.className = 'has-results';
|
||||
result.render(container);
|
||||
|
||||
result.container = svg.group().transform(Snap.matrix()
|
||||
.translate(10, 10));
|
||||
result.render();
|
||||
|
||||
setTimeout(() => {
|
||||
var box;
|
||||
|
||||
result.position();
|
||||
|
||||
box = container.getBBox();
|
||||
box = result.container.getBBox();
|
||||
svg.attr({
|
||||
width: box.width + 20,
|
||||
height: box.height + 20
|
||||
|
@ -36,10 +36,10 @@ export default {
|
||||
});
|
||||
},
|
||||
|
||||
render(container) {
|
||||
container.attr({ 'class': 'placeholder' });
|
||||
render() {
|
||||
this.container.attr({ 'class': 'placeholder' });
|
||||
|
||||
this.label = this.render_label(container, this.textValue);
|
||||
this.label = this.render_label(this.container, this.textValue);
|
||||
},
|
||||
|
||||
position() {
|
||||
|
@ -4,21 +4,23 @@ import Base from './base.js';
|
||||
export default _.extend({}, Base, {
|
||||
type: 'match',
|
||||
|
||||
render(container) {
|
||||
render() {
|
||||
var self = this;
|
||||
|
||||
this.contents = {};
|
||||
|
||||
if (this.anchor_start()) {
|
||||
this.contents.anchor_start = this.render_label(container, 'Start of line');
|
||||
this.contents.anchor_start = this.render_label(this.container, 'Start of line');
|
||||
}
|
||||
|
||||
this.contents.parts = _.map(this.parts(), function(part) {
|
||||
var content = container.group();
|
||||
part.render(content);
|
||||
return { content, part };
|
||||
part.container = self.container.group();
|
||||
part.render();
|
||||
return part;
|
||||
});
|
||||
|
||||
if (this.anchor_end()) {
|
||||
this.contents.anchor_end = this.render_label(container, 'End of line');
|
||||
this.contents.anchor_end = this.render_label(this.container, 'End of line');
|
||||
}
|
||||
},
|
||||
|
||||
@ -30,11 +32,11 @@ export default _.extend({}, Base, {
|
||||
offset += this.contents.anchor_start.getBBox().width;
|
||||
}
|
||||
|
||||
_.each(this.contents.parts, function(thing) {
|
||||
thing.part.position();
|
||||
thing.content.transform(Snap.matrix()
|
||||
_.each(this.contents.parts, function(part) {
|
||||
part.position();
|
||||
part.container.transform(Snap.matrix()
|
||||
.translate(offset, 0));
|
||||
offset += thing.content.getBBox().width;
|
||||
offset += part.container.getBBox().width;
|
||||
});
|
||||
|
||||
if (this.anchor_end()) {
|
||||
|
@ -4,28 +4,33 @@ import Base from './base.js';
|
||||
export default _.extend({}, Base, {
|
||||
type: 'regexp',
|
||||
|
||||
render(container) {
|
||||
this.container = container;
|
||||
this.contents = _.map(this.matches(), match => {
|
||||
var content = container.group();
|
||||
match.render(content);
|
||||
return content;
|
||||
render() {
|
||||
var self = this;
|
||||
|
||||
_.each(this.matches(), match => {
|
||||
match.container = self.container.group();
|
||||
match.render();
|
||||
return match.container;
|
||||
});
|
||||
},
|
||||
|
||||
position() {
|
||||
var center,
|
||||
var self = this,
|
||||
center,
|
||||
positions,
|
||||
container = this.container,
|
||||
totalHeight,
|
||||
verticalCenter,
|
||||
includeLines = (this.matches().length > 1);
|
||||
matches = this.matches(),
|
||||
includeLines = (matches.length > 1);
|
||||
|
||||
_.invoke(this.matches(), 'position');
|
||||
_.invoke(matches, 'position');
|
||||
|
||||
positions = _.chain(this.contents)
|
||||
.map(content => {
|
||||
return { box: content.getBBox(), content };
|
||||
positions = _.chain(matches)
|
||||
.map(match => {
|
||||
return {
|
||||
box: match.container.getBBox(),
|
||||
content: match.container
|
||||
};
|
||||
});
|
||||
center = positions.reduce((center, pos) => {
|
||||
return Math.max(center, pos.box.cx);
|
||||
@ -51,7 +56,7 @@ export default _.extend({}, Base, {
|
||||
'M0,{center}H{side}' :
|
||||
'M0,{center}q10,0 10,{d}V{target}q0,{d} 10,{d}H{side}';
|
||||
|
||||
path = container.path(Snap.format(pathStr, {
|
||||
path = self.container.path(Snap.format(pathStr, {
|
||||
center: verticalCenter,
|
||||
target: box.cy - 10 * direction,
|
||||
side: box.x,
|
||||
|
@ -4,16 +4,15 @@ import Base from './base.js';
|
||||
export default _.extend({}, Base, {
|
||||
type: 'root',
|
||||
|
||||
render(container) {
|
||||
this.contents = container.group();
|
||||
render() {
|
||||
this.regexp.container = this.container.group();
|
||||
this.regexp.render();
|
||||
|
||||
this.regexp.render(this.contents);
|
||||
|
||||
this.start = container.circle().attr({
|
||||
this.start = this.container.circle().attr({
|
||||
r: 5,
|
||||
'class': 'anchor'
|
||||
});
|
||||
this.end = container.circle().attr({
|
||||
this.end = this.container.circle().attr({
|
||||
r: 5,
|
||||
'class': 'anchor'
|
||||
});
|
||||
@ -24,7 +23,7 @@ export default _.extend({}, Base, {
|
||||
|
||||
this.regexp.position();
|
||||
|
||||
contentBox = this.contents.getBBox();
|
||||
contentBox = this.regexp.container.getBBox();
|
||||
|
||||
this.start.transform(Snap.matrix()
|
||||
.translate(contentBox.x, contentBox.cy));
|
||||
|
Loading…
Reference in New Issue
Block a user