diff --git a/demo.tpl b/demo.tpl index 678ce99..3f108e3 100644 --- a/demo.tpl +++ b/demo.tpl @@ -8,7 +8,7 @@ } .sprite:before { content: ' '; - background-image: url("{{{cssPathSvg}}}"); + background-image: url("{{{cssPathSvg}}}?cachebust={{cachebust}}"); background-repeat: no-repeat; background-size: {{width}}{{units}} {{height}}{{units}}; display: inline-block; diff --git a/index.js b/index.js index d7fe768..006605c 100644 --- a/index.js +++ b/index.js @@ -25,7 +25,8 @@ var defaults = { templateDest: './sprite.scss', units: 'px', // px, em or rem x: 0, // Starting X position - y: 0 // Starting Y position + y: 0, // Starting Y position + templateData: {} }; // Sorting functions from Jake Gordon's bin packing algorithm demo @@ -67,18 +68,19 @@ var spriteSVG = function(options) { var $ = cheerio.load('', { xmlMode: true }), $sprite = $('svg'), // This data will be passed to our template - data = { - cssPathSvg: options.cssPathSvg, - height: 0, - sprites: [], - units: options.units, - width: 0 - }, + data = options.templateData, eventEmitter = new events.EventEmitter(), self, x = options.x, y = options.y; - + + // Copy values from the options into the templateData + data.cssPathSvg = options.cssPathSvg; + data.height = 0; + data.sprites = []; + data.units = options.units; + data.width = 0; + // When a template file is loaded, render it eventEmitter.on("loadedTemplate", renderTemplate); diff --git a/readme.md b/readme.md index 54e1c7d..bc0911a 100644 --- a/readme.md +++ b/readme.md @@ -37,7 +37,10 @@ gulp.task('default', function () { positioning: 'diagonal', templateSrc: 'sass.tpl', templateDest: 'sass/sprite.scss', - units: 'em' + units: 'em', + templateData: { + cachebust: +(new Date()) + } })) .pipe(svgmin()) .pipe(gulp.dest('images/sprite.svg')) @@ -127,6 +130,12 @@ Default: `0` Offset the starting X position on the sprite sheet. +####templateData +Type: `object` +Default: `{}` + +Additional data that can be used in the mustache template file + ##Disclaimer This is my first gulp plugin, so it might be complete rubbish. It's very alpha right now, and as such may not work. If you spot any bugs, or areas for improvement then feel free to go fork yourself and send me a pull request! diff --git a/template.tpl b/template.tpl index 6e3ab3e..d2cd9c3 100644 --- a/template.tpl +++ b/template.tpl @@ -2,7 +2,7 @@ %sprite:before { content: ' '; - background-image: url("{{{cssPathSvg}}}"); + background-image: url("{{{cssPathSvg}}}?cachebust={{cachebust}}"); background-repeat: no-repeat; background-size: {{width}}{{units}} {{height}}{{units}}; display: inline-block; diff --git a/test/gulpfile.js b/test/gulpfile.js index 3628b3c..b011bce 100644 --- a/test/gulpfile.js +++ b/test/gulpfile.js @@ -10,7 +10,10 @@ gulp.task('default', function () { demoDest: './demo.html', padding: 0, positioning: 'packed', - units: 'em' + units: 'em', + templateData: { + cachebust: +(new Date()) + } })) .pipe(svgmin()) .pipe(gulp.dest('test.svg'));