I recently acquired a Shimmie based image board and have been playing with some of the beta extensions available at the shimmie git repo. I've just made a quick revision to the Arrow Key Navigation extension by "Drudex Software." Unfortunately, at the time of writing drudexsoftware.com is expired/parked so I never contacted the author.

In main.php the magic happens in this block:

    # adds the javascript to the page with the given urls
    private function add_arrowkeys_code($prev_url, $next_url) {
        global $page;

        $page->add_html_header("<script type=\"text/javascript\">
            document.onkeyup=checkKeycode;
            function checkKeycode(e)
            {
                var keycode;
                if(window.event) keycode=window.event.keyCode;
                else if(e) keycode=e.which;

                if (e.srcElement.tagName != \"INPUT\")
                {
                    if(keycode==\"37\") window.location.href='$prev_url';
                    else if(keycode==\"39\") window.location.href='$next_url';
                }
            }
            </script>");
    }

We have two problems here:

• srcElement is only available in Internet Explorer. In all other browsers it's called target.
• srcElement always returns null, at least on this board, which defeats the whole purpose of the if block anyway - to prevent using the left or right arrow keys from navigating while a user is editing an input. Textarea would obviously be a good addition.

Rather than waste eternity trying to find a workable solution that accomplishes what the author was after on IE and make it cross-browser compatible I clubbed it over its head in such a way that the arrow keys always trigger in IE and trigger outside of inputs in non-IE browsers.

    # adds the javascript to the page with the given urls
    private function add_arrowkeys_code($prev_url, $next_url) {
        global $page;

        $page->add_html_header("<script type=\"text/javascript\">
function checkKeycode(e)
{
	var keycode;
	if(window.event) keycode=window.event.keyCode;
	else if(e) keycode=e.which;

	if(navigator.appVersion.indexOf('MSIE') != -1)
	{
		if(keycode=='37') window.location.href='$prev_url';
		else if(keycode=='39') window.location.href='$next_url';
	}
	else
	{
		if (e.target.tagName != 'INPUT' & e.target.tagName != 'TEXTAREA')
		{
			if(keycode=='37') window.location.href='$prev_url';
			else if(keycode=='39') window.location.href='$next_url';
		}
	}
}
document.onkeyup=checkKeycode;
</script>");
    }

All in all, a tidy wee feature (when it works) which I will probably rip off for Ychan.

UPDATE Make that definitely have ripped off ;)

UPDATE The comment field is a textarea so it is necessary to add TEXTAREA (updated code snippet).