Converting uses of Snap.format to use template literals
This commit is contained in:
parent
db62743d54
commit
d22ab35b68
@ -78,7 +78,7 @@ export default {
|
||||
.attr({
|
||||
style: 'stroke:#000;stroke-dasharray:2,2;;'
|
||||
});
|
||||
anchorLine = this.container.path(Snap.format('M{ax},{ay}H{ax2}', box))
|
||||
anchorLine = this.container.path(`M${box.ax},${box.ay}H${box.ax2}`)
|
||||
.attr({
|
||||
style: 'stroke:#f00;stroke-dasharray:2,2;',
|
||||
'data-type': this.type,
|
||||
|
@ -39,10 +39,7 @@ export default _.extend({}, Base, {
|
||||
var path;
|
||||
|
||||
next = this.normalizeBBox(item.getBBox());
|
||||
path = Snap.format('M{prev.ax2},{prev.ay}H{next.ax}', {
|
||||
prev,
|
||||
next
|
||||
});
|
||||
path = `M${prev.ax2},${prev.ay}H${next.ax}`;
|
||||
prev = next;
|
||||
|
||||
return path;
|
||||
|
@ -17,29 +17,23 @@ export default _.extend({}, Base, {
|
||||
box = this._content.getBBox();
|
||||
|
||||
if (this._repeat.hasSkip()) {
|
||||
paths.push(Snap.format('M0,{box.ay}q10,0 10,-10v-{vert}q0,-10 10,-10h{horiz}q10,0 10,10v{vert}q0,10 10,10', {
|
||||
box,
|
||||
vert: Math.max(0, box.ay - box.y - 10),
|
||||
horiz: box.width - 10
|
||||
}));
|
||||
let vert = Math.max(0, box.ay - box.y - 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`);
|
||||
|
||||
if (!this._repeat.greedy()) {
|
||||
paths.push(Snap.format('M0,{box.ay}m10,-15l5,5m-5,-5l-5,5', {
|
||||
box
|
||||
}));
|
||||
paths.push(`M10,${box.ay - 15}l5,5m-5,-5l-5,5`);
|
||||
}
|
||||
}
|
||||
|
||||
if (this._repeat.hasLoop()) {
|
||||
paths.push(Snap.format('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', {
|
||||
box,
|
||||
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`);
|
||||
|
||||
if (this._repeat.greedy()) {
|
||||
paths.push(Snap.format('M{box.x2},{box.ay}m10,15l5,-5m-5,5l-5,-5', {
|
||||
box
|
||||
}));
|
||||
paths.push(`M${box.x2 + 10},${box.ay + 15}l5,-5m-5,5l-5,-5`);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -39,10 +39,10 @@ export default _.extend({}, Base, {
|
||||
|
||||
matchContainer.prepend(
|
||||
matchContainer.path(_.map(matches, match => {
|
||||
return Snap.format('M0,{box.ay}h{box.ax}M{box.ax2},{box.ay}H{container.width}', {
|
||||
box: match.getBBox(),
|
||||
container: matchContainer.getBBox()
|
||||
});
|
||||
var box = match.getBBox(),
|
||||
container = matchContainer.getBBox();
|
||||
|
||||
return `M0,${box.ay}h${box.ax}M${box.ax2},${box.ay}H${container.width}`;
|
||||
}).join('')));
|
||||
}).bind(this));
|
||||
}
|
||||
@ -54,14 +54,13 @@ export default _.extend({}, Base, {
|
||||
distance = Math.abs(box.ay - containerBox.cy);
|
||||
|
||||
if (distance >= 15) {
|
||||
return Snap.format([
|
||||
'M0,{box.cy}q10,0 10,{shift}V{edge}',
|
||||
'M{box.width},{box.cy}m40,0q-10,0 -10,{shift}V{edge}'
|
||||
].join(''), {
|
||||
box: containerBox,
|
||||
edge: box.ay - 10 * direction,
|
||||
shift: 10 * direction
|
||||
});
|
||||
let edge = box.ay - 10 * direction,
|
||||
shift = 10 * direction;
|
||||
|
||||
return [
|
||||
`M0,${containerBox.cy}q10,0 10,${shift}V${edge}`,
|
||||
`M${containerBox.width + 40},${containerBox.cy}q-10,0 -10,${shift}V${edge}`
|
||||
].join('');
|
||||
} else {
|
||||
return '';
|
||||
}
|
||||
@ -70,31 +69,23 @@ export default _.extend({}, Base, {
|
||||
makeConnectorLine(containerBox, match) {
|
||||
var box = match.getBBox(),
|
||||
direction = box.ay > containerBox.cy ? 1 : -1,
|
||||
distance = Math.abs(box.ay - containerBox.cy),
|
||||
pathStr;
|
||||
distance = Math.abs(box.ay - containerBox.cy);
|
||||
|
||||
if (distance >= 15) {
|
||||
pathStr = [
|
||||
'M10,{box.ay}m0,{shift}q0,{curve} 10,{curve}',
|
||||
'M{containerBox.width},{box.ay}m30,{shift}q0,{curve} -10,{curve}'
|
||||
let curve = 10 * direction;
|
||||
|
||||
return [
|
||||
`M10,${box.ay - curve}q0,${curve} 10,${curve}`,
|
||||
`M${containerBox.width + 30},${box.ay - curve}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}'
|
||||
let anchor = box.ay - containerBox.cy;
|
||||
|
||||
return [
|
||||
`M0,${containerBox.cy}c10,0 10,${anchor} 20,${anchor}`,
|
||||
`M${containerBox.width + 40},${containerBox.cy}c-10,0 -10,${anchor} -20,${anchor}`
|
||||
].join('');
|
||||
}
|
||||
|
||||
return Snap.format(pathStr, {
|
||||
containerBox,
|
||||
box,
|
||||
shift: -10 * direction,
|
||||
curve: 10 * direction,
|
||||
anchor: {
|
||||
x: box.x + 20,
|
||||
y: box.ay - containerBox.cy
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
matches() {
|
||||
|
@ -14,22 +14,20 @@ export default _.extend({}, Base, {
|
||||
|
||||
return this.regexp.render(this.container.group())
|
||||
.then((() => {
|
||||
var contentBox;
|
||||
var box;
|
||||
|
||||
this.regexp.transform(Snap.matrix()
|
||||
.translate(10, 0));
|
||||
|
||||
contentBox = this.regexp.getBBox();
|
||||
box = this.regexp.getBBox();
|
||||
|
||||
this.start.transform(Snap.matrix()
|
||||
.translate(0, contentBox.ay));
|
||||
.translate(0, box.ay));
|
||||
this.end.transform(Snap.matrix()
|
||||
.translate(contentBox.x2 + 10, contentBox.ay));
|
||||
.translate(box.x2 + 10, box.ay));
|
||||
|
||||
this.container.prepend(
|
||||
this.container.path(Snap.format('M{box.ax},{box.ay}H0M{box.ax2},{box.ay}H{box.x2}h10', {
|
||||
box: contentBox
|
||||
})));
|
||||
this.container.path(`M${box.ax},${box.ay}H0M${box.ax2},${box.ay}H${box.x2 + 10}`));
|
||||
}).bind(this));
|
||||
},
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user