Add alternative logo (retro)

haskell-infra · Dec 5, 2024 · fe5a546 · fe5a546
1 parent b92b5a9
commit fe5a546
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 15 deletions.
diff --git a/site/css/hl.css b/site/css/hl.css
@@ -294,18 +294,18 @@ img {
   max-width: 100%;
   height: auto; }
 
-.alternative-logo {
+.alternative-logo-uwu {
   filter: drop-shadow(0px 0px 1px black); }
 
-.alternative-logo-visible {
+#alternative-logo {
   display: none; }
 
-.alternative-logo .alternative-logo-visible,.alternative-logo-hidden {
+.with-alternative-logo #alternative-logo,.alternative-logo-hidden {
   display: block;
   max-width: 100%;
   height: auto; }
 
-.alternative-logo .alternative-logo-hidden {
+.with-alternative-logo .alternative-logo-hidden {
   display: none; }
 
 .img-rounded {

diff --git a/site/img/haskell-retro.gif b/site/img/haskell-retro.gif
diff --git a/site/index.html b/site/index.html
@@ -13,7 +13,7 @@
             <div class="branding">
                <br class="hidden-xs alternative-logo-hidden">
                <img src="/img/haskell-logo.svg" alt="Haskell" class="img-responsive alternative-logo-hidden">
-               <img src="/img/haskell-uwu.png" alt="Haskell UwU" class="alternative-logo alternative-logo-visible">
+               <img src="" alt="Haskell" id="alternative-logo">
                <h4 class="summary">An advanced, purely functional programming language</h4>
             </div>
          </div>

diff --git a/site/templates/default.html b/site/templates/default.html
@@ -15,16 +15,28 @@
       <script>
          (function () {
             try {
-              const isUwuValue = window.location 
-                && window.location.search
-                && window.location.search.match(/uwu=(true|false)/);
-
-              if (isUwuValue) {
-                const isUwu = isUwuValue[1] === 'true';
-                if (isUwu) {
-                  document.documentElement.classList.add('alternative-logo');
-                  console.log('alternative logo enabled. turn off with ?uwu=false')
-                  console.log('logo credit to @sawaratsuki1004. Slightly tweaked by @Tritlo');
+              const altLogos = {
+                retro: {
+                  src: 'haskell-retro.gif',
+                  credit: 'logo credit to @rhendric and the official Haskell logo designers',
+                },
+                uwu: {
+                  src: 'haskell-uwu.png',
+                  credit: 'logo credit to @sawaratsuki1004. Slightly tweaked by @Tritlo',
+                },
+              };
+              const params = new URLSearchParams(window.location.search);
+              for (const name in altLogos) {
+                const isEnabled = params.get(name);
+                if (isEnabled === 'true') {
+                  document.documentElement.classList.add('with-alternative-logo');
+                  document.addEventListener('DOMContentLoaded', function () {
+                    const img = document.getElementById('alternative-logo');
+                    img.setAttribute('src', '/img/' + altLogos[name].src);
+                    img.classList.add('alternative-logo-' + name);
+                  });
+                  console.log('alternative logo enabled. turn off with ?' + name + '=false')
+                  console.log(altLogos[name].credit);
                 }
               }
             } catch (err) { }