+ // Convert to event.\r
+ !event.name && ( event = new CKEDITOR.event( event ) );\r
+\r
+ var isFocus = !(/mouse/).test( event.name ),\r
+ target = event.data.getTarget(),\r
+ color;\r
+\r
+ if ( target.getName() == 'td' && ( color = target.getChild( 0 ).getHtml() ) )\r
+ {\r
+ removeHighlight( event );\r
+\r
+ isFocus ? focused = target : hovered = target;\r
+\r
+ // Apply outline style to show focus.\r
+ if ( isFocus )\r
+ {\r
+ target.setStyle( 'border-color', whiteOrBlack( color ) );\r
+ target.setStyle( 'border-style', 'dotted' );\r
+ }\r
+\r
+ $doc.getById( hicolorId ).setStyle( 'background-color', color );\r
+ $doc.getById( hicolorTextId ).setHtml( color );\r
+ }\r
+ }\r
+\r
+ function clearHighlight()\r
+ {\r
+ var color = focused.getChild( 0 ).getHtml();\r
+ focused.setStyle( 'border-color', color );\r
+ focused.setStyle( 'border-style', 'solid' );\r
+ $doc.getById( hicolorId ).removeStyle( 'background-color' );\r
+ $doc.getById( hicolorTextId ).setHtml( ' ' );\r
+ focused = null;\r
+ }\r
+\r
+ // Remove previously focused style.\r
+ function removeHighlight( event )\r
+ {\r
+ var isFocus = !(/mouse/).test( event.name ),\r
+ target = isFocus && focused;\r
+\r
+ if ( target )\r
+ {\r
+ var color = target.getChild( 0 ).getHtml();\r
+ target.setStyle( 'border-color', color );\r
+ target.setStyle( 'border-style', 'solid' );\r
+ }\r
+\r
+ if ( ! ( focused || hovered ) )\r
+ {\r
+ $doc.getById( hicolorId ).removeStyle( 'background-color' );\r
+ $doc.getById( hicolorTextId ).setHtml( ' ' );\r
+ }\r
+ }\r
+\r
+ function onKeyStrokes( evt )\r
+ {\r
+ var domEvt = evt.data;\r
+\r
+ var element = domEvt.getTarget();\r
+ var relative, nodeToMove;\r
+ var keystroke = domEvt.getKeystroke(),\r
+ rtl = editor.lang.dir == 'rtl';\r
+\r
+ switch ( keystroke )\r
+ {\r
+ // UP-ARROW\r
+ case 38 :\r
+ // relative is TR\r
+ if ( ( relative = element.getParent().getPrevious() ) )\r
+ {\r
+ nodeToMove = relative.getChild( [ element.getIndex() ] );\r
+ nodeToMove.focus();\r
+ }\r
+ domEvt.preventDefault();\r
+ break;\r
+ // DOWN-ARROW\r
+ case 40 :\r
+ // relative is TR\r
+ if ( ( relative = element.getParent().getNext() ) )\r
+ {\r
+ nodeToMove = relative.getChild( [ element.getIndex() ] );\r
+ if ( nodeToMove && nodeToMove.type == 1 )\r
+ {\r
+ nodeToMove.focus();\r
+ }\r
+ }\r
+ domEvt.preventDefault();\r
+ break;\r
+\r
+ // SPACE\r
+ // ENTER\r
+ case 32 :\r
+ case 13 :\r
+ updateSelected( evt );\r
+ domEvt.preventDefault();\r
+ break;\r
+\r
+ // RIGHT-ARROW\r
+ case rtl ? 37 : 39 :\r
+ // relative is TD\r
+ if ( ( nodeToMove = element.getNext() ) )\r
+ {\r
+ if ( nodeToMove.type == 1 )\r
+ {\r
+ nodeToMove.focus();\r
+ domEvt.preventDefault( true );\r
+ }\r
+ }\r
+ // relative is TR\r
+ else if ( ( relative = element.getParent().getNext() ) )\r
+ {\r
+ nodeToMove = relative.getChild( [ 0 ] );\r
+ if ( nodeToMove && nodeToMove.type == 1 )\r
+ {\r
+ nodeToMove.focus();\r
+ domEvt.preventDefault( true );\r
+ }\r
+ }\r
+ break;\r
+\r
+ // LEFT-ARROW\r
+ case rtl ? 39 : 37 :\r
+ // relative is TD\r
+ if ( ( nodeToMove = element.getPrevious() ) )\r
+ {\r
+ nodeToMove.focus();\r
+ domEvt.preventDefault( true );\r
+ }\r
+ // relative is TR\r
+ else if ( ( relative = element.getParent().getPrevious() ) )\r
+ {\r
+ nodeToMove = relative.getLast();\r
+ nodeToMove.focus();\r
+ domEvt.preventDefault( true );\r
+ }\r
+ break;\r
+ default :\r
+ // Do not stop not handled events.\r
+ return;\r
+ }\r
+ }\r