Custom Template not working

Hello,

I’m trying to create a custom template that is left to right, but 2 rows of images tall.

My gulpfile.js:

var gulp = require('gulp');
var spritesmith = require('gulp.spritesmith');
var layout = require('layout');

gulp.task('add-custom-layout', function() {
    spritesmith.layout = layout;
    spritesmith.layout.addAlgorithm('2-row', require('./sprites/algorithms/2-row.js'));
});

gulp.task('sprite-sleeve', function() {
    var spriteData = gulp.src('./sprites/src/sleeve/*.png').pipe(spritesmith({
        imgName: './sprites/generated/sleeve.png',
        cssName: './src/css/filter-panel/sleeve/sleeve-sprite.scss',
        algorithm: '2-row',
        cssSpritesheetName: 'sleeve',
        cssVarMap: function (sprite) {
            sprite.name = 'vs-icon-' + sprite.name;
        },
        cssTemplate: './sprites/icon.scss.handlebars'
    }));
    return spriteData.pipe(gulp.dest('./'));
});

gulp.task('sprite', ['add-custom-layout', 'sprite-sleeve']);
gulp.task('default', ['sprite']);

My custom algorithm 2-row.js is literally just a copy and paste of the left-right algorithm.

The error is on https://github.com/twolfson/layout/blob/master/lib/layout.js line 21. Essentially my algorithm cannot be found.

I tried to debug and find the root cause. It seems like even though i add the algorithm to the layout module imported into my package, that layout doesn’t ever get put through to the actual spritesmith code https://github.com/Ensighten/spritesmith/blob/master/src/smith.js::processImages method.

Any ideas on the issue? Any errors in my code? Are there any examples of working custom templates? The documentation was a bit light on this area.

Thank you for your time and really loving spritesmith on the whole!

[salohcinzero]

I tried that out just now and that doesn’t work very well for my specific use case. Say i have 10 icons. I would want a layout like:

x x x x x
x x x x x

No empty/wasted space.

binary-tree outputs something like:

x x x x
x x x o
x x x o

Which has 2 empty spots. Does that make sense?

[twolfson]

Ah, k. I guess it isn’t a perfect algorithm (hard problem to solve) =/