OS X keybindings in AIR app

Question

When used in an AIR app, some standard keystrokes in OS X are either ignored or produce "mystery" characters rather than behaving as expected. Examples:

• option + left arrow should move the caret one word backward, it prints a mystery character
• ctrl + h should delete one character backward, it prints h

How do I support OS X default keystrokes (listed here: http://www.hcs.harvard.edu/~jrus/Site/System%20Bindings.html)?

Answer 1

I have found some clues in the Webkit source to enable support in <mx:HTML> views, here: http://www.opensource.apple.com/darwinsource/10.5/WebCore-5523.10.3/editing/Editor.cpp

And a clue with regards to Webkit's expected syntax here: http://lists.macosforge.org/pipermail/webkit-unassigned/2007-May/038737.html

Note this solution is incomplete, does not work in Flex/Flash components, and depends on Prototype:

$(document).observe('dom:loaded', function() {
    // Defined in AIR as !!NativeApplication.supportsDockIcon
    if(window.Air.OperatingSystem == 'mac') {
        var keyBindings = {
            altKey: {
                // Up (should be 38)
                14: {
                    dir: -1,
                    gran: 'paragraph'
                },
                // Down (should be 40)
                15: {
                    dir: 1,
                    gran: 'paragraph'
                },
                // Left (should be 37)
                1: {
                    dir: -1,
                    gran: 'word'
                },
                // Right (should be 39)
                2: {
                    dir: 1,
                    gran: 'word'
                },
                // Backspace
                8: {
                    dir: -1,
                    gran: 'word',
                    del: true
                },
                // Delete
                46: {
                    dir: 1,
                    gran: 'word',
                    del: true
                }
            },
            ctrlKey: {
                // Left
                37: {
                    dir: -1,
                    gran: 'lineBoundary'
                },
                // Right
                39: {
                    dir: 1,
                    gran: 'lineBoundary'
                },
                // a
                65: {
                    dir: -1,
                    gran: 'paragraphBoundary'
                },
                // b
                66: {
                    dir: -1,
                    gran: 'character'
                },
                // d
                68: {
                    dir: 1,
                    gran: 'character',
                    del: true
                },
                // e
                69: {
                    dir: 1,
                    gran: 'paragraphBoundary'
                },
                // f
                70: {
                    dir: 1,
                    gran: 'character'
                },
                // h
                72: {
                    dir: -1,
                    gran: 'character',
                    del: true
                },
                // k
                75: {
                    dir: 1,
                    gran: 'paragraphBoundary',
                    del: true
                },
                // n
                78: {
                    dir: 1,
                    gran: 'line'
                },
                // p
                80: {
                    dir: -1,
                    gran: 'line'
                }
            }
        };
        $(document).observe('keydown', function(e) {
            var target = e.element();
            if(
                target.match('input') ||
                target.match('textarea') ||
                target.readAttribute('contenteditable') == 'true'
            ) {
                if(
                    (e.keyCode in keyBindings.altKey && e.altKey) ||
                    (e.keyCode in keyBindings.ctrlKey && e.ctrlKey)
                ) {
                    e.stop();
                    var selection = window.getSelection();
                    var keystroke = keyBindings[(e.altKey ? 'altKey' : 'ctrlKey')][e.keyCode];
                    if(
                        (e.keyCode != 8 && e.keyCode != 46) ||
                        selection.isCollapsed
                    ) {
                        selection.modify(
                            keystroke.del || e.shiftKey ?
                                'extend' :
                                'move',
                            keystroke.dir == -1 ? 'backward' : keystroke.dir == 1 ? 'forward' : null,
                            keystroke.gran
                        );
                    }
                    if(keystroke.del && !selection.isCollapsed) {
                        document.execCommand('delete', false, null);
                    }
                }
            }
        });
    }
});