im trying to do an easter egg in my website, and i want to detect if the user has typed some words in sequence and in 30sec. The words wont be typed in any textarea or input, it will be just like you land on the page and start typing the words ”hello im Darius”, or you are on the page looking around and you can start typing and the timer starts. I guess it will be something like $(document).keyup(){...
but i have no ideia how to track all the words in sequence and in the given time. JQuery or vanilla but i prefer jquery if possible. thanks guys.
EDIT:
this is what i have so far:
$(document).keypress(function(event){ if (hotwords && timer){ hotwords += String.fromCharCode(event.which); }else{ var hotwords = String.fromCharCode(event.which); var timer = 1; alert(hotwords); setTimeout(function(){ timer = 0; hotwords = ''; },30000); } });
Advertisement
Answer
Here’s an example that appends each key pressed into an array. You can implement other methods as well, such as string concatenation or even limiting the amount of characters being stored to 15.
Expected outcome:
- A log of keys the user has pressed while they were in the window (not limited to text boxes)
- An array of strings, containing the keystrokes
Code:
let keylog = []; document.onkeydown = function (e) { let keypressed = e.key; keylog.push(keypressed); console.log(keylog); };
References:
Documentation for
document.onkeydown
: https://developer.mozilla.org/en-US/docs/Web/API/Document/keydown_event