Ticket #3042: 3042_4.patch

File 3042_4.patch, 15.9 KB (added by Frederico Caldeira Knabben, 16 years ago)

  • _source/core/dom/element.js

     
    311311                 */
    312312                focus : function()
    313313                {
    314                         this.$.focus();
     314                        // IE throws error if the element is not visible.
     315                        try
     316                        {
     317                                this.$.focus();
     318                        }
     319                        catch (e)
     320                        {}
    315321                },
    316322
    317323                /**

  • _source/core/dom/nodelist.js

     
    1717
    1818        getItem : function( index )
    1919        {
    20                 return new CKEDITOR.dom.node( this.$[ index ] );
     20                var $node = this.$[ index ];
     21                return $node ? new CKEDITOR.dom.node( $node ) : null;
    2122        }
    2223};

  • _source/plugins/colorbutton/plugin.js

     
    3737                                                block.autoSize = true;
    3838                                                block.element.addClass( 'cke_colorblock' );
    3939                                                block.element.setHtml( renderColors( panel, type ) );
     40
     41                                                var keys = block.keys;
     42                                                keys[ 39 ]      = 'next';                                       // ARROW-RIGHT
     43                                                keys[ 9 ]       = 'next';                                       // TAB
     44                                                keys[ 37 ]      = 'prev';                                       // ARROW-LEFT
     45                                                keys[ CKEDITOR.SHIFT + 9 ]      = 'prev';       // SHIFT + TAB
     46                                                keys[ 32 ]      = 'click';                                      // SPACE
    4047                                        },
    4148
    4249                                        onOpen : function()
    … …  
    93100
    94101                        // Render the "Automatic" button.
    95102                        output.push(
    96                                 '<a class="cke_colorauto"' +
     103                                '<a class="cke_colorauto" _cke_focus=1 hidefocus=true' +
     104                                        ' title="', lang.auto, '"' +
    97105                                        ' onclick="CKEDITOR.tools.callFunction(', clickFn, ',null,\'', type, '\');"' +
    98106                                        ' href="javascript:void(\'', lang.auto, '\')">' +
    99107                                        '<table cellspacing=0 cellpadding=0 width="100%">' +
    … …  
    118126                                var color = colors[ i ];
    119127                                output.push(
    120128                                        '<td>' +
    121                                                 '<a class="cke_colorbox"' +
     129                                                '<a class="cke_colorbox" _cke_focus=1 hidefocus=true' +
     130                                                        ' title="', color, '"' +
    122131                                                        ' onclick="CKEDITOR.tools.callFunction(', clickFn, ',\'#', color, '\',\'', type, '\');"' +
    123132                                                        ' href="javascript:void(\'', color, '\')">' +
    124133                                                        '<span class="cke_colorbox" style="background-color:#', color, '"></span>' +
    … …  
    133142                                        '</tr>' +
    134143                                        '<tr>' +
    135144                                                '<td colspan=8 align=center>' +
    136                                                         '<a class="cke_colormore"' +
     145                                                        '<a class="cke_colormore" _cke_focus=1 hidefocus=true' +
     146                                                                ' title="', lang.more, '"' +
    137147                                                                ' onclick="CKEDITOR.tools.callFunction(', clickFn, ',\'?\',\'', type, '\');"' +
    138148                                                                ' href="javascript:void(\'', lang.more, '\')">',
    139149                                                                lang.more,

  • _source/plugins/floatpanel/plugin.js

     
    150150                                                iframe.$.contentWindow.focus();
    151151                                        }, 0);
    152152
     153                                panel.onEscape = CKEDITOR.tools.bind( function()
     154                                        {
     155                                                this.onEscape && this.onEscape();
     156                                        },
     157                                        this );
     158
    153159                                if ( this.onShow )
    154160                                        this.onShow.call( this );
    155161                        },

  • _source/plugins/listblock/plugin.js

     
    2424                                        this.base( blockHolder );
    2525
    2626                                        this.multiSelect = !!multiSelect;
     27                                       
     28                                        var keys = this.keys;
     29                                        keys[ 40 ]      = 'next';                                       // ARROW-DOWN
     30                                        keys[ 9 ]       = 'next';                                       // TAB
     31                                        keys[ 38 ]      = 'prev';                                       // ARROW-UP
     32                                        keys[ CKEDITOR.SHIFT + 9 ]      = 'prev';       // SHIFT + TAB
     33                                        keys[ 32 ]      = 'click';                                      // SPACE
    2734
    2835                                        this._.pendingHtml = [];
    2936                                        this._.items = {};
    … …  
    6572
    6673                                proto :
    6774                                {
    68                                         add : function( value, html )
     75                                        add : function( value, html, title )
    6976                                        {
    7077                                                var pendingHtml = this._.pendingHtml,
    71                                                         id = CKEDITOR.tools.getNextNumber();
     78                                                        id = 'cke_' + CKEDITOR.tools.getNextNumber();
    7279
    7380                                                if ( !this._.started )
    7481                                                {
    … …  
    7885
    7986                                                this._.items[ value ] = id;
    8087
    81                                                 pendingHtml.push( '<li id=cke_', id, ' class=cke_panel_listItem><a hidefocus=true href="javascript:void(\'', value, '\')" onclick="CKEDITOR.tools.callFunction(', this._.getClick(), ',\'', value, '\');">', html || value, '</a></li>' );
     88                                                pendingHtml.push(
     89                                                        '<li id=', id, ' class=cke_panel_listItem>' +
     90                                                                '<a _cke_focus=1 hidefocus=true' +
     91                                                                        ' title="', title || value, '"' +
     92                                                                        ' href="javascript:void(\'', value, '\')"' +
     93                                                                        ' onclick="CKEDITOR.tools.callFunction(', this._.getClick(), ',\'', value, '\');">',
     94                                                                        html || value,
     95                                                                '</a>' +
     96                                                        '</li>' );
    8297                                        },
    8398
    8499                                        startGroup : function( title )
    85100                                        {
    86101                                                this._.close();
    87102
    88                                                 var id = CKEDITOR.tools.getNextNumber();
     103                                                var id = 'cke_' + CKEDITOR.tools.getNextNumber();
    89104
    90105                                                this._.groups[ title ] = id;
    91106
    92                                                 this._.pendingHtml.push( '<h1 id=cke_', id, ' class=cke_panel_grouptitle>', title, '</h1>' );
     107                                                this._.pendingHtml.push( '<h1 id=', id, ' class=cke_panel_grouptitle>', title, '</h1>' );
    93108                                        },
    94109
    95110                                        commit : function()
    … …  
    112127
    113128                                        hideGroup : function( groupTitle )
    114129                                        {
    115                                                 var group = this.element.getDocument().getById( 'cke_' + this._.groups[ groupTitle ] ),
     130                                                var group = this.element.getDocument().getById( this._.groups[ groupTitle ] ),
    116131                                                        list = group && group.getNext();
    117132
    118133                                                if ( group )
    … …  
    126141
    127142                                        hideItem : function( value )
    128143                                        {
    129                                                 this.element.getDocument().getById( 'cke_' + this._.items[ value ] ).setStyle( 'display', 'none' );
     144                                                this.element.getDocument().getById( this._.items[ value ] ).setStyle( 'display', 'none' );
    130145                                        },
    131146
    132147                                        showAll : function()
    … …  
    137152
    138153                                                for ( var value in items )
    139154                                                {
    140                                                         doc.getById( 'cke_' + items[ value ] ).setStyle( 'display', '' );
     155                                                        doc.getById( items[ value ] ).setStyle( 'display', '' );
    141156                                                }
    142157
    143158                                                for ( title in groups )
    144159                                                {
    145                                                         var group = doc.getById( 'cke_' + groups[ title ] ),
     160                                                        var group = doc.getById( groups[ title ] ),
    146161                                                                list = group.getNext();
    147162
    148163                                                        group.setStyle( 'display', '' );
    … …  
    157172                                                if ( !this.multiSelect )
    158173                                                        this.unmarkAll();
    159174
    160                                                 this.element.getDocument().getById( 'cke_' + this._.items[ value ] ).addClass( 'cke_selected' );
     175                                                this.element.getDocument().getById( this._.items[ value ] ).addClass( 'cke_selected' );
    161176                                        },
    162177
    163178                                        unmark : function( value )
    164179                                        {
    165                                                 this.element.getDocument().getById( 'cke_' + this._.items[ value ] ).removeClass( 'cke_selected' );
     180                                                this.element.getDocument().getById( this._.items[ value ] ).removeClass( 'cke_selected' );
    166181                                        },
    167182
    168183                                        unmarkAll : function()
    … …  
    172187
    173188                                                for ( var value in items )
    174189                                                {
    175                                                         doc.getById( 'cke_' + items[ value ] ).removeClass( 'cke_selected' );
     190                                                        doc.getById( items[ value ] ).removeClass( 'cke_selected' );
    176191                                                }
    177192                                        },
    178193
    179194                                        isMarked : function( value )
    180195                                        {
    181                                                 return this.element.getDocument().getById( 'cke_' + this._.items[ value ] ).hasClass( 'cke_selected' );
     196                                                return this.element.getDocument().getById( this._.items[ value ] ).hasClass( 'cke_selected' );
     197                                        },
     198
     199                                        focus : function( value )
     200                                        {
     201                                                this._.focusIndex = -1;
     202
     203                                                if ( value )
     204                                                {
     205                                                        var selected = this.element.getDocument().getById( this._.items[ value ] ).getFirst();
     206
     207                                                        var links = this.element.getElementsByTag( 'a' ),
     208                                                                link,
     209                                                                i = -1;
     210
     211                                                        while( ( link = links.getItem( ++i ) ) )
     212                                                        {
     213                                                                if ( link.equals( selected ) )
     214                                                                {
     215                                                                        this._.focusIndex = i;
     216                                                                        break;
     217                                                                }
     218                                                        }
     219
     220                                                        setTimeout( function()
     221                                                                {
     222                                                                        selected.focus();
     223                                                                },
     224                                                                0 );
     225                                                }
    182226                                        }
    183227                                }
    184228                        });

  • _source/plugins/panel/plugin.js

     
    138138                                        },
    139139                                        this);
    140140
     141                                doc.on( 'keydown', function( evt )
     142                                        {
     143                                                var keystroke = evt.data.getKeystroke();
     144
     145                                                // Delegate key processing to block.
     146                                                if ( this._.onKeyDown && this._.onKeyDown( keystroke ) === false )
     147                                                {
     148                                                        evt.data.preventDefault();
     149                                                        return;
     150                                                }
     151
     152                                                if ( keystroke == 27 )          // ESC
     153                                                        this.onEscape && this.onEscape();
     154                                        },
     155                                        this );
     156
    141157                                holder = doc.getBody();
    142158                        }
    143159                        else
    … …  
    175191
    176192                this._.currentBlock = block;
    177193
     194                // Reset the focus index, so it will always go into the first one.
     195                block._.focusIndex = -1;
     196
     197                this._.onKeyDown = block.onKeyDown && CKEDITOR.tools.bind( block.onKeyDown, block );
     198
    178199                block.show();
    179200
    180201                return block;
    181202        }
    182203};
    183204
    184 CKEDITOR.ui.panel.block = function( blockHolder )
     205CKEDITOR.ui.panel.block = CKEDITOR.tools.createClass(
    185206{
    186         this.element = blockHolder.append(
    187                 blockHolder.getDocument().createElement( 'div',
    188                         {
    189                                 attributes :
     207        $ : function( blockHolder )
     208        {
     209                this.element = blockHolder.append(
     210                        blockHolder.getDocument().createElement( 'div',
    190211                                {
    191                                         'class' : 'cke_panel_block'
    192                                 },
    193                                 styles :
    194                                 {
    195                                         display : 'none'
    196                                 }
    197                         }) );
    198 };
     212                                        attributes :
     213                                        {
     214                                                'class' : 'cke_panel_block'
     215                                        },
     216                                        styles :
     217                                        {
     218                                                display : 'none'
     219                                        }
     220                                }) );
     221               
     222                this.keys = {};
     223               
     224                this._.focusIndex = -1;
     225        },
     226       
     227        _ : {},
    199228
    200 CKEDITOR.ui.panel.block.prototype =
    201 {
    202         show : function()
     229        proto :
    203230        {
    204                 this.element.setStyle( 'display', '' );
    205         },
     231                show : function()
     232                {
     233                        this.element.setStyle( 'display', '' );
     234                },
    206235
    207         hide : function()
    208         {
    209                 this.element.setStyle( 'display', 'none' );
     236                hide : function()
     237                {
     238                        this.element.setStyle( 'display', 'none' );
     239                },
     240
     241                onKeyDown : function( keystroke )
     242                {
     243                        var keyAction = this.keys[ keystroke ];
     244                        switch ( keyAction )
     245                        {
     246                                // Move forward.
     247                                case 'next' :
     248                                        var index = this._.focusIndex,
     249                                                links = this.element.getElementsByTag( 'a' ),
     250                                                link;
     251                                       
     252                                        while ( ( link = links.getItem( ++index ) ) )
     253                                        {
     254                                                // Move the focus only if the element is marked with
     255                                                // the _cke_focus and it it's visible (check if it has
     256                                                // width).
     257                                                if ( link.getAttribute( '_cke_focus' ) && link.$.offsetWidth )
     258                                                {
     259                                                        this._.focusIndex = index;
     260                                                        link.focus();
     261                                                        break;
     262                                                }
     263                                        }
     264                                        return false;
     265
     266                                // Move backward.
     267                                case 'prev' :
     268                                        var index = this._.focusIndex,
     269                                                links = this.element.getElementsByTag( 'a' ),
     270                                                link;
     271
     272                                        while ( index > 0 && ( link = links.getItem( --index ) ) )
     273                                        {
     274                                                // Move the focus only if the element is marked with
     275                                                // the _cke_focus and it it's visible (check if it has
     276                                                // width).
     277                                                if ( link.getAttribute( '_cke_focus' ) && link.$.offsetWidth )
     278                                                {
     279                                                        this._.focusIndex = index;
     280                                                        link.focus();
     281                                                        break;
     282                                                }
     283                                        }
     284                                        return false;
     285
     286                                case 'click' :
     287                                        var index = this._.focusIndex,
     288                                                link = index >= 0 && this.element.getElementsByTag( 'a' ).getItem( index );
     289
     290                                        if ( link )
     291                                                link.$.click();
     292
     293                                        return false;
     294                        }
     295                }
    210296        }
    211 };
     297});

  • _source/plugins/panelbutton/plugin.js

     
    9393                        var keyDownFn = CKEDITOR.tools.addFunction( function( ev, element ){
    9494                               
    9595                                ev = new CKEDITOR.dom.event( ev );
     96
    9697                                var keystroke = ev.getKeystroke();
    9798                                switch ( keystroke )
    9899                                {
    99                                         case 13 :                                       // ENTER
    100                                         case 32 :                                       // SPACE
     100                                        case 13 :       // ENTER
     101                                        case 32 :       // SPACE
     102                                        case 40 :       // ARROW-DOWN
    101103                                                // Show panel 
    102104                                                CKEDITOR.tools.callFunction( clickFn, element );
    103105                                                break;
    … …  
    105107                                                // Delegate the default behavior to toolbar button key handling.
    106108                                                instance.onkey( instance,  keystroke );
    107109                                }
     110
    108111                                // Avoid subsequent focus grab on editor document.
    109112                                ev.preventDefault();
    110113                        });
    … …  
    190193                                        if ( me.onClose )
    191194                                                me.onClose();
    192195                                };
     196
     197                        panel.onEscape = function()
     198                                {
     199                                        panel.hide();
     200                                        me.document.getById( _.id ).focus();
     201                                };
     202
    193203                       
    194204                        if ( this.onBlock )
    195205                                this.onBlock( panel, _.id );

  • _source/plugins/richcombo/plugin.js

     
    120120                                },
    121121                                execute : clickFn
    122122                        };
    123                        
    124                         var keyDownFn = CKEDITOR.tools.addFunction( function( ev, element ){
    125                                
    126                                 ev = new CKEDITOR.dom.event( ev );
    127                                 var keystroke = ev.getKeystroke();
    128                                 switch ( keystroke )
     123
     124                        var keyDownFn = CKEDITOR.tools.addFunction( function( ev, element )
    129125                                {
    130                                         case 13 :                                       // ENTER
    131                                         case 32 :                                       // SPACE
    132                                                 // Show panel 
    133                                                 CKEDITOR.tools.callFunction( clickFn, element );
    134                                                 break;
    135                                         default :
    136                                                 // Delegate the default behavior to toolbar button key handling.
    137                                                 instance.onkey( instance,  keystroke );
    138                                 }
    139                                
    140                                 // Avoid subsequent focus grab on editor document.
    141                                 ev.preventDefault();
    142                         });
    143                        
     126                                        ev = new CKEDITOR.dom.event( ev );
     127
     128                                        var keystroke = ev.getKeystroke();
     129                                        switch ( keystroke )
     130                                        {
     131                                                case 13 :       // ENTER
     132                                                case 32 :       // SPACE
     133                                                case 40 :       // ARROW-DOWN
     134                                                        // Show panel
     135                                                        CKEDITOR.tools.callFunction( clickFn, element );
     136                                                        break;
     137                                                default :
     138                                                        // Delegate the default behavior to toolbar button key handling.
     139                                                        instance.onkey( instance,  keystroke );
     140                                        }
     141
     142                                        // Avoid subsequent focus grab on editor document.
     143                                        ev.preventDefault();
     144                                });
     145
    144146                        output.push(
    145147                                '<span class="cke_rcombo">',
    146148                                '<span id=', id );
    … …  
    202204                                                this.element.getFirst().addClass( me.className + '_panel' );
    203205
    204206                                        me.document.getById( 'cke_' + me.id ).addClass( 'cke_on');
     207                                       
     208                                        list.focus( !me.multiSelect && me.getValue() );
    205209
    206210                                        me._.on = 1;
    207211
    … …  
    222226                                                me.onClose();
    223227                                };
    224228
     229                        panel.onEscape = function()
     230                                {
     231                                        panel.hide();
     232                                        me.document.getById( 'cke_' + me.id ).getFirst().getNext().focus();
     233                                };
     234
    225235                        list.onClick = function( value, marked )
    226236                                {
    227237                                        // Move the focus to the main windows, otherwise it will stay
    … …  
    288298                add : function( value, html, text )
    289299                {
    290300                        this._.items[ value ] = text || value;
    291                         this._.list.add( value, html );
     301                        this._.list.add( value, html, text );
    292302                },
    293303
    294304                startGroup : function( title )

  • _source/skins/default/panel.css

     
    154154    float: left;
    155155}
    156156
    157 a:hover.cke_colorbox
     157a:hover.cke_colorbox,
     158a:focus.cke_colorbox,
     159a:active.cke_colorbox
    158160{
    159161    border: #316ac5 1px solid;
    160162    background-color: #dff1ff;
    … …  
    169171}
    170172
    171173a:hover.cke_colorauto,
    172 a:hover.cke_colormore
     174a:hover.cke_colormore,
     175a:focus.cke_colorauto,
     176a:focus.cke_colormore,
     177a:active.cke_colorauto,
     178a:active.cke_colormore
    173179{
    174180    border: #316ac5 1px solid;
    175181    background-color: #dff1ff;
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy