sources/plugins/a11yhelp/dialogs/a11yhelp.js

   1 /**
   2  * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
   3  * For licensing, see LICENSE.md or http://ckeditor.com/license
   4  */
   5
   6 CKEDITOR.dialog.add( 'a11yHelp', function( editor ) {
   7         var lang = editor.lang.a11yhelp,
   8                 id = CKEDITOR.tools.getNextId();
   9
  10         // CharCode <-> KeyChar.
  11         var keyMap = {
  12                 8: lang.backspace,
  13                 9: lang.tab,
  14                 13: lang.enter,
  15                 16: lang.shift,
  16                 17: lang.ctrl,
  17                 18: lang.alt,
  18                 19: lang.pause,
  19                 20: lang.capslock,
  20                 27: lang.escape,
  21                 33: lang.pageUp,
  22                 34: lang.pageDown,
  23                 35: lang.end,
  24                 36: lang.home,
  25                 37: lang.leftArrow,
  26                 38: lang.upArrow,
  27                 39: lang.rightArrow,
  28                 40: lang.downArrow,
  29                 45: lang.insert,
  30                 46: lang[ 'delete' ],
  31                 91: lang.leftWindowKey,
  32                 92: lang.rightWindowKey,
  33                 93: lang.selectKey,
  34                 96: lang.numpad0,
  35                 97: lang.numpad1,
  36                 98: lang.numpad2,
  37                 99: lang.numpad3,
  38                 100: lang.numpad4,
  39                 101: lang.numpad5,
  40                 102: lang.numpad6,
  41                 103: lang.numpad7,
  42                 104: lang.numpad8,
  43                 105: lang.numpad9,
  44                 106: lang.multiply,
  45                 107: lang.add,
  46                 109: lang.subtract,
  47                 110: lang.decimalPoint,
  48                 111: lang.divide,
  49                 112: lang.f1,
  50                 113: lang.f2,
  51                 114: lang.f3,
  52                 115: lang.f4,
  53                 116: lang.f5,
  54                 117: lang.f6,
  55                 118: lang.f7,
  56                 119: lang.f8,
  57                 120: lang.f9,
  58                 121: lang.f10,
  59                 122: lang.f11,
  60                 123: lang.f12,
  61                 144: lang.numLock,
  62                 145: lang.scrollLock,
  63                 186: lang.semiColon,
  64                 187: lang.equalSign,
  65                 188: lang.comma,
  66                 189: lang.dash,
  67                 190: lang.period,
  68                 191: lang.forwardSlash,
  69                 192: lang.graveAccent,
  70                 219: lang.openBracket,
  71                 220: lang.backSlash,
  72                 221: lang.closeBracket,
  73                 222: lang.singleQuote
  74         };
  75
  76         // Modifier keys override.
  77         keyMap[ CKEDITOR.ALT ] = lang.alt;
  78         keyMap[ CKEDITOR.SHIFT ] = lang.shift;
  79         keyMap[ CKEDITOR.CTRL ] = lang.ctrl;
  80
  81         // Sort in desc.
  82         var modifiers = [ CKEDITOR.ALT, CKEDITOR.SHIFT, CKEDITOR.CTRL ];
  83
  84         function representKeyStroke( keystroke ) {
  85                 var quotient, modifier,
  86                         presentation = [];
  87
  88                 for ( var i = 0; i < modifiers.length; i++ ) {
  89                         modifier = modifiers[ i ];
  90                         quotient = keystroke / modifiers[ i ];
  91                         if ( quotient > 1 && quotient <= 2 ) {
  92                                 keystroke -= modifier;
  93                                 presentation.push( keyMap[ modifier ] );
  94                         }
  95                 }
  96
  97                 presentation.push( keyMap[ keystroke ] || String.fromCharCode( keystroke ) );
  98
  99                 return presentation.join( '+' );
 100         }
 101
 102         var variablesPattern = /\$\{(.*?)\}/g;
 103
 104         var replaceVariables = ( function() {
 105                 // Swaps keystrokes with their commands in object literal.
 106                 // This makes searching keystrokes by command much easier.
 107                 var keystrokesByCode = editor.keystrokeHandler.keystrokes,
 108                         keystrokesByName = {};
 109
 110                 for ( var i in keystrokesByCode )
 111                         keystrokesByName[ keystrokesByCode[ i ] ] = i;
 112
 113                 return function( match, name ) {
 114                         // Return the keystroke representation or leave match untouched
 115                         // if there's no keystroke for such command.
 116                         return keystrokesByName[ name ] ? representKeyStroke( keystrokesByName[ name ] ) : match;
 117                 };
 118         } )();
 119
 120         // Create the help list directly from lang file entries.
 121         function buildHelpContents() {
 122                 var pageTpl = '<div class="cke_accessibility_legend" role="document" aria-labelledby="' + id + '_arialbl" tabIndex="-1">%1</div>' +
 123                                 '<span id="' + id + '_arialbl" class="cke_voice_label">' + lang.contents + ' </span>',
 124                         sectionTpl = '<h1>%1</h1><dl>%2</dl>',
 125                         itemTpl = '<dt>%1</dt><dd>%2</dd>';
 126
 127                 var pageHtml = [],
 128                         sections = lang.legend,
 129                         sectionLength = sections.length;
 130
 131                 for ( var i = 0; i < sectionLength; i++ ) {
 132                         var section = sections[ i ],
 133                                 sectionHtml = [],
 134                                 items = section.items,
 135                                 itemsLength = items.length;
 136
 137                         for ( var j = 0; j < itemsLength; j++ ) {
 138                                 var item = items[ j ],
 139                                         itemLegend = item.legend.replace( variablesPattern, replaceVariables );
 140
 141                                 // (#9765) If some commands haven't been replaced in the legend,
 142                                 // most likely their keystrokes are unavailable and we shouldn't include
 143                                 // them in our help list.
 144                                 if ( itemLegend.match( variablesPattern ) )
 145                                         continue;
 146
 147                                 sectionHtml.push( itemTpl.replace( '%1', item.name ).replace( '%2', itemLegend ) );
 148                         }
 149
 150                         pageHtml.push( sectionTpl.replace( '%1', section.name ).replace( '%2', sectionHtml.join( '' ) ) );
 151                 }
 152
 153                 return pageTpl.replace( '%1', pageHtml.join( '' ) );
 154         }
 155
 156         return {
 157                 title: lang.title,
 158                 minWidth: 600,
 159                 minHeight: 400,
 160                 contents: [ {
 161                         id: 'info',
 162                         label: editor.lang.common.generalTab,
 163                         expand: true,
 164                         elements: [
 165                                 {
 166                                         type: 'html',
 167                                         id: 'legends',
 168                                         style: 'white-space:normal;',
 169                                         focus: function() {
 170                                                 this.getElement().focus();
 171                                         },
 172                                         html: buildHelpContents() + '<style type="text/css">' +
 173                                                 '.cke_accessibility_legend' +
 174                                                 '{' +
 175                                                         'width:600px;' +
 176                                                         'height:400px;' +
 177                                                         'padding-right:5px;' +
 178                                                         'overflow-y:auto;' +
 179                                                         'overflow-x:hidden;' +
 180                                                 '}' +
 181                                                 // Some adjustments are to be done for Quirks to work "properly" (#5757)
 182                                                 '.cke_browser_quirks .cke_accessibility_legend,' +
 183                                                 '{' +
 184                                                         'height:390px' +
 185                                                 '}' +
 186                                                 // Override non-wrapping white-space rule in reset css.
 187                                                 '.cke_accessibility_legend *' +
 188                                                 '{' +
 189                                                         'white-space:normal;' +
 190                                                 '}' +
 191                                                 '.cke_accessibility_legend h1' +
 192                                                 '{' +
 193                                                         'font-size: 20px;' +
 194                                                         'border-bottom: 1px solid #AAA;' +
 195                                                         'margin: 5px 0px 15px;' +
 196                                                 '}' +
 197                                                 '.cke_accessibility_legend dl' +
 198                                                 '{' +
 199                                                         'margin-left: 5px;' +
 200                                                 '}' +
 201                                                 '.cke_accessibility_legend dt' +
 202                                                 '{' +
 203                                                         'font-size: 13px;' +
 204                                                         'font-weight: bold;' +
 205                                                 '}' +
 206                                                 '.cke_accessibility_legend dd' +
 207                                                 '{' +
 208                                                         'margin:10px' +
 209                                                 '}' +
 210                                                 '</style>'
 211                                 }
 212                         ]
 213                 } ],
 214                 buttons: [ CKEDITOR.dialog.cancelButton ]
 215         };
 216 } );