Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Konami code help 3

Status
Not open for further replies.

tyutghf

Technical User
Apr 12, 2008
258
GB
I would love to enter a konami code on one of our websites, whereby entering a key combination will blur the screen, entering again will blur even more, entering for a third time redirects to our safe drinking page.

I have found a konami code script at which seems great, however my boss doesn't want to use the konami code (boooo), instead he wants the word 'drink'.

There are two questions,

1. how do I find out the keys for d r i n k to replace up up down down etc
2. to blur the whole page fir the first time, I'll set

body {
filter: blur(2px);
}

on the second time the text is entered, I'd like to double this to

body {
filter: blur(4px);
}

and for the third time, redirect to another page on our website.

How do I modify the javascript to do this?

Thanks for any help
 
First of all: LOL!
Secondly:
;-)

Oh, for point 2): You could try with a cookie as counter. A simple if / switch case should suffice for the rest.

"Knowledge is power. Information is liberating. Education is the premise of progress, in every society, in every family." (Kofi Annan)
Oppose SOPA, PIPA, ACTA; measures to curb freedom of information under whatever name whatsoever.
 
Hi

tyutghf said:
1. how do I find out the keys for d r i n k to replace up up down down etc
Open your browser's Console and type :
JavaScript:
[i][green]'drink'[/green][/i][teal].[/teal][COLOR=orange]split[/color][teal]([/teal][i][green]''[/green][/i][teal]).[/teal][COLOR=orange]map[/color][teal]([/teal]c [teal]=>[/teal] c[teal].[/teal][COLOR=orange]toUpperCase[/color][teal]().[/teal][COLOR=orange]charCodeAt[/color][teal]())[/teal]

tyutghf said:
How do I modify the javascript to do this?
Use a counter variable to keep track of drinks then use conditional statement to do either one or other action :
JavaScript:
[b]var[/b] keys [teal]= [];[/teal]
[b]var[/b] konami [teal]=[/teal] [i][green]'68,82,73,78,75'[/green][/i][teal];[/teal]
[b]var[/b] count [teal]=[/teal] [purple]0[/purple][teal];[/teal]

$[teal]([/teal]document[teal]).[/teal][COLOR=orange]keydown[/color][teal]([/teal][b]function[/b][teal]([/teal]e[teal]) {[/teal]
    keys[teal].[/teal][COLOR=orange]push[/color][teal]([/teal]e[teal].[/teal]keyCode[teal]);[/teal]
    [b]if[/b] [teal]([/teal]keys[teal].[/teal][COLOR=orange]toString[/color][teal]().[/teal][COLOR=orange]indexOf[/color][teal]([/teal]konami[teal]) >=[/teal][purple]0[/purple][teal]) {[/teal]
        keys [teal]= [];[/teal]
        [b]if[/b] [teal](++[/teal]count [teal]==[/teal] [purple]3[/purple][teal])[/teal]
            location[teal].[/teal]href [teal]=[/teal] [i][green]'[URL unfurl="true"]https://example.com/'[/URL][/green][/i][teal];[/teal]
        [b]else[/b]
            $[teal]([/teal][i][green]'body'[/green][/i][teal]).[/teal][COLOR=orange]css[/color][teal]([/teal][i][green]'filter'[/green][/i][teal],[/teal] `[COLOR=orange]blur[/color][teal]([/teal]$[teal]{[/teal] count [teal]*[/teal] [purple]2[/purple] [teal]}[/teal]px)`[teal]);[/teal]
    [teal]}[/teal]
[teal]});[/teal]


Feherke.
feherke.github.io
 
Oh dear, my boss loves it and wants another.

Can I add a redirect for another set of keys? If the user types in 'offer', it redirects to a hidden page on the website.

Thnks
 
Hi

tyutghf said:
redirects to a hidden page
Is your boss aware that we are talking about client side scripting ? So the JavaScript source code will contain the page's name, so will not be so hidden anymore.

Beside that, what should happen if the visitor types "drink" twice then "offer" once ? Will that act as 1[sup]st[/sup] interaction and lower the blur back to 2px ( although the 2[sup]nd[/sup] "drink" already set it to 4px ) or will act as 3[sup]rd[/sup] interaction and redirect to the hidden page ( although "offer" was only typed in once ) ?


Feherke.
feherke.github.io
 
It's only hidden as far as not visible on the site navigation and hidden to robots. he is happy for anyone to view it if it gives him more sales.

offer should direct the user to the 'hidden' page, so take them away from whatever they were doing anyway. I can place a 'go back' button on the hidden page so they can resume what page they were browsing.

the redirect on drink needs to stay in place if they type drink three times
 
Hi

You did not answered the question aimed to clarify whether "drink" and "offer" should be counted together or separately.

tyutghf said:
the redirect on drink needs to stay in place if they type drink three times
Does that mean, if the visitor enters "drink" twice, then "offer" enough times to visit the hidden page, then navigate back, then entering "drink" one more time should directly redirect to the non-hidden page ? Then a cookie will be needed as MakeItSo suggested, which complicates abit both the theory and the implementation.


Feherke.
feherke.github.io
 
The two should work independently of each other ideally.

scenarios
Type drink - blur 2px
Type drink - blur 4px
type drink - redirect to the drink awareness page

type offer - redirect to the offer page

type drink - blur 2px
type offer - redirect to the offer page

Does that make sense?

We don't need it to carry across the site, so they type drink on the homepage which blurs the page. If they navigate away, the page is back to normal. They can type drink again, this will blur 2px the new page etc. If they blur 4px and can;t navigate, a page refresh will bring it back to normal.
 
Hi

Ah, so the "offer" redirects immediately ? Then maybe would be place for abit more flexibility :
JavaScript:
[b]var[/b] konami [teal]= {[/teal]
  [i][green]'drink'[/green][/i][teal]: {[/teal][i][green]'need'[/green][/i][teal]:[/teal] [purple]3[/purple][teal],[/teal] [i][green]'url'[/green][/i][teal]:[/teal] [i][green]'[URL unfurl="true"]https://example.com/'[/URL][/green][/i][teal]},[/teal]
  [i][green]'offer'[/green][/i][teal]: {[/teal][i][green]'url'[/green][/i][teal]:[/teal] [i][green]'hidden-page.html'[/green][/i][teal]},[/teal]
[teal]};[/teal]
[b]var[/b] keys [teal]=[/teal] [i][green]''[/green][/i][teal];[/teal]

$[teal]([/teal]document[teal]).[/teal][COLOR=orange]keydown[/color][teal]([/teal][b]function[/b][teal]([/teal]e[teal]) {[/teal]
    keys [teal]+=[/teal] e[teal].[/teal]key[teal];[/teal]
    [b]for[/b] [teal]([/teal][b]var[/b] word [b]in[/b] konami[teal])[/teal]
        [b]if[/b] [teal]([/teal]keys[teal].[/teal][COLOR=orange]indexOf[/color][teal]([/teal]word[teal]) >=[/teal] [purple]0[/purple][teal]) {[/teal]
            keys [teal]=[/teal] [i][green]''[/green][/i][teal];[/teal]
            konami[teal][[/teal]word[teal]].[/teal]count [teal]= ([/teal]konami[teal][[/teal]word[teal]].[/teal]count [teal]||[/teal] [purple]0[/purple][teal]) +[/teal] [purple]1[/purple][teal];[/teal]
            [b]if[/b] [teal]([/teal]konami[teal][[/teal]word[teal]].[/teal]count [teal]== ([/teal]konami[teal][[/teal]word[teal]].[/teal]need [teal]||[/teal] [purple]1[/purple][teal]))[/teal]
                location[teal].[/teal]href [teal]=[/teal] konami[teal][[/teal]word[teal]].[/teal]url[teal];[/teal]
            [b]else[/b]
                $[teal]([/teal][i][green]'body'[/green][/i][teal]).[/teal][COLOR=orange]css[/color][teal]([/teal][i][green]'filter'[/green][/i][teal],[/teal] `[COLOR=orange]blur[/color][teal]([/teal]$[teal]{[/teal] konami[teal][[/teal]word[teal]].[/teal]count [teal]*[/teal] [purple]2[/purple] [teal]}[/teal]px[teal])[/teal]`[teal]);[/teal]
        [teal]}[/teal]
[teal]});[/teal]
I guess you got the point :
[ul]
[li]Enumerate in the konami object all actions, with the trigger word as key[/li]
[li]For each trigger word specify its own URL to redirect to[/li]
[li]Optionally for trigger words which not redirect immediately specify the count with the need keyword[/li]
[/ul]
Note that trigger word checking is case sensitive ( "Drink" != "drink" ).


Feherke.
feherke.github.io
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top