Commit dc0d013f authored by Blaine Murphy's avatar Blaine Murphy

Added easter egg :)

parent e3318904
Pipeline #65084518 passed with stage
in 40 seconds
{%- comment -%}
Site easter egg.
Static:
static/scripts/easteregg.js
static/scripts/rainbow.js
{%- endcomment -%}
<script>
(function() {
var ͼωͽ️ = [
119, 105,
110, 100, 111, 119,
46, 97, 116,
111, /* thanks for */ 98,
40, /* visiting */ 39,
90, 50,
70, /* -b */ 53,
101, 88,
107, 61,
39,41
];
easteregg.init(
eval(String.fromCharCode.apply(null, ͼωͽ️)),
function() {
rainbow.init('body');
}
);
})();
</script>
......@@ -20,4 +20,6 @@
<link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/static/styles/styles.css"/>
<script src="{{ site.baseurl }}/static/scripts/starfield.js"></script>
<script src="{{ site.baseurl }}/static/scripts/easteregg.js"></script>
<script src="{{ site.baseurl }}/static/scripts/rainbow.js"></script>
</head>
......@@ -6,6 +6,7 @@
modules/background.html
modules/header.html
modules/footer.html
modules/easteregg.html
{%- endcomment -%}
......@@ -29,5 +30,6 @@
{% include modules/footer.html %}
</div>
</footer>
{% include modules/easteregg.html %}
</body>
</html>
/**
* Listener that executes a callback when a secret string is typed.
*/
var easteregg = (function() {
/* truncate a buffer by removing leading characters from it */
function truncate(buffer, maxLength) {
if (buffer.length > maxLength) {
var newStart = buffer.length - maxLength;
return buffer.substring(newStart);
}
return buffer;
}
return {
/* attach a keyword listener to the document */
init: function(keyword, callback) {
var buffer = '';
// add listener
document.addEventListener('keypress', function(event) {
event = event || window.event;
var char = String.fromCharCode(event.keyCode);
buffer = truncate(buffer + char, keyword.length);
// remove key listener and activate easter egg
if (buffer == keyword) {
document.removeEventListener('keypress', arguments.callee);
callback();
}
});
}
};
})();
/**
* Stylize elements by applying bright colors that change over time.
*/
var rainbow = (function() {
/* create a generator that emits sequential rainbow colors */
function createColorGenerator(colorCount, startIndex) {
var index = startIndex;
return {
next: function() {
foregroundHue = index / colorCount * 360;
backgroundHue = (foregroundHue + 180) % 360;
index = (index + 1) % colorCount;
return {
background: 'hsl(' + foregroundHue + ', 100%, 50%)',
foreground: 'hsl(' + backgroundHue + ', 100%, 50%)',
filter: 'sepia(100%) saturate(500%) hue-rotate(' + foregroundHue + 'deg)'
}
}
};
}
/* attach a color generator to all painted elements */
function initElements(elements, colorCount) {
for (var i = 0, length = elements.length; i < length; ++i) {
var startIndex = i % colorCount;
elements[i].colorGenerator =
createColorGenerator(colorCount, startIndex);
}
}
/* paint all elements */
function paintElements(elements) {
for (var i = 0, length = elements.length; i < length; ++i) {
paintElement(elements[i]);
}
}
/* apply the next color in the generated sequence to an element */
function paintElement(element) {
var color = element.colorGenerator.next();
if (element.tagName.toLowerCase() == 'img') {
element.style.filter = color.filter;
} else {
element.style.backgroundColor = color.background;
element.style.color = color.foreground;
element.style.borderColor = color.foreground;
}
}
return {
/* initialize a rainbow painter on the selected root element */
init: function(selector, colorsPerSecond, colorCount) {
colorsPerSecond = colorsPerSecond || 8; // colors/s
colorCount = colorCount || 128; // number of colors
// initialize elements
var root = document.querySelector(selector);
var paintableElements = root.getElementsByTagName('*');
initElements(paintableElements, colorCount);
// start coloring
window.setInterval(function() {
paintElements(paintableElements);
}, 1000 / colorsPerSecond);
}
};
})();
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment