From 8dc047510824654cd236357b2eaedd21c06e96d1 Mon Sep 17 00:00:00 2001
From: Christian Hesse <mail@eworm.de>
Date: Fri, 26 May 2023 11:55:08 +0200
Subject: [PATCH] contrib/logo-color: support settings the background

---
 contrib/logo-color.d/script.js | 7 +++++++
 contrib/logo-color.html        | 3 ++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/contrib/logo-color.d/script.js b/contrib/logo-color.d/script.js
index ac89905..82cc204 100644
--- a/contrib/logo-color.d/script.js
+++ b/contrib/logo-color.d/script.js
@@ -1,5 +1,12 @@
+function invertHex(hex) {
+  return (Number("0x1" + hex) ^ 0xffffff).toString(16).substr(1);
+}
+
 function color() {
   var svg = document.querySelector(".logo").getSVGDocument();
   svg.getElementById("dark-1").setAttribute("stop-color", document.getElementById("color1").value);
   svg.getElementById("dark-2").setAttribute("stop-color", document.getElementById("color2").value);
+  var background = document.getElementById("color3").value;
+  svg.getElementById("background").setAttribute("fill", background);
+  svg.getElementById("hexagon").setAttribute("stroke", "#" + invertHex(background.substring(1)));
 }
diff --git a/contrib/logo-color.html b/contrib/logo-color.html
index 2d812d1..17942ce 100644
--- a/contrib/logo-color.html
+++ b/contrib/logo-color.html
@@ -18,7 +18,8 @@ something that differentiates? Color it!</p>
 
 <p>Select the colors here:
 <input id="color1" type="color" value="#222222" onchange="color();">
-<input id="color2" type="color" value="#444444" onchange="color();"></p>
+<input id="color2" type="color" value="#444444" onchange="color();">
+<input id="color3" type="color" value="#ffffff" onchange="color();"></p>
 
 <p>Then right-click, click "<i>Take Screenshot</i>" and finally select the
 logo and download it.</p>