How can I get this Javascript function to iterate properly?

Question

I'm incorporating a Konami easter egg into my website for kicks; you enter in the Konami code, and it plays the hadouken sound from Street Fighter and the eyes on the kabuki mask in the background light up for a second.

It works...kinda. I'm having an issue. After the Konami code is entered, the above effects iterate every single time the user presses a key. It's not meant to do that. I only want the effects to go off once, immediately, every time the user enters the full code.

There's another, far more minor hiccup that would be nice to work around. The mask's eyes actually light up by briefly switching the initial background for one with the desired effect. However, the first time this is done, the page flashes as the second background is loaded, but there's no flash on subsequent iterations. I had the idea of loading the second background as an HTML image with its visibility set to hidden, but that didn't work.

    <script>
        function PlaySound(path)
        {
            var audioElement = document.createElement('audio');
            audioElement.setAttribute('src', path);
            audioElement.play();
        }
        function resetBackground()
        {
            document.body.style.backgroundImage = "url('onics.png')";
        }
        function flashBackground()
        {
            document.body.style.backgroundImage = "url('onics_red.png')";
            setTimeout(resetBackground, 830);
        }
        if(window.addEventListener)
        {
            var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
            window.addEventListener("keydown",function(e)
            {
            kkeys.push(e.keyCode);
            if(kkeys.toString().indexOf(konami)>=0)
                {
                    PlaySound('hadouken.wav');
                    flashBackground();
                }
            },true);
        }
    </script>

Answer 1

You need to reset the kkeys array:

    if(window.addEventListener)
    {
        var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
        window.addEventListener("keydown",function(e)
        {
        kkeys.push(e.keyCode);
        if(kkeys.toString().indexOf(konami)>=0)
            {
                kkeys = [];
                PlaySound('hadouken.wav');
                flashBackground();
            }
        },true);
    }

Answer 2

You can add a flag

<script>
    var konamiPlayed = false;
    function PlaySound(path)
    {
        var audioElement = document.createElement('audio');
        audioElement.setAttribute('src', path);
        audioElement.play();
    }
    function resetBackground()
    {
        document.body.style.backgroundImage = "url('onics.png')";
        konamiPlayed = false;
    }
    function flashBackground()
    {
        document.body.style.backgroundImage = "url('onics_red.png')";
        setTimeout(resetBackground, 830);
    }
    if(window.addEventListener)
    {
        var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
        window.addEventListener("keydown",function(e)
        {
            if (!konamiPlayed) {
                kkeys.push(e.keyCode);
                if(kkeys.toString().indexOf(konami)>=0)
                {
                    konamiPlayed = true;
                    PlaySound('hadouken.wav');
                    flashBackground();
                }
            }
        },true);
    }
</script>

EDIT :

And for the minor problem, I think it's because browser load image only when you ask it to. So, the first time it takes some time.