Simplifying node proxy code
This commit is contained in:
parent
dd6eac2b4e
commit
c5c98ad62f
@ -18,37 +18,33 @@ export default {
|
|||||||
.invoke('addClass', 'anchor');
|
.invoke('addClass', 'anchor');
|
||||||
}
|
}
|
||||||
|
|
||||||
if (start || end || this.parts.length !== 1) {
|
partPromises = _.map(this.parts, part => {
|
||||||
partPromises = _.map(this.parts, part => {
|
return part.render(this.container.group());
|
||||||
return part.render(this.container.group());
|
});
|
||||||
});
|
|
||||||
|
|
||||||
return Q.all(_([start, partPromises, end]).flatten().compact().value())
|
return Q.all(_([start, partPromises, end]).flatten().compact().value())
|
||||||
.then(items => {
|
.then(items => {
|
||||||
var prev, next, paths;
|
var prev, next, paths;
|
||||||
|
|
||||||
this.items = items;
|
this.items = items;
|
||||||
this.spaceHorizontally(items, {
|
this.spaceHorizontally(items, {
|
||||||
padding: 10
|
padding: 10
|
||||||
});
|
|
||||||
|
|
||||||
prev = this.normalizeBBox(_.first(items).getBBox());
|
|
||||||
paths = _.map(items.slice(1), item => {
|
|
||||||
var path;
|
|
||||||
|
|
||||||
next = this.normalizeBBox(item.getBBox());
|
|
||||||
path = `M${prev.ax2},${prev.ay}H${next.ax}`;
|
|
||||||
prev = next;
|
|
||||||
|
|
||||||
return path;
|
|
||||||
});
|
|
||||||
|
|
||||||
this.container.prepend(
|
|
||||||
this.container.path(paths.join('')));
|
|
||||||
});
|
});
|
||||||
} else {
|
|
||||||
return this.proxy(this.parts[0]);
|
prev = this.normalizeBBox(_.first(items).getBBox());
|
||||||
}
|
paths = _.map(items.slice(1), item => {
|
||||||
|
var path;
|
||||||
|
|
||||||
|
next = this.normalizeBBox(item.getBBox());
|
||||||
|
path = `M${prev.ax2},${prev.ay}H${next.ax}`;
|
||||||
|
prev = next;
|
||||||
|
|
||||||
|
return path;
|
||||||
|
});
|
||||||
|
|
||||||
|
this.container.prepend(
|
||||||
|
this.container.path(paths.join('')));
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
_getAnchor() {
|
_getAnchor() {
|
||||||
@ -79,5 +75,9 @@ export default {
|
|||||||
|
|
||||||
this.anchorStart = this.properties.anchor_start.textValue !== '';
|
this.anchorStart = this.properties.anchor_start.textValue !== '';
|
||||||
this.anchorEnd = this.properties.anchor_end.textValue !== '';
|
this.anchorEnd = this.properties.anchor_end.textValue !== '';
|
||||||
|
|
||||||
|
if (!this.anchorStart && !this.anchorEnd && this.parts.length === 1) {
|
||||||
|
this.proxy = this.parts[0];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -4,59 +4,55 @@ export default {
|
|||||||
type: 'match-fragment',
|
type: 'match-fragment',
|
||||||
|
|
||||||
_render() {
|
_render() {
|
||||||
if (!this.repeat) {
|
return this.content.render(this.container.group())
|
||||||
return this.proxy(this.content);
|
.then(() => {
|
||||||
} else {
|
var box, paths = [];
|
||||||
return this.content.render(this.container.group())
|
|
||||||
.then(() => {
|
|
||||||
var box, paths = [];
|
|
||||||
|
|
||||||
this.content.transform(this.repeat.contentPosition);
|
this.content.transform(this.repeat.contentPosition);
|
||||||
|
|
||||||
box = this.content.getBBox();
|
box = this.content.getBBox();
|
||||||
|
|
||||||
if (this.repeat.hasSkip) {
|
if (this.repeat.hasSkip) {
|
||||||
let vert = Math.max(0, box.ay - box.y - 10),
|
let vert = Math.max(0, box.ay - box.y - 10),
|
||||||
horiz = box.width - 10;
|
horiz = box.width - 10;
|
||||||
|
|
||||||
paths.push(`M0,${box.ay}q10,0 10,-10v${-vert}q0,-10 10,-10h${horiz}q10,0 10,10v${vert}q0,10 10,10`);
|
paths.push(`M0,${box.ay}q10,0 10,-10v${-vert}q0,-10 10,-10h${horiz}q10,0 10,10v${vert}q0,10 10,10`);
|
||||||
|
|
||||||
if (!this.repeat.greedy) {
|
if (!this.repeat.greedy) {
|
||||||
paths.push(`M10,${box.ay - 15}l5,5m-5,-5l-5,5`);
|
paths.push(`M10,${box.ay - 15}l5,5m-5,-5l-5,5`);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (this.repeat.hasLoop) {
|
if (this.repeat.hasLoop) {
|
||||||
let vert = box.y2 - box.ay - 10;
|
let vert = box.y2 - box.ay - 10;
|
||||||
|
|
||||||
paths.push(`M${box.x},${box.ay}q-10,0 -10,10v${vert}q0,10 10,10h${box.width}q10,0 10,-10v${-vert}q0,-10 -10,-10`);
|
paths.push(`M${box.x},${box.ay}q-10,0 -10,10v${vert}q0,10 10,10h${box.width}q10,0 10,-10v${-vert}q0,-10 -10,-10`);
|
||||||
|
|
||||||
if (this.repeat.greedy) {
|
if (this.repeat.greedy) {
|
||||||
paths.push(`M${box.x2 + 10},${box.ay + 15}l5,-5m-5,5l-5,-5`);
|
paths.push(`M${box.x2 + 10},${box.ay + 15}l5,-5m-5,5l-5,-5`);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (paths.length) {
|
if (paths.length) {
|
||||||
this.container.prepend(
|
this.container.prepend(
|
||||||
this.container.path(paths.join('')));
|
this.container.path(paths.join('')));
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.then(() => {
|
.then(() => {
|
||||||
var labelStr = this.repeat.label,
|
var labelStr = this.repeat.label,
|
||||||
label,
|
label,
|
||||||
labelBox,
|
labelBox,
|
||||||
labelShift = (this.repeat.hasSkip ? 5 : 0),
|
labelShift = (this.repeat.hasSkip ? 5 : 0),
|
||||||
box = this.getBBox();
|
box = this.getBBox();
|
||||||
|
|
||||||
if (labelStr) {
|
if (labelStr) {
|
||||||
label = this.container.text(0, 0, labelStr)
|
label = this.container.text(0, 0, labelStr)
|
||||||
.addClass('repeat-label');
|
.addClass('repeat-label');
|
||||||
labelBox = label.getBBox();
|
labelBox = label.getBBox();
|
||||||
label.transform(Snap.matrix()
|
label.transform(Snap.matrix()
|
||||||
.translate(box.x2 - labelBox.width - labelShift, box.y2 + labelBox.height));
|
.translate(box.x2 - labelBox.width - labelShift, box.y2 + labelBox.height));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
_getAnchor() {
|
_getAnchor() {
|
||||||
@ -76,6 +72,8 @@ export default {
|
|||||||
|
|
||||||
if (this.properties.repeat.textValue !== '') {
|
if (this.properties.repeat.textValue !== '') {
|
||||||
this.repeat = this.properties.repeat;
|
this.repeat = this.properties.repeat;
|
||||||
|
} else {
|
||||||
|
this.proxy = this.content;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -26,8 +26,8 @@ export default class Node {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getAnchor() {
|
getAnchor() {
|
||||||
if (this._proxy) {
|
if (this.proxy) {
|
||||||
return this._proxy.getAnchor();
|
return this.proxy.getAnchor();
|
||||||
} else {
|
} else {
|
||||||
return this._getAnchor();
|
return this._getAnchor();
|
||||||
}
|
}
|
||||||
@ -119,16 +119,15 @@ export default class Node {
|
|||||||
this.setContainer(container);
|
this.setContainer(container);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.startRender();
|
if (this.proxy) {
|
||||||
return this._render()
|
return this.proxy.render(this.container)
|
||||||
.then(this.doneRender.bind(this))
|
.then(_.constant(this));
|
||||||
.then(_.constant(this));
|
} else {
|
||||||
}
|
this.startRender();
|
||||||
|
return this._render()
|
||||||
proxy(node) {
|
.then(this.doneRender.bind(this))
|
||||||
this.anchorDebug = false;
|
.then(_.constant(this));
|
||||||
this._proxy = node;
|
}
|
||||||
return node.render(this.container);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
spaceHorizontally(items, options) {
|
spaceHorizontally(items, options) {
|
||||||
|
@ -7,43 +7,39 @@ export default {
|
|||||||
_render() {
|
_render() {
|
||||||
var matchContainer;
|
var matchContainer;
|
||||||
|
|
||||||
if (this.matches.length === 1) {
|
matchContainer = this.container.group()
|
||||||
return this.proxy(this.matches[0]);
|
.addClass('regexp-matches')
|
||||||
} else {
|
.transform(Snap.matrix()
|
||||||
matchContainer = this.container.group()
|
.translate(20, 0));
|
||||||
.addClass('regexp-matches')
|
|
||||||
.transform(Snap.matrix()
|
|
||||||
.translate(20, 0));
|
|
||||||
|
|
||||||
return Q.all(_.map(this.matches, match => {
|
return Q.all(_.map(this.matches, match => {
|
||||||
return match.render(matchContainer.group());
|
return match.render(matchContainer.group());
|
||||||
}))
|
}))
|
||||||
.then(() => {
|
.then(() => {
|
||||||
var containerBox,
|
var containerBox,
|
||||||
paths;
|
paths;
|
||||||
|
|
||||||
this.spaceVertically(this.matches, {
|
this.spaceVertically(this.matches, {
|
||||||
padding: 5
|
padding: 5
|
||||||
});
|
|
||||||
|
|
||||||
containerBox = this.getBBox();
|
|
||||||
paths = _.map(this.matches, this.makeConnectorLine.bind(this, containerBox));
|
|
||||||
|
|
||||||
paths.push(this.makeSideLine(containerBox, _.first(this.matches)));
|
|
||||||
paths.push(this.makeSideLine(containerBox, _.last(this.matches)));
|
|
||||||
|
|
||||||
this.container.prepend(
|
|
||||||
this.container.path(paths.join('')));
|
|
||||||
|
|
||||||
matchContainer.prepend(
|
|
||||||
matchContainer.path(_.map(this.matches, match => {
|
|
||||||
var box = match.getBBox(),
|
|
||||||
container = matchContainer.getBBox();
|
|
||||||
|
|
||||||
return `M0,${box.ay}h${box.ax}M${box.ax2},${box.ay}H${container.width}`;
|
|
||||||
}).join('')));
|
|
||||||
});
|
});
|
||||||
}
|
|
||||||
|
containerBox = this.getBBox();
|
||||||
|
paths = _.map(this.matches, this.makeConnectorLine.bind(this, containerBox));
|
||||||
|
|
||||||
|
paths.push(this.makeSideLine(containerBox, _.first(this.matches)));
|
||||||
|
paths.push(this.makeSideLine(containerBox, _.last(this.matches)));
|
||||||
|
|
||||||
|
this.container.prepend(
|
||||||
|
this.container.path(paths.join('')));
|
||||||
|
|
||||||
|
matchContainer.prepend(
|
||||||
|
matchContainer.path(_.map(this.matches, match => {
|
||||||
|
var box = match.getBBox(),
|
||||||
|
container = matchContainer.getBBox();
|
||||||
|
|
||||||
|
return `M0,${box.ay}h${box.ax}M${box.ax2},${box.ay}H${container.width}`;
|
||||||
|
}).join('')));
|
||||||
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
makeSideLine(containerBox, match) {
|
makeSideLine(containerBox, match) {
|
||||||
@ -91,5 +87,9 @@ export default {
|
|||||||
.concat(_.map(this.properties.alternates.elements, element => {
|
.concat(_.map(this.properties.alternates.elements, element => {
|
||||||
return element.properties.match;
|
return element.properties.match;
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
if (this.matches.length === 1) {
|
||||||
|
return this.proxy = this.matches[0];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -12,14 +12,10 @@ export default {
|
|||||||
},
|
},
|
||||||
|
|
||||||
_render() {
|
_render() {
|
||||||
if (this.label) {
|
return this.regexp.render(this.container.group())
|
||||||
return this.regexp.render(this.container.group())
|
.then(this.renderLabeledBox.bind(this, this.label, this.regexp, {
|
||||||
.then(this.renderLabeledBox.bind(this, this.label, this.regexp, {
|
padding: 10
|
||||||
padding: 10
|
}));
|
||||||
}));
|
|
||||||
} else {
|
|
||||||
return this.proxy(this.regexp);
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
resetCounter() {
|
resetCounter() {
|
||||||
@ -45,5 +41,9 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this.regexp = this.properties.regexp;
|
this.regexp = this.properties.regexp;
|
||||||
|
|
||||||
|
if (!this.label) {
|
||||||
|
this.proxy = this.regexp;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user