Changeset 6128


Ignore:
Timestamp:
11/28/2010 02:54:42 AM (4 years ago)
Author:
fredck
Message:

#6103 : It's now possible to control the styling of inline read-only elements with the disableReadonlyStyling setting. It's also possible to avoid inline-styling any element by setting its data-cke-nostyle attribute to "1".

Location:
CKEditor/branches/versions/3.5.x
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • CKEditor/branches/versions/3.5.x/CHANGES.html

    r6127 r6128  
    4545                <li><a href="http://dev.ckeditor.com/ticket/5654">#5654</a> : Added the new placeholder plugin.</li> 
    4646                <li><a href="http://dev.ckeditor.com/ticket/6334">#6334</a> : CKEditor now uses <a href="http://www.w3.org/TR/2010/WD-html5-20101019/elements.html#embedding-custom-non-visible-data-with-the-data-attributes">HTML5's data-* attributes</a> for its internal attributes.</li> 
     47                <li><a href="http://dev.ckeditor.com/ticket/6103">#6103</a> : It's now possible to control the styling of inline read-only elements with the disableReadonlyStyling setting. It's also possible to avoid inline-styling any element by setting its data-cke-nostyle attribute to "1".</li> 
    4748        </ul> 
    4849        <p> 
  • CKEditor/branches/versions/3.5.x/_source/plugins/colorbutton/plugin.js

    r6050 r6128  
    127127 
    128128                                                colorStyle.childRule = type == 'back' ? 
    129                                                         // It's better to apply background color as the innermost style. (#3599) 
    130                                                         function(){ return false; } : 
    131                                                         // Fore color style must be applied inside links instead of around it. 
    132                                                         function( element ){ return element.getName() != 'a'; }; 
     129                                                        function( element ) 
     130                                                        { 
     131                                                                // It's better to apply background color as the innermost style. (#3599) 
     132                                                                // Except for "unstylable elements". (#6103) 
     133                                                                return isUnstylable( element ); 
     134                                                        } 
     135                                                        : 
     136                                                        function( element ) 
     137                                                        { 
     138                                                                // Fore color style must be applied inside links instead of around it. 
     139                                                                return element.getName() != 'a' || isUnstylable( element ); 
     140                                                        }; 
    133141 
    134142                                                new CKEDITOR.style( colorStyle, { color : color } ).apply( editor.document ); 
     
    208216                        return output.join( '' ); 
    209217                } 
     218 
     219                function isUnstylable( ele ) 
     220                { 
     221                        return ( ele.getAttribute( 'contentEditable' ) == 'false' ) || ele.getAttribute( 'data-cke-nostyle' ); 
     222                } 
    210223        } 
    211224}); 
  • CKEditor/branches/versions/3.5.x/_source/plugins/styles/plugin.js

    r6126 r6128  
    66CKEDITOR.plugins.add( 'styles', 
    77{ 
    8         requires : [ 'selection' ] 
     8        requires : [ 'selection' ], 
     9        init : function( editor ) 
     10        { 
     11                // This doesn't look like correct, but it's the safest way to proper 
     12                // pass the disableReadonlyStyling configuration to the style system 
     13                // without having to change any method signature in the API. (#6103) 
     14                editor.on( 'contentDom', function() 
     15                        { 
     16                                editor.document.setCustomData( 'cke_includeReadonly', !editor.config.disableReadonlyStyling ); 
     17                        }); 
     18        } 
    919}); 
    1020 
     
    354364        }; 
    355365 
     366        // Gets the parent element which blocks the styling for an element. This 
     367        // can be done through read-only elements (contenteditable=false) or 
     368        // elements with the "data-cke-nostyle" attribute. 
     369        function getUnstylableParent( element ) 
     370        { 
     371                var unstylable, 
     372                        editable; 
     373                 
     374                while ( ( element = element.getParent() ) ) 
     375                { 
     376                        if ( element.getName() == 'body' ) 
     377                                break; 
     378 
     379                        if ( element.getAttribute( 'data-cke-nostyle' ) ) 
     380                                unstylable = element; 
     381                        else if ( !editable ) 
     382                        { 
     383                                var contentEditable = element.getAttribute( 'contentEditable' ); 
     384 
     385                                if ( contentEditable == 'false' ) 
     386                                        unstylable = element; 
     387                                else if ( contentEditable == 'true' ) 
     388                                        editable = 1; 
     389                        } 
     390                } 
     391 
     392                return unstylable; 
     393        } 
     394 
    356395        function applyInlineStyle( range ) 
    357396        { 
     
    375414                var def = this._.definition; 
    376415                var isUnknownElement; 
     416 
     417                // Indicates that fully selected read-only elements are to be included in the styling range. 
     418                var includeReadonly = def.includeReadonly; 
     419                 
     420                // If the read-only inclusion is not available in the definition, try 
     421                // to get it from the document data. 
     422                if ( includeReadonly == undefined ) 
     423                        includeReadonly = document.getCustomData( 'cke_includeReadonly' ); 
    377424 
    378425                // Get the DTD definition for the element. Defaults to "span". 
     
    393440                var styleRange; 
    394441 
     442                // Check if the boundaries are inside non stylable elements. 
     443                var firstUnstylable = getUnstylableParent( firstNode ), 
     444                        lastUnstylable = getUnstylableParent( lastNode ); 
     445 
     446                // If the first element can't be styled, we'll start processing right 
     447                // after its unstylable root. 
     448                if ( firstUnstylable ) 
     449                        currentNode = firstUnstylable.getNextSourceNode( true );                         
     450 
     451                // If the last element can't be styled, we'll stop processing on its 
     452                // unstylable root. 
     453                if ( lastUnstylable ) 
     454                        lastNode = lastUnstylable; 
     455 
     456                // Do nothing if the current node now follows the last node to be processed. 
     457                if ( currentNode.getPosition( lastNode ) == CKEDITOR.POSITION_FOLLOWING ) 
     458                        currentNode = 0; 
     459 
    395460                while ( currentNode ) 
    396461                { 
     
    406471                                var nodeType = currentNode.type; 
    407472                                var nodeName = nodeType == CKEDITOR.NODE_ELEMENT ? currentNode.getName() : null; 
     473                                var nodeIsReadonly = nodeName && ( currentNode.getAttribute( 'contentEditable' ) == 'false' ); 
     474                                var nodeIsNoStyle = nodeName && currentNode.getAttribute( 'data-cke-nostyle' ); 
    408475 
    409476                                if ( nodeName && currentNode.data( 'cke-bookmark' ) ) 
     
    415482                                // Check if the current node can be a child of the style element. 
    416483                                if ( !nodeName || ( dtd[ nodeName ] 
     484                                        && !nodeIsNoStyle 
     485                                        && ( !nodeIsReadonly || includeReadonly ) 
    417486                                        && ( currentNode.getPosition( lastNode ) | CKEDITOR.POSITION_PRECEDING | CKEDITOR.POSITION_IDENTICAL | CKEDITOR.POSITION_IS_CONTAINED ) == ( CKEDITOR.POSITION_PRECEDING + CKEDITOR.POSITION_IDENTICAL + CKEDITOR.POSITION_IS_CONTAINED ) 
    418487                                        && ( !def.childRule || def.childRule( currentNode ) ) ) ) 
     
    436505                                                } 
    437506 
    438                                                 // Non element nodes, or empty elements can be added 
    439                                                 // completely to the range. 
    440                                                 if ( nodeType == CKEDITOR.NODE_TEXT || ( nodeType == CKEDITOR.NODE_ELEMENT && !currentNode.getChildCount() ) ) 
     507                                                // Non element nodes, readonly elements, or empty 
     508                                                // elements can be added completely to the range. 
     509                                                if ( nodeType == CKEDITOR.NODE_TEXT || nodeIsReadonly || ( nodeType == CKEDITOR.NODE_ELEMENT && !currentNode.getChildCount() ) ) 
    441510                                                { 
    442511                                                        var includedNode = currentNode; 
     
    462531                                                        if ( !includedNode.$.nextSibling ) 
    463532                                                                applyStyle = true; 
    464  
    465533                                                } 
    466534                                        } 
     
    472540 
    473541                                // Get the next node to be processed. 
    474                                 currentNode = currentNode.getNextSourceNode(); 
     542                                currentNode = currentNode.getNextSourceNode( nodeIsNoStyle || nodeIsReadonly ); 
    475543                        } 
    476544 
     
    13561424                        // Bookmark the range so we can re-select it after processing. 
    13571425                        bookmarks = selection.createBookmarks( 1 ), 
    1358                         ranges = selection.getRanges( 1 ), 
     1426                        ranges = selection.getRanges(), 
    13591427                        func = remove ? this.removeFromRange : this.applyToRange, 
    13601428                        range; 
     
    14481516                callback( this._.stylesDefinitions ); 
    14491517}; 
     1518 
     1519/** 
     1520 * Indicates that fully selected read-only elements will be included when 
     1521 * applying the style (for inline styles only). 
     1522 * @name CKEDITOR.style.includeReadonly 
     1523 * @type Boolean 
     1524 * @default false 
     1525 * @since 3.5 
     1526 */ 
     1527 
     1528 /** 
     1529  * Disables inline styling on read-only elements. 
     1530  * @name CKEDITOR.config.disableReadonlyStyling 
     1531  * @type Boolean 
     1532  * @default false 
     1533  * @since 3.5 
     1534  */ 
    14501535 
    14511536/** 
Note: See TracChangeset for help on using the changeset viewer.
© 2003 – 2012 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy