diff --git a/spec/parser/javascript/node_spec.js b/spec/parser/javascript/node_spec.js index 89c4f7e..ffda9d8 100644 --- a/spec/parser/javascript/node_spec.js +++ b/spec/parser/javascript/node_spec.js @@ -351,64 +351,6 @@ describe('parser/javascript/node.js', function() { }); - describe('#spaceHorizontally', function() { - - it('positions each item', function() { - var svg = Snap(document.createElement('svg')), - items = [ - svg.group(), - svg.group(), - svg.group() - ]; - - spyOn(items[0], 'getBBox').and.returnValue({ ay: 5, width: 10 }); - spyOn(items[1], 'getBBox').and.returnValue({ ay: 15, width: 30 }); - spyOn(items[2], 'getBBox').and.returnValue({ ay: 10, width: 20 }); - spyOn(items[0], 'transform').and.callThrough(); - spyOn(items[1], 'transform').and.callThrough(); - spyOn(items[2], 'transform').and.callThrough(); - - this.node.spaceHorizontally(items, { padding: 5 }); - - expect(items[0].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(0, 10)); - expect(items[1].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(15, 0)); - expect(items[2].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(50, 5)); - }); - - }); - - describe('#spaceVertically', function() { - - it('positions each item', function() { - var svg = Snap(document.createElement('svg')), - items = [ - svg.group(), - svg.group(), - svg.group() - ]; - - spyOn(items[0], 'getBBox').and.returnValue({ cx: 5, height: 10 }); - spyOn(items[1], 'getBBox').and.returnValue({ cx: 15, height: 30 }); - spyOn(items[2], 'getBBox').and.returnValue({ cx: 10, height: 20 }); - spyOn(items[0], 'transform').and.callThrough(); - spyOn(items[1], 'transform').and.callThrough(); - spyOn(items[2], 'transform').and.callThrough(); - - this.node.spaceVertically(items, { padding: 5 }); - - expect(items[0].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(10, 0)); - expect(items[1].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(0, 15)); - expect(items[2].transform).toHaveBeenCalledWith(Snap.matrix() - .translate(5, 50)); - }); - - }); - describe('#renderLabeledBox', function() { beforeEach(function() { diff --git a/spec/util_spec.js b/spec/util_spec.js index ec2e583..dd3f57c 100644 --- a/spec/util_spec.js +++ b/spec/util_spec.js @@ -1,4 +1,4 @@ -import { customEvent, normalizeBBox } from 'src/js/util.js'; +import { customEvent, normalizeBBox, spaceHorizontally, spaceVertically } from 'src/js/util.js'; describe('util.js', function() { @@ -36,4 +36,62 @@ describe('util.js', function() { }); + describe('spaceHorizontally', function() { + + it('positions each item', function() { + var svg = Snap(document.createElement('svg')), + items = [ + svg.group(), + svg.group(), + svg.group() + ]; + + spyOn(items[0], 'getBBox').and.returnValue({ ay: 5, width: 10 }); + spyOn(items[1], 'getBBox').and.returnValue({ ay: 15, width: 30 }); + spyOn(items[2], 'getBBox').and.returnValue({ ay: 10, width: 20 }); + spyOn(items[0], 'transform').and.callThrough(); + spyOn(items[1], 'transform').and.callThrough(); + spyOn(items[2], 'transform').and.callThrough(); + + spaceHorizontally(items, { padding: 5 }); + + expect(items[0].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(0, 10)); + expect(items[1].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(15, 0)); + expect(items[2].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(50, 5)); + }); + + }); + + describe('spaceVertically', function() { + + it('positions each item', function() { + var svg = Snap(document.createElement('svg')), + items = [ + svg.group(), + svg.group(), + svg.group() + ]; + + spyOn(items[0], 'getBBox').and.returnValue({ cx: 5, height: 10 }); + spyOn(items[1], 'getBBox').and.returnValue({ cx: 15, height: 30 }); + spyOn(items[2], 'getBBox').and.returnValue({ cx: 10, height: 20 }); + spyOn(items[0], 'transform').and.callThrough(); + spyOn(items[1], 'transform').and.callThrough(); + spyOn(items[2], 'transform').and.callThrough(); + + spaceVertically(items, { padding: 5 }); + + expect(items[0].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(10, 0)); + expect(items[1].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(0, 15)); + expect(items[2].transform).toHaveBeenCalledWith(Snap.matrix() + .translate(5, 50)); + }); + + }); + }); diff --git a/src/js/parser/javascript/charset.js b/src/js/parser/javascript/charset.js index 5c63e2a..7b3019d 100644 --- a/src/js/parser/javascript/charset.js +++ b/src/js/parser/javascript/charset.js @@ -1,3 +1,4 @@ +import { spaceVertically } from '../../util.js'; import _ from 'lodash'; import Q from 'q'; export default { @@ -25,7 +26,7 @@ export default { return part.render(this.partContainer.group()); })) .then(() => { - this.spaceVertically(this.elements, { + spaceVertically(this.elements, { padding: 5 }); diff --git a/src/js/parser/javascript/charset_range.js b/src/js/parser/javascript/charset_range.js index 60422be..bb08ea6 100644 --- a/src/js/parser/javascript/charset_range.js +++ b/src/js/parser/javascript/charset_range.js @@ -1,3 +1,4 @@ +import { spaceHorizontally } from '../../util.js'; import _ from 'lodash'; import Q from 'q'; @@ -16,7 +17,7 @@ export default { this.first.render(this.container.group()), this.last.render(this.container.group()) ]) - .then(this.spaceHorizontally.bind(this, contents, { + .then(spaceHorizontally.bind(this, contents, { padding: 5 })); }, diff --git a/src/js/parser/javascript/match.js b/src/js/parser/javascript/match.js index 4e0c64b..4a5b681 100644 --- a/src/js/parser/javascript/match.js +++ b/src/js/parser/javascript/match.js @@ -1,4 +1,4 @@ -import { normalizeBBox } from '../../util.js'; +import { normalizeBBox, spaceHorizontally } from '../../util.js'; import _ from 'lodash'; import Q from 'q'; @@ -44,7 +44,7 @@ export default { var prev, next, paths; this.items = items; - this.spaceHorizontally(items, { + spaceHorizontally(items, { padding: 10 }); diff --git a/src/js/parser/javascript/node.js b/src/js/parser/javascript/node.js index 80ce726..802fc15 100644 --- a/src/js/parser/javascript/node.js +++ b/src/js/parser/javascript/node.js @@ -129,61 +129,6 @@ export default class Node { } } - spaceHorizontally(items, options) { - var verticalCenter = 0; - - options = _.defaults(options || {}, { - padding: 0 - }); - - _.reduce(items, (offset, item) => { - var box; - - item.transform(Snap.matrix() - .translate(offset, 0)); - - box = normalizeBBox(item.getBBox()); - verticalCenter = Math.max(verticalCenter, box.ay); - - return offset + options.padding + box.width; - }, 0); - - for (var item of items) { - let box = normalizeBBox(item.getBBox()); - - item.transform(Snap.matrix() - .add(item.transform().localMatrix) - .translate(0, verticalCenter - box.ay)); - } - } - - spaceVertically(items, options) { - var horizontalCenter = 0; - - options = _.defaults(options || {}, { - padding: 0 - }); - - _.reduce(items, (offset, item) => { - var box; - - item.transform(Snap.matrix() - .translate(0, offset)); - - box = item.getBBox(); - - horizontalCenter = Math.max(horizontalCenter, box.cx); - - return offset + options.padding + box.height; - }, 0); - - for (var item of items) { - item.transform(Snap.matrix() - .add(item.transform().localMatrix) - .translate(horizontalCenter - item.getBBox().cx, 0)); - } - } - renderLabeledBox(label, content, options) { var label = this.container.text(0, 0, label) .addClass([this.type, 'label'].join('-')), diff --git a/src/js/parser/javascript/regexp.js b/src/js/parser/javascript/regexp.js index 8facc50..5a6b51f 100644 --- a/src/js/parser/javascript/regexp.js +++ b/src/js/parser/javascript/regexp.js @@ -1,3 +1,4 @@ +import { spaceVertically } from '../../util.js'; import _ from 'lodash'; import Q from 'q'; @@ -19,7 +20,7 @@ export default { var containerBox, paths; - this.spaceVertically(this.matches, { + spaceVertically(this.matches, { padding: 5 }); diff --git a/src/js/util.js b/src/js/util.js index 3572e93..7996264 100644 --- a/src/js/util.js +++ b/src/js/util.js @@ -15,3 +15,58 @@ export function normalizeBBox(box) { ay: box.cy }, box); } + +export function spaceHorizontally(items, options) { + var verticalCenter = 0; + + options = _.defaults(options || {}, { + padding: 0 + }); + + _.reduce(items, (offset, item) => { + var box; + + item.transform(Snap.matrix() + .translate(offset, 0)); + + box = normalizeBBox(item.getBBox()); + verticalCenter = Math.max(verticalCenter, box.ay); + + return offset + options.padding + box.width; + }, 0); + + for (var item of items) { + let box = normalizeBBox(item.getBBox()); + + item.transform(Snap.matrix() + .add(item.transform().localMatrix) + .translate(0, verticalCenter - box.ay)); + } +} + +export function spaceVertically(items, options) { + var horizontalCenter = 0; + + options = _.defaults(options || {}, { + padding: 0 + }); + + _.reduce(items, (offset, item) => { + var box; + + item.transform(Snap.matrix() + .translate(0, offset)); + + box = item.getBBox(); + + horizontalCenter = Math.max(horizontalCenter, box.cx); + + return offset + options.padding + box.height; + }, 0); + + for (var item of items) { + item.transform(Snap.matrix() + .add(item.transform().localMatrix) + .translate(horizontalCenter - item.getBBox().cx, 0)); + } +}