Konami code easter egg for websites

konamicode-easteregg.js

<script>
/*Animate element and change text / html if konami code is entered on a page - can be used as custom HTML in Google Tag Manager. 
Source / idea: https://www.simoahava.com/gtm-tips/add-konami-code-to-your-site/ */  

/* SETUP */  
//message to display on "konami element" after animation. HTML can be used as well - innerHTML will be replaced with whatever gets defined here.
//leave blank for no change (just animation)
var konamiMessage = 'you are awesome! ;)</small>';

//CSS Selector for element to animate and display message (e.g.  "#someId", "div.someclass". info: https://www.w3schools.com/cssref/css_selectors.asp)
var konamiElementSelector = "h1:first-child";

/***********************/
var konamiCode = '38,38,40,40,37,39,37,39,66,65';
var konamiKeyPresses = [];
var checkKonami = function(e) {
  konamiKeyPresses.push(e.keyCode);
  if (konamiKeyPresses.slice(konamiKeyPresses.length-10).join() === konamiCode) {
    runKonami();
  }
};
var runKonami = function() {
  var el = document.querySelector(konamiElementSelector);
  if (el) {
    if (konamiMessage && konamiMessage!=="")
      el.innerHTML = konamiMessage;
    el.className += " konami" ;
  }
};
//wait for konami code to be entered while viewing the current page  
document.addEventListener('keyup', checkKonami);  
</script>

<style>
/*defines animation for konami element */  
.konami{-webkit-animation-name:swirl;animation-name:swirl;-webkit-animation-duration:0.3s;animation-duration:0.3s;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:1;animation-iteration-count:1}
@-webkit-keyframes swirl{ from {-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);
} to { -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}
@keyframes swirl{ from {-webkit-transform:rotate(0deg);-o-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);
} to { -webkit-transform:rotate(360deg);-o-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}
</style>