Ticket #3951: 3951_3.patch

CHANGES.html

@@ -131 +131 @@
                 <li><a href="http://dev.fckeditor.net/ticket/3671">#3671</a> : Fixed body fixing should be applied to the real type under fake elements.</li>
                 <li><a href="http://dev.fckeditor.net/ticket/3836">#3836</a> : Fixed remove list in enterMode=BR will merge sibling text to one line.</li>
                 <li><a href="http://dev.fckeditor.net/ticket/3949">#3949</a> : Fixed enterKey within pre-formatted text introduce wrong line-break.</li>
+                <li><a href="http://dev.fckeditor.net/ticket/3951">#3951</a> : Reset size and lock ratio options were not accessible in Image dialog.</li>
         </ul>
         <h3>
                 CKEditor 3.0 RC</h3>

_source/plugins/image/dialogs/image.js

@@ -346 +346 @@
                         {
                                 if ( dialogType != 'image' )
                                         this.hidePage( 'Link' );                //Hide Link tab.
+                                var doc = this._.element.getDocument();
+                                this.addFocusable( doc.getById( 'btnLockSizes' ), 5 );
+                                this.addFocusable( doc.getById( 'btnResetSize' ), 5 );
                         },
                         onHide : function()
                         {
@@ -614 +617 @@
                                                                                                                                 }, this.getDialog() );
                                                                                                                         resetButton.on( 'mouseover', function()
                                                                                                                                 {
-                                                                                                                                        this.addClass( 'BtnOver' );
+                                                                                                                                        this.addClass( 'cke_btn_over' );
                                                                                                                                 }, resetButton );
                                                                                                                         resetButton.on( 'mouseout', function()
                                                                                                                                 {
-                                                                                                                                        this.removeClass( 'BtnOver' );
+                                                                                                                                        this.removeClass( 'cke_btn_over' );
                                                                                                                                 }, resetButton );
                                                                                                                 }
                                                                                                                 // Activate (Un)LockRatio button
@@ -642 +645 @@
                                                                                                                                 }, this.getDialog() );
                                                                                                                         ratioButton.on( 'mouseover', function()
                                                                                                                                 {
-                                                                                                                                        this.addClass( 'BtnOver' );
+                                                                                                                                        this.addClass( 'cke_btn_over' );
                                                                                                                                 }, ratioButton );
                                                                                                                         ratioButton.on( 'mouseout', function()
                                                                                                                                 {
-                                                                                                                                        this.removeClass( 'BtnOver' );
+                                                                                                                                        this.removeClass( 'cke_btn_over' );
                                                                                                                                 }, ratioButton );
                                                                                                                 }
                                                                                                         },
                                                                                                         html : '<div>'+
-                                                                                                                '<div title="' + editor.lang.image.lockRatio +
-                                                                                                                '" class="cke_btn_locked" id="btnLockSizes"></div>' +
-                                                                                                                '<div title="' + editor.lang.image.resetSize +
-                                                                                                                '" class="cke_btn_reset" id="btnResetSize"></div>'+
+                                                                                                                '<a href="javascript:void(0)" tabindex="-1" title="' + editor.lang.image.lockRatio +
+                                                                                                                '" class="cke_btn_locked" id="btnLockSizes"></a>' +
+                                                                                                                '<a href="javascript:void(0)" tabindex="-1" title="' + editor.lang.image.resetSize +
+                                                                                                                '" class="cke_btn_reset" id="btnResetSize"></a>'+
                                                                                                                 '</div>'
                                                                                                 }
                                                                                         ]

_source/plugins/dialog/plugin.js

@@ -442 +442 @@
                 CKEDITOR.skins.load( editor, 'dialog' );
         };
 
+        // Focusable interface. Use it via dialog.addFocusable.
+        function Focusable( dialog, element, index ) {
+                this.element = element;
+                this.focusIndex = index;
+                this.isFocusable = function()
+                {
+                        return true;
+                };
+                this.focus = function()
+                {
+                        dialog._.currentFocusIndex = this.focusIndex;
+                        this.element.focus();
+                };
+                // Bind events
+                element.on( 'keydown', function( e )
+                        {
+                                if ( e.data.getKeystroke() in { 32:1, 13:1 }  )
+                                        this.fire( 'click' );
+                        } );
+                element.on( 'focus', function()
+                        {
+                                this.fire( 'mouseover' );
+                        } );
+                element.on( 'blur', function()
+                        {
+                                this.fire( 'mouseout' );
+                        } );
+        }
+
         CKEDITOR.dialog.prototype =
         {
                 /**
@@ -988 +1017 @@
                 getSelectedElement : function()
                 {
                         return this.getParentEditor().getSelection().getSelectedElement();
-                }
+                },
+
+                /**
+                 * Adds element to dialog's focusable list.
+                 *
+                 * @param {CKEDITOR.dom.element} element
+                 * @param {Number} [index]
+                 */
+                addFocusable: function( element, index ) {
+                        if ( typeof index == 'undefined' )
+                        {
+                                index = this._.focusList.length;
+                                this._.focusList.push( new Focusable( this, element, index ) );
+                        }
+                        else
+                        {
+                                this._.focusList.splice( index, 0, new Focusable( this, element, index ) );
+                                for ( var i = index + 1 ; i < this._.focusList.length ; i++ )
+                                        this._.focusList[ i ].focusIndex++;
+                        }
+                }
         };
 
         CKEDITOR.tools.extend( CKEDITOR.dialog,