Ticket #7430: 7430.patch

_source/plugins/justify/plugin.js

@@ -11 +11 @@
 {
         function getState( editor, path )
         {
+                var sel = editor.getSelection();
+                
+                // Per element/object alignment application.
+                if ( sel.getType() == CKEDITOR.SELECTION_ELEMENT )
+                {
+                        var selected = sel.getSelectedElement(),
+                                tag = selected.getName();
+
+                        var fake,
+                                isFake = selected.data( 'cke-real-element-type' );
+
+                        // Is selected a fake object?
+                        if ( isFake )
+                        {
+                                fake = selected;
+                                selected = editor.restoreRealElement( selected );
+                                tag = selected.getName();
+                        }
+
+                        var stater = stateFuncs[ usefloat[ tag ] ? 'float' : useAlign[ tag ] ? 'align' : '' ];
+                        if ( stater )
+                                return stater.call( this, selected );
+                }
+
                 var firstBlock = path.block || path.blockLimit;
 
                 if ( !firstBlock || firstBlock.getName() == 'body' )
@@ -135 +159 @@
                 }
         }
 
+        // Map abstract alignments to actual styles,
+        // e.g. left alignment will apply on image element as style="float: left",
+        // while when it get applied on table element, align="left" is used instead.
+        // Note: Thus certain alignment like center/justify might not be available
+        // on the target element so will be disabled.
+        var usefloat = { 'img' : 1 },
+                useAlign = { 'table' : 1, 'cke:object' : 1 },
+                applyFuncs =
+                {
+                        'float': function( element )
+                        {
+                                this.state == CKEDITOR.TRISTATE_OFF ?
+                                        element.setStyle( 'float', this.value )
+                                        : element.removeStyle( 'float' );
+                        },
+                        'align' : function( element )
+                        {
+                                this.state == CKEDITOR.TRISTATE_OFF ?
+                                        element.setAttribute( 'align', this.value )
+                                        : element.removeAttribute( 'align' );
+                        }
+                },
+                stateFuncs =
+                {
+                        'float': function( element )
+                        {
+                                if ( /left|right/.test( this.value ) )
+                                        return element.getStyle( 'float' ) == this.value ? CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF;
+
+                                return CKEDITOR.TRISTATE_DISABLED;
+                        },
+                        'align' : function( element )
+                        {
+                                if ( /left|right|center/.test( this.value )
+                                                && ( this.value != 'center' || element.getName() in CKEDITOR.dtd.$block ) )             // Value 'center' is not available for inline elements.
+                                        return element.getAttribute( 'align' ) == this.value ? CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF;
+
+                                return CKEDITOR.TRISTATE_DISABLED;
+                        }
+                };
+
         justifyCommand.prototype = {
                 exec : function( editor )
                 {
@@ -144 +209 @@
                         if ( !selection )
                                 return;
 
+                        // Per element/object alignment application.
+                        if ( selection.getType() == CKEDITOR.SELECTION_ELEMENT )
+                        {
+                                var selected = selection.getSelectedElement(),
+                                        tag = selected.getName();
+
+                                var fake,
+                                        isFake = selected.data( 'cke-real-element-type' );
+
+                                // Is selected a fake object?
+                                if ( isFake )
+                                {
+                                        fake = selected;
+                                        selected = editor.restoreRealElement( selected );
+                                        tag = selected.getName();
+                                }
+
+                                var applier = applyFuncs[ usefloat[ tag ] ? 'float' : useAlign[ tag ] ? 'align' : '' ];
+                                applier && applier.call( this, selected );
+
+                                // Emulate alignment on fake object.
+                                if ( isFake )
+                                {
+                                        editor.updateFakeElement( fake, selected );
+                                        applyFuncs[ 'align' ].call( this, fake );
+                                }
+
+                                return;
+                        }
+
                         var bookmarks = selection.createBookmarks(),
                                 ranges = selection.getRanges( true );
 

_source/plugins/fakeobjects/plugin.js

@@ -85 +85 @@
         return this.document.createElement( 'img', { attributes : attributes } );
 };
 
+CKEDITOR.editor.prototype.updateFakeElement = function( fakeElement, realElement )
+{
+        fakeElement.data( 'cke-realelement', encodeURIComponent( realElement.getOuterHtml() ) );
+};
+
 CKEDITOR.editor.prototype.createFakeParserElement = function( realElement, className, realElementType, isResizable )
 {
         var lang = this.lang.fakeobjects,