add templates support and new flat style option

badge.js

@@ -1,6 +1,7 @@
 var fs = require('fs');
 var path = require('path');
 var SVGO = require('svgo');
+var dot = require('dot');
 
 // Initialize what will be used for automatic text measurement.
 var Canvas = require('canvas');
@@ -14,18 +15,38 @@ try {
 } catch(e) {}
 canvasContext.font = '11px Verdana, "DejaVu Sans"';
 
-// Template crafting action below.
-var dot = require('dot');
-var colorscheme = require(path.join(__dirname, 'colorscheme.json'));
-var template = fs.readFileSync(path.join(__dirname, 'template.svg'));
-var imageTemplate = dot.template(''+template);
+// cache templates
+var templates = {}
+var templateFiles = fs.readdirSync('templates')
+templateFiles.forEach(function(file) {
+  templates[file] = fs.readFileSync(path.join('templates', file)).toString()
+})
+
+var colorscheme = require('./colorscheme.json');
+
+function makeTemplate(colorscheme, template) {
+  // Template crafting action below.
+  var template = templates[(template || 'default') + '-template.svg'];
+  var imageTemplate = dot.template(''+template);
+  return imageTemplate;
+}
+
+var defaultTemplate = makeTemplate();
 
 function optimize(string, callback) {
   var svgo = new SVGO();
   svgo.optimize(string, callback);
 }
 
-function makeImage(data, cb) {
+function makeImage(data, options, cb) {
+  if (typeof options === 'function') {
+    cb = options
+    options = {}
+  }
+  var template = defaultTemplate;
+  if (options.colorscheme || options.template) {
+    template = makeTemplate(options.colorscheme, options.template);
+  }
   if (data.colorscheme) {
     data.colorA = colorscheme[data.colorscheme].colorA;
     data.colorB = colorscheme[data.colorscheme].colorB;
@@ -34,7 +55,7 @@ function makeImage(data, cb) {
     (canvasContext.measureText(data.text[0]).width|0) + 10,
     (canvasContext.measureText(data.text[1]).width|0) + 10,
   ];
-  var result = imageTemplate(data);
+  var result = template(data);
   // Run the SVG through SVGO.
   optimize(result, function(object) { cb(object.data); });
 }

gh-badge.js

@@ -4,8 +4,8 @@ var badge = require(path.join(__dirname, 'badge.js'));
 var svg2img = require(path.join(__dirname, 'svg-to-img.js'));
 var colorscheme = require(path.join(__dirname, 'colorscheme.json'));
 if (process.argv.length < 4) {
-  console.log('Usage: badge subject status [:colorscheme] [.output]');
-  console.log('Or:    badge subject status right-color [left-color] [.output]');
+  console.log('Usage: badge subject status [:colorscheme] [.output] [@style]');
+  console.log('Or:    badge subject status right-color [left-color] [.output] [@style]');
   console.log();
   console.log('  colorscheme: one of '
       + Object.keys(colorscheme).join(', ') + '.');
@@ -16,17 +16,24 @@ if (process.argv.length < 4) {
   console.log('  output:');
   console.log('    svg, png, jpg, or gif');
   console.log();
-  console.log('Eg: badge cactus grown :green');
+  console.log('Eg: badge cactus grown :green @flat');
   console.log();
   process.exit();
 }
 
 // Find a format specifier.
 var format = 'svg';
+var style = '';
 for (var i = 4; i < process.argv.length; i++) {
   if (process.argv[i][0] === '.') {
     format = process.argv[i].slice(1);
     process.argv.splice(i, 1);
+    continue;
+  }
+  if (process.argv[i][0] === '@') {
+    style = process.argv[i].slice(1);
+    process.argv.splice(i, 1);
+    continue;
   }
 }
 
@@ -35,6 +42,12 @@ var status = process.argv[3];
 var color = process.argv[4] || ':green';
 var colorA = process.argv[5];
 
+var badgeOpts = {}
+
+if (style) {
+  badgeOpts.template = style;
+}
+
 var badgeData = {text: [subject, status]};
 
 if (color[0] === ':') {
@@ -50,7 +63,7 @@ if (color[0] === ':') {
   if (colorA) { badgeData.colorA = colorA; }
 }
 
-badge(badgeData, function produceOutput(svg) {
+badge(badgeData, badgeOpts, function produceOutput(svg) {
   if (format === 'svg') {
     console.log(svg);
   } else if (/png|jpg|gif/.test(format)) {

server.js

@@ -5,10 +5,13 @@ var camp = require('camp').start({
 var https = require('https');
 var request = require('request');
 var fs = require('fs');
+var url = require('url');
 var badge = require('./badge.js');
 var svg2img = require('./svg-to-img.js');
 var serverStartTime = new Date((new Date()).toGMTString());
 
+var validTemplates = ['default', 'flat'];
+
 // Analytics
 
 var redis;
@@ -96,6 +99,16 @@ var cacheFromIndex = Object.create(null);
 
 function cache(f) {
   return function getRequest(data, match, end, ask) {
+    // parse querystring for specifying template
+    var reqURL = url.parse(ask.req.url, true);
+    var badgeOpts = {
+      template: 'default'
+    };
+    var style = reqURL.query.style || 'default';
+    if (style && validTemplates.indexOf(style) > -1) {
+      badgeOpts.template = style;
+    };
+
     // Cache management - no cache, so it won't be cached by GitHub's CDN.
     ask.res.setHeader('Cache-Control', 'no-cache, no-store, must-revalidate');
     incrMonthlyAnalytics(analytics.vendorMonthly);
@@ -104,7 +117,7 @@ function cache(f) {
     // Should we return the data right away?
     var cached = cacheFromIndex[cacheIndex];
     if (cached != null) {
-      badge(cached.badgeData, makeSend(cached.format, ask.res, end));
+      badge(cached.badgeData, badgeOpts, makeSend(cached.format, ask.res, end));
       return;
     }
 
@@ -114,7 +127,7 @@ function cache(f) {
       var badgeData = getBadgeData('vendor', data);
       badgeData.text[1] = 'unresponsive';
       serverUnresponsive = true;
-      badge(badgeData, makeSend('svg', ask.res, end));
+      badge(badgeData, badgeOpts, makeSend('svg', ask.res, end));
     }, 25000);
 
     f(data, match, function sendBadge(format, badgeData) {

try.html

@@ -190,6 +190,22 @@ <h3> Version </h3>
   </tr>
 </tbody></table>
 
+<h3> Flat Style </h3>
+<table><tbody>
+  <td><img src='/travis/joyent/node.svg?style=flat' alt=''/></td>
+  <td><code>http://img.shields.io/travis/joyent/node.svg?style=flat</code></td>
+  </tr>
+  <td><img src='/travis/joyent/node/v0.6.svg?style=flat' alt=''/></td>
+  <td><code>http://img.shields.io/travis/joyent/node/v0.6.svg?style=flat</code></td>
+  </tr>
+  <td><img src='/gittip/JSFiddle.svg?style=flat' alt=''/></td>
+  <td><code>http://img.shields.io/gittip/JSFiddle.svg?style=flat</code></td>
+  </tr>
+  <td><img src='/coveralls/jekyll/jekyll.svg?style=flat' alt=''/></td>
+  <td><code>http://img.shields.io/coveralls/jekyll/jekyll.svg?style=flat</code></td>
+  </tr>
+</tbody></table>
+
 <h2> Like This? </h2>
 
 <p>
@@ -274,6 +290,9 @@ <h2> Contributors </h2>
 <a class='photo' href='https://github.com/qubyte'>
   <img alt='qubyte' src='https://gravatar.com/avatar/2b8729c02bc2fb886b32ed23cb7b0a31'>
 </a>
+<a class='photo' href='https://github.com/maxogden'>
+  <img alt='maxogden' src='https://avatars1.githubusercontent.com/u/39759?s=80'>
+</a>
 
 <p><small>:wq</small></p>
 <script>