@uiwwsw/easter-egg
v0.2.0
Published
[](https://www.npmjs.com/package/@uiwwsw/easter-egg) [](https://github.com/uiwwsw/easter-egg/actions
Maintainers
Readme
Easter Egg Library
A simple JavaScript/TypeScript library to add an easter egg (Konami Code) to your web applications.
Features
- Detects custom keyboard and pointer event sequences (default: Konami Code).
- Executes a callback function upon successful sequence entry.
- Basic debugger detection and code obfuscation for fun.
Installation
To use this library in your project, you can install it via Bun:
bun add @uiwwsw/easter-egg
# Or if you're using npm/yarn
# npm install @uiwwsw/easter-egg
# yarn add @uiwwsw/easter-eggUsage
In your JavaScript/TypeScript project
import { createEasterEgg } from '@uiwwsw/easter-egg';
createEasterEgg(
document.body, // The element to listen for keyboard/pointer events
() => {
alert('Easter Egg Triggered!');
// Your custom easter egg logic here
},
[
'keyboard:ArrowUp',
'keyboard:ArrowUp',
'keyboard:ArrowDown',
'keyboard:ArrowDown',
'keyboard:ArrowLeft',
'keyboard:ArrowRight',
'keyboard:ArrowLeft',
'keyboard:ArrowRight',
'keyboard:b',
'keyboard:a',
] // Konami Code
);Each entry in the array follows the format <type>:<value>:
keyboard:<event.key>listens for keyboard events fired onkeydown.pointer:<event.type>listens for pointer/mouse interactions such asclick,pointerdown, ordblclick.
Need mouse interactions too? Mix and match both types:
createEasterEgg(document.body, () => {
console.log('Keyboard and pointer combo unlocked!');
}, [
'keyboard:Shift',
'pointer:click',
'pointer:click',
'keyboard:Enter',
]);In your HTML (for demo/direct use)
As demonstrated in index.html:
<script type="module">
import { createEasterEgg } from './dist/index.js'; // Adjust path if necessary
createEasterEgg(
document.body,
() => {
alert('Easter Egg Triggered!');
},
[
'keyboard:ArrowUp',
'keyboard:ArrowUp',
'keyboard:ArrowDown',
'keyboard:ArrowDown',
'keyboard:ArrowLeft',
'keyboard:ArrowRight',
'keyboard:ArrowLeft',
'keyboard:ArrowRight',
'keyboard:b',
'keyboard:a'
]
);
</script>Development
Running the Demo
To run the demo page (index.html), you can use a simple static file server. If you have Bun installed, you can use bun --watch server.ts (as defined in package.json's dev script) or any other static server.
bun run devThen open http://localhost:3000 in your browser.
Building the Library
To build the distributable files (.js and .d.ts) for the library:
bun run buildThis will output the compiled files into the dist/ directory.
License
This project is licensed under the MIT License. See the LICENSE file for details.
