From b216bcc17e667a2fb09bede7be0d1c67e731d767 Mon Sep 17 00:00:00 2001
From: Danial <RedSparr0w@users.noreply.github.com>
Date: Fri, 27 Jul 2018 08:27:32 +1200
Subject: [PATCH] Hide left hand of badge if no label (#1585)

* hide left side if no text

* fix whitespace at start of template

* for-the-badge done

* center text

* add logo support

* update snapshot test

* make first - in static badge optional

* add no label support to non static badges

* Add test for label

* update to not allow use of false/0/null

* fixup
---
 __snapshots__/make-badge.spec.js     |  2 +-
 lib/badge-data.js                    |  2 +-
 lib/badge-data.spec.js               |  3 +++
 server.js                            |  2 +-
 templates/flat-square-template.svg   | 10 ++++++----
 templates/flat-template.svg          | 14 ++++++++------
 templates/for-the-badge-template.svg | 10 ++++++----
 templates/plastic-template.svg       | 14 ++++++++------
 8 files changed, 34 insertions(+), 23 deletions(-)

diff --git a/__snapshots__/make-badge.spec.js b/__snapshots__/make-badge.spec.js
index 49ca8ac4ec..c1c2ac2404 100644
--- a/__snapshots__/make-badge.spec.js
+++ b/__snapshots__/make-badge.spec.js
@@ -1,5 +1,5 @@
 exports['The badge generator SVG should always produce the same SVG (unless we have changed something!) 1'] = `
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="88" height="20"><linearGradient id="b" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="a"><rect width="88" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#a)"><path fill="#555" d="M0 0h45v20H0z"/><path fill="#4c1" d="M45 0h43v20H45z"/><path fill="url(#b)" d="M0 0h88v20H0z"/></g><g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="110"><text x="235" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">cactus</text><text x="235" y="140" transform="scale(.1)" textLength="350">cactus</text><text x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="330">grown</text><text x="655" y="140" transform="scale(.1)" textLength="330">grown</text></g> </svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="88" height="20"><linearGradient id="b" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="a"><rect width="88" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#a)"><path fill="#555" d="M0 0h45v20H0z"/><path fill="#4c1" d="M45 0h43v20H45z"/><path fill="url(#b)" d="M0 0h88v20H0z"/></g><g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="110"> <text x="235" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="350">cactus</text><text x="235" y="140" transform="scale(.1)" textLength="350">cactus</text><text x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="330">grown</text><text x="655" y="140" transform="scale(.1)" textLength="330">grown</text></g> </svg>
 `
 
 exports['The badge generator JSON should always produce the same JSON (unless we have changed something!) 1'] = `
diff --git a/lib/badge-data.js b/lib/badge-data.js
index c31f1c0cc8..7fd8ef5fe2 100644
--- a/lib/badge-data.js
+++ b/lib/badge-data.js
@@ -66,7 +66,7 @@ function setBadgeColor(badgeData, color) {
 }
 
 function makeLabel(defaultLabel, overrides) {
-  return overrides.label || defaultLabel;
+  return '' + (overrides.label === undefined ? defaultLabel || '' : overrides.label);
 }
 
 function makeLogo(defaultNamedLogo, overrides) {
diff --git a/lib/badge-data.spec.js b/lib/badge-data.spec.js
index 7fa0c1291d..518ed7e7c5 100644
--- a/lib/badge-data.spec.js
+++ b/lib/badge-data.spec.js
@@ -42,6 +42,9 @@ describe('Badge data helpers', function() {
   test(makeLabel, () => {
     given('my badge', {}).expect('my badge');
     given('my badge', { label: 'no, my badge' }).expect('no, my badge');
+    given('my badge', { label: false }).expect('false');
+    given('my badge', { label: 0 }).expect('0');
+    given('my badge', { label: '' }).expect('');
   });
 
   test(makeLogo, () => {
diff --git a/server.js b/server.js
index fedf2154fe..73bfe7db0b 100644
--- a/server.js
+++ b/server.js
@@ -7808,7 +7808,7 @@ cache(function(data, match, sendBadge, request) {
 }));
 
 // Any badge.
-camp.route(/^\/(:|badge\/)(([^-]|--)*?)-(([^-]|--)*)-(([^-]|--)+)\.(svg|png|gif|jpg)$/,
+camp.route(/^\/(:|badge\/)(([^-]|--)*?)-?(([^-]|--)*)-(([^-]|--)+)\.(svg|png|gif|jpg)$/,
 function(data, match, end, ask) {
   var subject = escapeFormat(match[2]);
   var status = escapeFormat(match[4]);
diff --git a/templates/flat-square-template.svg b/templates/flat-square-template.svg
index ed25c320b3..9da2a98fa5 100644
--- a/templates/flat-square-template.svg
+++ b/templates/flat-square-template.svg
@@ -1,14 +1,16 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=it.widths[0]+it.widths[1]}}" height="20">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=(it.widths[0] -= it.text[0].length ? 0 : (it.logo ? 8 : 11))+it.widths[1]}}" height="20">
   <g shape-rendering="crispEdges">
-    <rect width="{{=it.widths[0]}}" height="20" fill="{{=it.escapeXml(it.colorA||"#555")}}"/>
+    <rect width="{{=it.widths[0]}}" height="20" fill="{{=it.escapeXml(it.text[0].length ? (it.colorA||"#555") : (it.colorB||"#4c1"))}}"/>
     <rect x="{{=it.widths[0]}}" width="{{=it.widths[1]}}" height="20" fill="{{=it.escapeXml(it.colorB||"#4c1")}}"/>
   </g>
   <g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="110">
     {{?it.logo}}
       <image x="5" y="3" width="{{=it.logoWidth}}" height="14" xlink:href="{{=it.logo}}"/>
     {{?}}
-    <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
-    <text x="{{=(it.widths[0]+it.widths[1]/2-1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
+    {{?it.text[0].length}}
+        <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+    {{?}}
+    <text x="{{=(it.widths[0]+it.widths[1]/2-(it.text[0].length ? 1 : 0 ))*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
   </g>
   {{?(it.links[0] && it.links[0].length)}}
     <a target="_blank" xlink:href="{{=it.links[0]}}">
diff --git a/templates/flat-template.svg b/templates/flat-template.svg
index 164000c97c..1e722f4d2f 100644
--- a/templates/flat-template.svg
+++ b/templates/flat-template.svg
@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=it.widths[0]+it.widths[1]}}" height="20">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=(it.widths[0] -= it.text[0].length ? 0 : (it.logo ? 8 : 11))+it.widths[1]}}" height="20">
   <linearGradient id="smooth" x2="0" y2="100%">
     <stop offset="0" stop-color="#bbb" stop-opacity=".1"/>
     <stop offset="1" stop-opacity=".1"/>
@@ -9,7 +9,7 @@
   </clipPath>
 
   <g clip-path="url(#round)">
-    <rect width="{{=it.widths[0]}}" height="20" fill="{{=it.escapeXml(it.colorA||"#555")}}"/>
+    <rect width="{{=it.widths[0]}}" height="20" fill="{{=it.escapeXml(it.text[0].length ? (it.colorA||"#555") : (it.colorB||"#4c1"))}}"/>
     <rect x="{{=it.widths[0]}}" width="{{=it.widths[1]}}" height="20" fill="{{=it.escapeXml(it.colorB||"#4c1")}}"/>
     <rect width="{{=it.widths[0]+it.widths[1]}}" height="20" fill="url(#smooth)"/>
   </g>
@@ -18,10 +18,12 @@
     {{?it.logo}}
       <image x="5" y="3" width="{{=it.logoWidth}}" height="14" xlink:href="{{=it.logo}}"/>
     {{?}}
-    <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="150" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
-    <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
-    <text x="{{=(it.widths[0]+it.widths[1]/2-1)*10}}" y="150" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
-    <text x="{{=(it.widths[0]+it.widths[1]/2-1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
+    {{?it.text[0].length}}
+        <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="150" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+        <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+    {{?}}
+    <text x="{{=(it.widths[0]+it.widths[1]/2-(it.text[0].length ? 1 : 0 ))*10}}" y="150" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
+    <text x="{{=(it.widths[0]+it.widths[1]/2-(it.text[0].length ? 1 : 0 ))*10}}" y="140" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
   </g>
   
   {{?(it.links[0] && it.links[0].length)}}
diff --git a/templates/for-the-badge-template.svg b/templates/for-the-badge-template.svg
index c9f21754a1..7b8807d115 100644
--- a/templates/for-the-badge-template.svg
+++ b/templates/for-the-badge-template.svg
@@ -1,16 +1,18 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=(it.widths[0]+=(10+(it.text[0].length*1.5)))+(it.widths[1]+=(10+(it.text[1].length*2)))}}" height="28">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=(it.widths[0] -= it.text[0].length ? -(10+(it.text[0].length*1.5)) : (it.logo ? 8 : 11))+(it.widths[1]+=(10+(it.text[1].length*2)))}}" height="28">
   <g shape-rendering="crispEdges">
-    <rect width="{{=it.widths[0]}}" height="28" fill="{{=it.escapeXml(it.colorA||"#555")}}"/>
+    <rect width="{{=it.widths[0]}}" height="28" fill="{{=it.escapeXml(it.text[0].length ? (it.colorA||"#555") : (it.colorB||"#4c1"))}}"/>
     <rect x="{{=it.widths[0]}}" width="{{=it.widths[1]}}" height="28" fill="{{=it.escapeXml(it.colorB||"#4c1")}}"/>
   </g>
   <g fill="#fff" text-anchor="middle" font-family="DejaVu Sans,Verdana,Geneva,sans-serif" font-size="100">
     {{?it.logo}}
       <image x="9" y="7" width="{{=it.logoWidth}}" height="14" xlink:href="{{=it.logo}}"/>
     {{?}}
-    <text x="{{=((it.widths[0]+it.logoWidth+it.logoPadding)/2)*10}}" y="175" transform="scale(0.1)" textLength="{{=(it.widths[0]-(24+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+    {{?it.text[0].length}}
+      <text x="{{=((it.widths[0]+it.logoWidth+it.logoPadding)/2)*10}}" y="175" transform="scale(0.1)" textLength="{{=(it.widths[0]-(24+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+    {{?}}
     <text x="{{=(it.widths[0]+it.widths[1]/2)*10}}" y="175" font-weight="bold" transform="scale(0.1)" textLength="{{=(it.widths[1]-24)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
   </g>
-  {{?(it.links[0] && it.links[0].length)}}
+  {{?(it.text[0].length && it.links[0] && it.links[0].length)}}
     <a target="_blank" xlink:href="{{=it.links[0]}}">
       <rect width="{{=it.widths[0]}}" height="28" fill="rgba(0,0,0,0)"/>
     </a>
diff --git a/templates/plastic-template.svg b/templates/plastic-template.svg
index 365e1850f0..fbeb2487a3 100644
--- a/templates/plastic-template.svg
+++ b/templates/plastic-template.svg
@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=it.widths[0]+it.widths[1]}}" height="18">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="{{=(it.widths[0] -= it.text[0].length ? 0 : (it.logo ? 8 : 11))+it.widths[1]}}" height="18">
   <linearGradient id="smooth" x2="0" y2="100%">
     <stop offset="0"  stop-color="#fff" stop-opacity=".7"/>
     <stop offset=".1" stop-color="#aaa" stop-opacity=".1"/>
@@ -11,7 +11,7 @@
   </clipPath>
 
   <g clip-path="url(#round)">
-    <rect width="{{=it.widths[0]}}" height="18" fill="{{=it.escapeXml(it.colorA||"#555")}}"/>
+    <rect width="{{=it.widths[0]}}" height="18" fill="{{=it.escapeXml(it.text[0].length ? (it.colorA||"#555") : (it.colorB||"#4c1"))}}"/>
     <rect x="{{=it.widths[0]}}" width="{{=it.widths[1]}}" height="18" fill="{{=it.escapeXml(it.colorB||"#4c1")}}"/>
     <rect width="{{=it.widths[0]+it.widths[1]}}" height="18" fill="url(#smooth)"/>
   </g>
@@ -20,10 +20,12 @@
     {{?it.logo}}
       <image x="5" y="3" width="{{=it.logoWidth}}" height="14" xlink:href="{{=it.logo}}"/>
     {{?}}
-    <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
-    <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="130" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
-    <text x="{{=(it.widths[0]+it.widths[1]/2-1)*10}}" y="140" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
-    <text x="{{=(it.widths[0]+it.widths[1]/2-1)*10}}" y="130" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
+    {{?it.text[0].length}}
+        <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="140" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+        <text x="{{=(((it.widths[0]+it.logoWidth+it.logoPadding)/2)+1)*10}}" y="130" transform="scale(0.1)" textLength="{{=(it.widths[0]-(10+it.logoWidth+it.logoPadding))*10}}" lengthAdjust="spacing">{{=it.escapedText[0]}}</text>
+    {{?}}
+    <text x="{{=(it.widths[0]+it.widths[1]/2-(it.text[0].length ? 1 : 0))*10}}" y="140" fill="#010101" fill-opacity=".3" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
+    <text x="{{=(it.widths[0]+it.widths[1]/2-(it.text[0].length ? 1 : 0))*10}}" y="130" transform="scale(0.1)" textLength="{{=(it.widths[1]-10)*10}}" lengthAdjust="spacing">{{=it.escapedText[1]}}</text>
   </g>
 
   {{?(it.links[0] && it.links[0].length)}}