_source/plugins/a11yhelp/dialogs/a11yhelp.js

   1 /*\r
   2 Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.\r
   3 For licensing, see LICENSE.html or http://ckeditor.com/license\r
   4 */\r
   5 \r
   6 CKEDITOR.dialog.add( 'a11yHelp', function( editor )\r
   7 {\r
   8         var lang = editor.lang.accessibilityHelp,\r
   9                 id = CKEDITOR.tools.getNextNumber();\r
  10 \r
  11         // CharCode <-> KeyChar.\r
  12         var keyMap =\r
  13         {\r
  14                 8 : "BACKSPACE",\r
  15                 9 : "TAB" ,\r
  16                 13 : "ENTER" ,\r
  17                 16 : "SHIFT" ,\r
  18                 17 : "CTRL" ,\r
  19                 18 : "ALT" ,\r
  20                 19 : "PAUSE" ,\r
  21                 20 : "CAPSLOCK" ,\r
  22                 27 : "ESCAPE" ,\r
  23                 33 : "PAGE UP" ,\r
  24                 34 : "PAGE DOWN" ,\r
  25                 35 : "END" ,\r
  26                 36 : "HOME" ,\r
  27                 37 : "LEFT ARROW" ,\r
  28                 38 : "UP ARROW" ,\r
  29                 39 : "RIGHT ARROW" ,\r
  30                 40 : "DOWN ARROW" ,\r
  31                 45 : "INSERT" ,\r
  32                 46 : "DELETE" ,\r
  33                 91 : "LEFT WINDOW KEY" ,\r
  34                 92 : "RIGHT WINDOW KEY" ,\r
  35                 93 : "SELECT KEY" ,\r
  36                 96 : "NUMPAD  0" ,\r
  37                 97 : "NUMPAD  1" ,\r
  38                 98 : "NUMPAD  2" ,\r
  39                 99 : "NUMPAD  3" ,\r
  40                 100 : "NUMPAD  4" ,\r
  41                 101 : "NUMPAD  5" ,\r
  42                 102 : "NUMPAD  6" ,\r
  43                 103 : "NUMPAD  7" ,\r
  44                 104 : "NUMPAD  8" ,\r
  45                 105 : "NUMPAD  9" ,\r
  46                 106 : "MULTIPLY" ,\r
  47                 107 : "ADD" ,\r
  48                 109 : "SUBTRACT" ,\r
  49                 110 : "DECIMAL POINT" ,\r
  50                 111 : "DIVIDE" ,\r
  51                 112 : "F1" ,\r
  52                 113 : "F2" ,\r
  53                 114 : "F3" ,\r
  54                 115 : "F4" ,\r
  55                 116 : "F5" ,\r
  56                 117 : "F6" ,\r
  57                 118 : "F7" ,\r
  58                 119 : "F8" ,\r
  59                 120 : "F9" ,\r
  60                 121 : "F10" ,\r
  61                 122 : "F11" ,\r
  62                 123 : "F12" ,\r
  63                 144 : "NUM LOCK" ,\r
  64                 145 : "SCROLL LOCK" ,\r
  65                 186 : "SEMI-COLON" ,\r
  66                 187 : "EQUAL SIGN" ,\r
  67                 188 : "COMMA" ,\r
  68                 189 : "DASH" ,\r
  69                 190 : "PERIOD" ,\r
  70                 191 : "FORWARD SLASH" ,\r
  71                 192 : "GRAVE ACCENT" ,\r
  72                 219 : "OPEN BRACKET" ,\r
  73                 220 : "BACK SLASH" ,\r
  74                 221 : "CLOSE BRAKET" ,\r
  75                 222 : "SINGLE QUOTE"\r
  76         };\r
  77 \r
  78         // Modifier keys override.\r
  79         keyMap[ CKEDITOR.ALT ] = 'ALT';\r
  80         keyMap[ CKEDITOR.SHIFT ] = 'SHIFT';\r
  81         keyMap[ CKEDITOR.CTRL ] = 'CTRL';\r
  82 \r
  83         // Sort in desc.\r
  84         var modifiers = [ CKEDITOR.ALT, CKEDITOR.SHIFT, CKEDITOR.CTRL ];\r
  85 \r
  86         function representKeyStroke( keystroke )\r
  87         {\r
  88                 var quotient,\r
  89                                 modifier,\r
  90                                 presentation = [];\r
  91 \r
  92                 for ( var i = 0; i < modifiers.length; i++ )\r
  93                 {\r
  94                         modifier = modifiers[ i ];\r
  95                         quotient = keystroke / modifiers[ i ];\r
  96                         if ( quotient > 1 && quotient <= 2 )\r
  97                         {\r
  98                                 keystroke -= modifier;\r
  99                                 presentation.push( keyMap[ modifier ] );\r
 100                         }\r
 101                 }\r
 102 \r
 103                 presentation.push( keyMap[ keystroke ]\r
 104                         || String.fromCharCode( keystroke ) );\r
 105 \r
 106                 return presentation.join( '+' );\r
 107         }\r
 108 \r
 109         var variablesPattern = /\$\{(.*?)\}/g;\r
 110         function replaceVariables( match, name )\r
 111         {\r
 112                 var keystrokes = editor.config.keystrokes,\r
 113                                 definition,\r
 114                                 length = keystrokes.length;\r
 115 \r
 116                 for ( var i = 0; i < length; i++ )\r
 117                 {\r
 118                         definition = keystrokes[ i ];\r
 119                         if ( definition[ 1 ] == name )\r
 120                                 break;\r
 121                 }\r
 122                 return representKeyStroke( definition[ 0 ] );\r
 123         }\r
 124 \r
 125         // Create the help list directly from lang file entries.\r
 126         function buildHelpContents()\r
 127         {\r
 128                 var pageTpl = '<div class="cke_accessibility_legend" role="document" aria-labelledby="cke_' + id + '_arialbl" tabIndex="-1">%1</div>' +\r
 129                                 '<span id="cke_' + id + '_arialbl" class="cke_voice_label">' + lang.contents + ' </span>',\r
 130                         sectionTpl = '<h1>%1</h1><dl>%2</dl>',\r
 131                         itemTpl = '<dt>%1</dt><dd>%2</dd>';\r
 132 \r
 133                 var pageHtml = [],\r
 134                         sections = lang.legend,\r
 135                         sectionLength = sections.length;\r
 136 \r
 137                 for ( var i = 0; i < sectionLength; i++ )\r
 138                 {\r
 139                         var section = sections[ i ],\r
 140                                 sectionHtml = [],\r
 141                                 items = section.items,\r
 142                                 itemsLength = items.length;\r
 143 \r
 144                         for ( var j = 0; j < itemsLength; j++ )\r
 145                         {\r
 146                                 var item = items[ j ],\r
 147                                         itemHtml;\r
 148                                 itemHtml = itemTpl.replace( '%1', item.name ).\r
 149                                         replace( '%2', item.legend.replace( variablesPattern, replaceVariables ) );\r
 150                                 sectionHtml.push( itemHtml );\r
 151                         }\r
 152 \r
 153                         pageHtml.push( sectionTpl.replace( '%1', section.name ).replace( '%2', sectionHtml.join( '' ) ) );\r
 154                 }\r
 155 \r
 156                 return pageTpl.replace( '%1', pageHtml.join( '' ) );\r
 157         }\r
 158 \r
 159         return {\r
 160                 title : lang.title,\r
 161                 minWidth : 600,\r
 162                 minHeight : 400,\r
 163                 contents : [\r
 164                         {\r
 165                                 id : 'info',\r
 166                                 label : editor.lang.common.generalTab,\r
 167                                 expand : true,\r
 168                                 elements :\r
 169                                 [\r
 170                                         {\r
 171                                                 type : 'html',\r
 172                                                 id : 'legends',\r
 173                                                 focus : function() {},\r
 174                                                 html : buildHelpContents() +\r
 175                                                         '<style type="text/css">' +\r
 176                                                         '.cke_accessibility_legend' +\r
 177                                                         '{' +\r
 178                                                                 'width:600px;' +\r
 179                                                                 'height:400px;' +\r
 180                                                                 'padding-right:5px;' +\r
 181                                                                 'overflow-y:auto;' +\r
 182                                                                 'overflow-x:hidden;' +\r
 183                                                         '}' +\r
 184                                                         '.cke_accessibility_legend h1' +\r
 185                                                         '{' +\r
 186                                                                 'font-size: 20px;' +\r
 187                                                                 'border-bottom: 1px solid #AAA;' +\r
 188                                                                 'margin: 5px 0px 15px;' +\r
 189                                                         '}' +\r
 190                                                         '.cke_accessibility_legend dl' +\r
 191                                                         '{' +\r
 192                                                                 'margin-left: 5px;' +\r
 193                                                         '}' +\r
 194                                                         '.cke_accessibility_legend dt' +\r
 195                                                         '{' +\r
 196                                                                 'font-size: 13px;' +\r
 197                                                                 'font-weight: bold;' +\r
 198                                                         '}' +\r
 199                                                         '.cke_accessibility_legend dd' +\r
 200                                                         '{' +\r
 201                                                                 'white-space:normal;' +\r
 202                                                                 'margin:10px' +\r
 203                                                         '}' +\r
 204                                                 '</style>'\r
 205                                         }\r
 206                                 ]\r
 207                         }\r
 208                 ],\r
 209                 buttons : [ CKEDITOR.dialog.cancelButton ]\r
 210         };\r
 211 });\r