{\r
var retval = [];\r
var children = element.getChildren();\r
- for( var i = 0 ; i < children.count() ; i++ )\r
+ for ( var i = 0 ; i < children.count() ; i++ )\r
{\r
var child = children.getItem( i );\r
- if( ! ( child.type === CKEDITOR.NODE_TEXT\r
+ if ( ! ( child.type === CKEDITOR.NODE_TEXT\r
&& ( /^[ \t\n\r]+$/ ).test( child.getText() ) ) )\r
retval.push( child );\r
}\r
delete definition.div;\r
\r
// Exclude 'td' and 'th' when 'wrapping table'\r
- if( editor.config.div_wrapTable )\r
+ if ( editor.config.div_wrapTable )\r
{\r
delete definition.td;\r
delete definition.th;\r
this.foreach( function( field )\r
{\r
// Exclude layout container elements\r
- if( /^(?!vbox|hbox)/.test( field.type ) )\r
+ if ( /^(?!vbox|hbox)/.test( field.type ) )\r
{\r
if ( !field.setup )\r
{\r
var containedBlocks = [], block;\r
\r
// Get all ranges from the selection.\r
- var selection = editor.document.getSelection();\r
- var ranges = selection.getRanges();\r
+ var selection = editor.document.getSelection(),\r
+ ranges = selection.getRanges();\r
var bookmarks = selection.createBookmarks();\r
var i, iterator;\r
\r
var blockTag = editor.config.enterMode == CKEDITOR.ENTER_DIV ? 'div' : 'p';\r
\r
// collect all included elements from dom-iterator\r
- for( i = 0 ; i < ranges.length ; i++ )\r
+ for ( i = 0 ; i < ranges.length ; i++ )\r
{\r
iterator = ranges[ i ].createIterator();\r
- while( ( block = iterator.getNextParagraph() ) )\r
+ while ( ( block = iterator.getNextParagraph() ) )\r
{\r
// include contents of blockLimit elements.\r
- if( block.getName() in divLimitDefinition )\r
+ if ( block.getName() in divLimitDefinition )\r
{\r
var j, childNodes = block.getChildren();\r
for ( j = 0 ; j < childNodes.count() ; j++ )\r
else\r
{\r
// Bypass dtd disallowed elements.\r
- while( !dtd[ block.getName() ] && block.getName() != 'body' )\r
+ while ( !dtd[ block.getName() ] && block.getName() != 'body' )\r
block = block.getParent();\r
addSafely( containedBlocks, block, database );\r
}\r
var blockGroups = groupByDivLimit( containedBlocks );\r
var ancestor, blockEl, divElement;\r
\r
- for( i = 0 ; i < blockGroups.length ; i++ )\r
+ for ( i = 0 ; i < blockGroups.length ; i++ )\r
{\r
var currentNode = blockGroups[ i ][ 0 ];\r
\r
divElement = new CKEDITOR.dom.element( 'div', editor.document );\r
\r
// Normalize the blocks in each group to a common parent.\r
- for( j = 0; j < blockGroups[ i ].length ; j++ )\r
+ for ( j = 0; j < blockGroups[ i ].length ; j++ )\r
{\r
currentNode = blockGroups[ i ][ j ];\r
\r
- while( !currentNode.getParent().equals( ancestor ) )\r
+ while ( !currentNode.getParent().equals( ancestor ) )\r
currentNode = currentNode.getParent();\r
\r
// This could introduce some duplicated elements in array.\r
return groups;\r
}\r
\r
+ // Synchronous field values to other impacted fields is required, e.g. div styles\r
+ // change should also alter inline-style text.\r
+ function commitInternally( targetFields )\r
+ {\r
+ var dialog = this.getDialog(),\r
+ element = dialog._element && dialog._element.clone()\r
+ || new CKEDITOR.dom.element( 'div', editor.document );\r
+\r
+ // Commit this field and broadcast to target fields.\r
+ this.commit( element, true );\r
+\r
+ targetFields = [].concat( targetFields );\r
+ var length = targetFields.length, field;\r
+ for ( var i = 0; i < length; i++ )\r
+ {\r
+ field = dialog.getContentElement.apply( dialog, targetFields[ i ].split( ':' ) );\r
+ field && field.setup && field.setup( element, true );\r
+ }\r
+ }\r
+\r
+\r
+ // Registered 'CKEDITOR.style' instances.\r
+ var styles = {} ;\r
/**\r
* Hold a collection of created block container elements.\r
*/\r
style :'width: 100%;',\r
label :editor.lang.div.styleSelectLabel,\r
'default' : '',\r
- items : [],\r
+ // Options are loaded dynamically.\r
+ items :\r
+ [\r
+ [ editor.lang.common.notSet , '' ]\r
+ ],\r
+ onChange : function()\r
+ {\r
+ commitInternally.call( this, [ 'info:class', 'advanced:dir', 'advanced:style' ] );\r
+ },\r
setup : function( element )\r
{\r
- this.setValue( element.$.style.cssText || '' );\r
+ for ( var name in styles )\r
+ styles[ name ].checkElementRemovable( element, true ) && this.setValue( name );\r
},\r
commit: function( element )\r
{\r
- if ( this.getValue() )\r
- element.$.style.cssText = this.getValue();\r
- else\r
- element.removeAttribute( 'style' );\r
+ var styleName;\r
+ if ( ( styleName = this.getValue() ) )\r
+ {\r
+ var style = styles[ styleName ];\r
+ var customData = element.getCustomData( 'elementStyle' ) || '';\r
+\r
+ style.applyToObject( element );\r
+ element.setCustomData( 'elementStyle', customData + style._.definition.attributes.style );\r
+ }\r
}\r
},\r
{\r
id :'style',\r
style :'width: 100%;',\r
label :editor.lang.common.cssStyle,\r
- 'default' : ''\r
+ 'default' : '',\r
+ commit : function( element )\r
+ {\r
+ // Merge with 'elementStyle', which is of higher priority.\r
+ var merged = this.getValue() + ( element.getCustomData( 'elementStyle' ) || '' );\r
+ element.setAttribute( 'style', merged );\r
+ }\r
}\r
]\r
},\r
'default' : '',\r
items :\r
[\r
+ [ editor.lang.common.notSet , '' ],\r
[\r
editor.lang.common.langDirLtr,\r
'ltr'\r
],\r
onLoad : function()\r
{\r
- setupFields.call(this);\r
+ setupFields.call( this );\r
+\r
+ // Preparing for the 'elementStyle' field.\r
+ var dialog = this,\r
+ stylesField = this.getContentElement( 'info', 'elementStyle' );\r
+\r
+ // Reuse the 'stylescombo' plugin's styles definition.\r
+ editor.getStylesSet( function( stylesDefinitions )\r
+ {\r
+ var styleName;\r
+\r
+ if ( stylesDefinitions )\r
+ {\r
+ // Digg only those styles that apply to 'div'.\r
+ for ( var i = 0 ; i < stylesDefinitions.length ; i++ )\r
+ {\r
+ var styleDefinition = stylesDefinitions[ i ];\r
+ if ( styleDefinition.element && styleDefinition.element == 'div' )\r
+ {\r
+ styleName = styleDefinition.name;\r
+ styles[ styleName ] = new CKEDITOR.style( styleDefinition );\r
+\r
+ // Populate the styles field options with style name.\r
+ stylesField.items.push( [ styleName, styleName ] );\r
+ stylesField.add( styleName, styleName );\r
+ }\r
+ }\r
+ }\r
+\r
+ // We should disable the content element\r
+ // it if no options are available at all.\r
+ stylesField[ stylesField.items.length > 1 ? 'enable' : 'disable' ]();\r
+\r
+ // Now setup the field value manually.\r
+ setTimeout( function() { stylesField.setup( dialog._element ); }, 0 );\r
+ } );\r
},\r
onShow : function()\r
{\r
},\r
onOk : function()\r
{\r
- if( command == 'editdiv' )\r
+ if ( command == 'editdiv' )\r
containers = [ this._element ];\r
else\r
containers = createDiv( editor, true );\r
\r
// Update elements attributes\r
- for( var i = 0 ; i < containers.length ; i++ )\r
+ var size = containers.length;\r
+ for ( var i = 0; i < size; i++ )\r
+ {\r
this.commitContent( containers[ i ] );\r
+\r
+ // Remove empty 'style' attribute.\r
+ !containers[ i ].getAttribute( 'style' ) && containers[ i ].removeAttribute( 'style' );\r
+ }\r
+\r
this.hide();\r
+ },\r
+ onHide : function()\r
+ {\r
+ // Remove style only when editing existing DIV. (#6315)\r
+ if ( command == 'editdiv' )\r
+ this._element.removeCustomData( 'elementStyle' );\r
+ delete this._element;\r
}\r
};\r
}\r
Got questions, comments, patches, etc.? Contact Jason Woofenden