Card suits have color and use larger font size

2 files changed, 9 insertions, 1 deletions

diff --git a/src/js/entropy.js b/src/js/entropy.js
index cd9b375..0b76dcf 100644
--- a/src/js/entropy.js
+++ b/src/js/entropy.js
@@ -93,6 +93,7 @@ window.Entropy = new (function() {
             return {
                 binaryStr: "",
                 cleanStr: "",
+                cleanHtml: "",
                 base: base,
             };
         }
@@ -118,16 +119,23 @@ window.Entropy = new (function() {
         }
         // Supply a 'filtered' entropy string for display purposes
         var entropyClean = base.parts.join("");
+        var entropyHtml = base.parts.join("");
         if (base.asInt == 52) {
             entropyClean = base.parts.join(" ").toUpperCase();
             entropyClean = entropyClean.replace(/C/g, "\u2663");
             entropyClean = entropyClean.replace(/D/g, "\u2666");
             entropyClean = entropyClean.replace(/H/g, "\u2665");
             entropyClean = entropyClean.replace(/S/g, "\u2660");
+            entropyHtml = base.parts.join(" ").toUpperCase();
+            entropyHtml = entropyHtml.replace(/C/g, "<span class='card-suit club'>\u2663</span>");
+            entropyHtml = entropyHtml.replace(/D/g, "<span class='card-suit diamond'>\u2666</span>");
+            entropyHtml = entropyHtml.replace(/H/g, "<span class='card-suit heart'>\u2665</span>");
+            entropyHtml = entropyHtml.replace(/S/g, "<span class='card-suit spade'>\u2660</span>");
         }
         var e = {
             binaryStr: entropyBin,
             cleanStr: entropyClean,
+            cleanHtml: entropyHtml,
             base: base,
         }
         return e;
diff --git a/src/js/index.js b/src/js/index.js
index 1076108..d356eb8 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -819,7 +819,7 @@
         }
         var bitsStr = entropy.binaryStr.length;
         var wordCount = Math.floor(entropy.binaryStr.length / 32) * 3;
-        DOM.entropyFiltered.text(entropy.cleanStr);
+        DOM.entropyFiltered.html(entropy.cleanHtml);
         DOM.entropyType.text(entropy.base.str);
         DOM.entropyStrength.text(strength);
         DOM.entropyEventCount.text(entropy.base.ints.length);