Optimizing spaceHorizontall and spaceVertically methods

Each method was transforming each item twice, and I found that Snap
appears to generate at least one timer per transform. Reducing it to one
transform per item.
This commit is contained in:
Jeff Avallone 2015-04-14 21:46:14 -04:00
parent d918f956ef
commit 0fdd210741

View File

@ -36,34 +36,32 @@ function normalizeBBox(box) {
// - __items__ - Array of items to be positioned // - __items__ - Array of items to be positioned
// - __options.padding__ - Number of pixels to leave between items // - __options.padding__ - Number of pixels to leave between items
function spaceHorizontally(items, options) { function spaceHorizontally(items, options) {
var verticalCenter = 0; var verticalCenter,
values;
options = _.defaults(options || {}, { options = _.defaults(options || {}, {
padding: 0 padding: 0
}); });
// Set horizontal position of items with padding between them, and calculate values = _.map(items, item => {
// where the axis points should be positioned vertically. return {
_.reduce(items, (offset, item) => { box: normalizeBBox(item.getBBox()),
var box; item
};
});
// Calculate where the axis points should be positioned vertically.
verticalCenter = _.reduce(values, (center, { box }) => {
return Math.max(center, box.ay);
}, 0);
// Position items with padding between them and aligned their axis points.
_.reduce(values, (offset, { item, box }) => {
item.transform(Snap.matrix() item.transform(Snap.matrix()
.translate(offset, 0)); .translate(offset, verticalCenter - box.ay));
box = normalizeBBox(item.getBBox());
verticalCenter = Math.max(verticalCenter, box.ay);
return offset + options.padding + box.width; return offset + options.padding + box.width;
}, 0); }, 0);
// Set vertical position of items to align their axis points.
for (var item of items) {
let box = normalizeBBox(item.getBBox());
item.transform(Snap.matrix()
.add(item.transform().localMatrix)
.translate(0, verticalCenter - box.ay));
}
} }
// Positions a collection of items centered horizontally in a vertical stack. // Positions a collection of items centered horizontally in a vertical stack.
@ -71,33 +69,32 @@ function spaceHorizontally(items, options) {
// - __items__ - Array of items to be positioned // - __items__ - Array of items to be positioned
// - __options.padding__ - Number of pixels to leave between items // - __options.padding__ - Number of pixels to leave between items
function spaceVertically(items, options) { function spaceVertically(items, options) {
var horizontalCenter = 0; var horizontalCenter,
values;
options = _.defaults(options || {}, { options = _.defaults(options || {}, {
padding: 0 padding: 0
}); });
// Set vertical position of items with padding between them, and calculate values = _.map(items, item => {
// where the center of each item should be positioned horizontally. return {
_.reduce(items, (offset, item) => { box: item.getBBox(),
var box; item
};
});
// Calculate where the center of each item should be positioned horizontally.
horizontalCenter = _.reduce(values, (center, { box }) => {
return Math.max(center, box.cx);
}, 0);
// Position items with padding between them and align their centers.
_.reduce(values, (offset, { item, box }) => {
item.transform(Snap.matrix() item.transform(Snap.matrix()
.translate(0, offset)); .translate(horizontalCenter - box.cx, offset));
box = item.getBBox();
horizontalCenter = Math.max(horizontalCenter, box.cx);
return offset + options.padding + box.height; return offset + options.padding + box.height;
}, 0); }, 0);
// Set horizontal position of items to align their centers.
for (var item of items) {
item.transform(Snap.matrix()
.add(item.transform().localMatrix)
.translate(horizontalCenter - item.getBBox().cx, 0));
}
} }
// Creates a Promise that will be resolved after a specified delay. // Creates a Promise that will be resolved after a specified delay.