Changeset 5784

Timestamp:

08/02/10 20:36:50 (3 years ago)

Author:

fredck

Message:

#6082 : Introduce the useComputedState setting.

Location:

CKEditor/branches/versions/3.4.x

Files:

• CHANGES.html (modified) (1 diff)
• _source/core/config.js (modified) (1 diff)
• _source/plugins/bidi/plugin.js (modified) (3 diffs)
• _source/plugins/justify/plugin.js (modified) (5 diffs)

CKEditor/branches/versions/3.4.x/CHANGES.html

@@ -46 +46 @@
                 <li><a href="http://dev.fckeditor.net/ticket/5737">#5737</a> : Added support for the <a href="http://www.w3.org/TR/html5/editing.html#contenteditable">HTML5 contenteditable attribute</a>, making it possible to define read only regions into the editor contents.</li>
                 <li><a href="http://dev.fckeditor.net/ticket/5418">#5418</a> : New "Advanced" tab introduced for tables. It's based on the new dialogadvtab plugin.</li>
+                <li><a href="http://dev.fckeditor.net/ticket/6082">#6082</a> : Introduce the <a href="http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.useComputedState">useComputedState</a> setting, making it possible to control whether toolbar features, like alignment and direction, should reflect the "computed" selection states, even when the effective feature value is not applied.</li>
         </ul>
         <p>

CKEditor/branches/versions/3.4.x/_source/core/config.js

@@ -331 +331 @@
 };
 
+/**
+ * Indicates that some of the editor features, like alignement and text
+ * direction, should used the "computed value" of the feature to indicate it's
+ * on/off state, instead of using the "real value".
+ *
+ * If enabled, in a left to right written document, the "Left Justify"
+ * alignment button will show as active, even if the aligment style is not
+ * explicitly applied to the current paragraph in the editor.
+ * @name CKEDITOR.config.useComputedState
+ * @type Boolean
+ * @default true
+ * @since 3.4
+ * @example
+ * config.useComputedState = false;
+ */
+
 // PACKAGER_RENAME( CKEDITOR.config )

CKEditor/branches/versions/3.4.x/_source/plugins/bidi/plugin.js

@@ -18 +18 @@
         function getState( editor, path, dir )
         {
-                var selection = editor.getSelection(),
-                        ranges = selection.getRanges();
-
-                var selectedElement = ranges && ranges[ 0 ].getEnclosedNode();
-
-                // If this is not our element of interest, apply to fully selected elements from guardElements.
-                if ( !selectedElement || selectedElement
-                                && !( selectedElement.type == CKEDITOR.NODE_ELEMENT && selectedElement.getName() in directSelectionGuardElements )
-                        )
-                        selectedElement = getFullySelected( selection, guardElements );
+                var useComputedState = editor.config.useComputedState,
+                        selectedElement;
+
+                useComputedState = useComputedState === undefined || useComputedState;
+
+                if ( useComputedState )
+                {
+                        var selection = editor.getSelection(),
+                                ranges = selection.getRanges();
+
+                        selectedElement = ranges && ranges[ 0 ].getEnclosedNode();
+
+                        // If this is not our element of interest, apply to fully selected elements from guardElements.
+                        if ( !selectedElement || selectedElement
+                                        && !( selectedElement.type == CKEDITOR.NODE_ELEMENT && selectedElement.getName() in directSelectionGuardElements )
+                                )
+                                selectedElement = getFullySelected( selection, guardElements );
+                }
 
                 selectedElement = selectedElement || path.block || path.blockLimit;
@@ -34 +42 @@
                         return CKEDITOR.TRISTATE_OFF;
 
-                return ( selectedElement.getComputedStyle( 'direction' ) == dir ) ?
+                selectedElement = useComputedState ?
+                        selectedElement.getComputedStyle( 'direction' ) :
+                        selectedElement.getStyle( 'direction' ) || selectedElement.getAttribute( 'dir' );
+
+                return ( selectedElement == dir ) ?
                         CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF;
         }
@@ -40 +52 @@
         function switchDir( element, dir, editor )
         {
-                var dirBefore = element.getComputedStyle( 'direction' );
-
-                if ( element.hasAttribute( 'dir' ) && element.getAttribute( 'dir' ).toLowerCase() == dir )
+                var dirBefore = element.getComputedStyle( 'direction' ),
+                        currentDir = element.getStyle( 'direction' ) || element.getAttribute( 'dir' ) || '';
+
+                element.removeStyle( 'direction' );
+
+                if ( currentDir.toLowerCase() == dir )
                         element.removeAttribute( 'dir' );
                 else

CKEditor/branches/versions/3.4.x/_source/plugins/justify/plugin.js

@@ -10 +10 @@
 (function()
 {
-        var alignRemoveRegex = /(-moz-|-webkit-|start|auto)/i;
-
         function getState( editor, path )
         {
@@ -19 +17 @@
                         return CKEDITOR.TRISTATE_OFF;
 
-                var currentAlign = firstBlock.getComputedStyle( 'text-align' ).replace( alignRemoveRegex, '' );
-                if ( ( !currentAlign && isDefaultAlign( this, firstBlock ) ) || currentAlign == this.value )
-                        return CKEDITOR.TRISTATE_ON;
-                return CKEDITOR.TRISTATE_OFF;
+                return ( getAlignment( firstBlock, editor.config.useComputedState ) == this.value ) ? 
+                        CKEDITOR.TRISTATE_ON : 
+                        CKEDITOR.TRISTATE_OFF;
+        }
+
+        function getAlignment( element, useComputedState )
+        {
+                useComputedState = useComputedState === undefined || useComputedState;
+
+                var align = useComputedState ?
+                        element.getComputedStyle( 'text-align' ) :
+                        element.getStyle( 'text-align' ) || element.getAttribute( 'align' ) || '';
+
+                align && ( align = align.replace( /-moz-|-webkit-|start|auto/i, '' ) );
+
+                !align && useComputedState && ( align = element.getComputedStyle( 'direction' ) == 'rtl' ? 'right' : 'left' );
+
+                return align;
         }
 
@@ -30 +42 @@
                 command.state = getState.call( this, evt.editor, evt.data.path );
                 command.fire( 'state' );
-        }
-
-        function isDefaultAlign( command, element )
-        {
-                var direction = element.getComputedStyle( 'direction' ),
-                        val = command.value;
-                return ( direction == 'rtl' && val == 'right' ) || ( direction == 'ltr' && val == 'left' );
-
         }
 
@@ -80 +84 @@
                                 ranges = selection.getRanges( true );
 
-
                         var cssClassName = this.cssClassName,
                                 iterator,
                                 block;
+
+                        var useComputedState = editor.config.useComputedState;
+                        useComputedState = useComputedState === undefined || useComputedState;
+
                         for ( var i = ranges.length - 1 ; i >= 0 ; i-- )
                         {
@@ -92 +99 @@
                                 {
                                         block.removeAttribute( 'align' );
+                                        block.removeStyle( 'text-align' );
 
-                                        var isDefault = isDefaultAlign( this, block );
+                                        // Remove any of the alignment classes from the className.
+                                        var className = cssClassName && ( block.$.className =
+                                                CKEDITOR.tools.ltrim( block.$.className.replace( this.cssClassRegex, '' ) ) );
+
+                                        var apply =
+                                                ( this.state == CKEDITOR.TRISTATE_OFF ) &&
+                                                ( !useComputedState || ( getAlignment( block, true ) != this.value ) );
 
                                         if ( cssClassName )
                                         {
-                                                // Remove any of the alignment classes from the className.
-                                                var className = block.$.className =
-                                                        CKEDITOR.tools.ltrim( block.$.className.replace( this.cssClassRegex, '' ) );
-
                                                 // Append the desired class name.
-                                                if ( this.state == CKEDITOR.TRISTATE_OFF && !isDefault )
+                                                if ( apply )
                                                         block.addClass( cssClassName );
                                                 else if ( !className )
                                                         block.removeAttribute( 'class' );
                                         }
-                                        else
-                                        {
-                                                if ( this.state == CKEDITOR.TRISTATE_OFF && !isDefault )
-                                                        block.setStyle( 'text-align', this.value );
-                                                else
-                                                        block.removeStyle( 'text-align' );
-                                        }
+                                        else if ( apply )
+                                                block.setStyle( 'text-align', this.value );
                                 }