ckeditor 3.2.1

data/lib/generators/templates/ckeditor/_source/plugins/div/dialogs/div.js

@@ -0,0 +1,529 @@
+/*
+ * Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.html or http://ckeditor.com/license
+ */
+
+(function()
+{
+
+	/**
+	 * Add to collection with DUP examination.
+	 * @param {Object} collection
+	 * @param {Object} element
+	 * @param {Object} database
+	 */
+	function addSafely( collection, element, database )
+	{
+		// 1. IE doesn't support customData on text nodes;
+		// 2. Text nodes never get chance to appear twice;
+		if ( !element.is || !element.getCustomData( 'block_processed' ) )
+		{
+			element.is && CKEDITOR.dom.element.setMarker( database, element, 'block_processed', true );
+			collection.push( element );
+		}
+	}
+
+	function getNonEmptyChildren( element )
+	{
+		var retval = [];
+		var children = element.getChildren();
+		for ( var i = 0 ; i < children.count() ; i++ )
+		{
+			var child = children.getItem( i );
+			if ( ! ( child.type === CKEDITOR.NODE_TEXT
+				&& ( /^[ \t\n\r]+$/ ).test( child.getText() ) ) )
+				retval.push( child );
+		}
+		return retval;
+	}
+
+
+	/**
+	 * Dialog reused by both 'creatediv' and 'editdiv' commands.
+	 * @param {Object} editor
+	 * @param {String} command	The command name which indicate what the current command is.
+	 */
+	function divDialog( editor, command )
+	{
+		// Definition of elements at which div operation should stopped.
+		var divLimitDefinition = ( function(){
+
+			// Customzie from specialize blockLimit elements
+			var definition = CKEDITOR.tools.extend( {}, CKEDITOR.dtd.$blockLimit );
+
+			// Exclude 'div' itself.
+			delete definition.div;
+
+			// Exclude 'td' and 'th' when 'wrapping table'
+			if ( editor.config.div_wrapTable )
+			{
+				delete definition.td;
+				delete definition.th;
+			}
+			return definition;
+		})();
+
+		// DTD of 'div' element
+		var dtd = CKEDITOR.dtd.div;
+
+		/**
+		 * Get the first div limit element on the element's path.
+		 * @param {Object} element
+		 */
+		function getDivLimitElement( element )
+		{
+			var pathElements = new CKEDITOR.dom.elementPath( element ).elements;
+			var divLimit;
+			for ( var i = 0; i < pathElements.length ; i++ )
+			{
+				if ( pathElements[ i ].getName() in divLimitDefinition )
+				{
+					divLimit = pathElements[ i ];
+					break;
+				}
+			}
+			return divLimit;
+		}
+
+		/**
+		 * Init all fields' setup/commit function.
+		 * @memberof divDialog
+		 */
+		function setupFields()
+		{
+			this.foreach( function( field )
+			{
+				// Exclude layout container elements
+				if ( /^(?!vbox|hbox)/.test( field.type ) )
+				{
+					if ( !field.setup )
+					{
+						// Read the dialog fields values from the specified
+						// element attributes.
+						field.setup = function( element )
+						{
+							field.setValue( element.getAttribute( field.id ) || '' );
+						};
+					}
+					if ( !field.commit )
+					{
+						// Set element attributes assigned by the dialog
+						// fields.
+						field.commit = function( element )
+						{
+							var fieldValue = this.getValue();
+							// ignore default element attribute values
+							if ( 'dir' == field.id && element.getComputedStyle( 'direction' ) == fieldValue )
+								return;
+
+							if ( fieldValue )
+								element.setAttribute( field.id, fieldValue );
+							else
+								element.removeAttribute( field.id );
+						};
+					}
+				}
+			} );
+		}
+
+		/**
+		 * Wrapping 'div' element around appropriate blocks among the selected ranges.
+		 * @param {Object} editor
+		 */
+		function createDiv( editor )
+		{
+			// new adding containers OR detected pre-existed containers.
+			var containers = [];
+			// node markers store.
+			var database = {};
+			// All block level elements which contained by the ranges.
+			var containedBlocks = [], block;
+
+			// Get all ranges from the selection.
+			var selection = editor.document.getSelection();
+			var ranges = selection.getRanges();
+			var bookmarks = selection.createBookmarks();
+			var i, iterator;
+
+			// Calcualte a default block tag if we need to create blocks.
+			var blockTag = editor.config.enterMode == CKEDITOR.ENTER_DIV ? 'div' : 'p';
+
+			// collect all included elements from dom-iterator
+			for ( i = 0 ; i < ranges.length ; i++ )
+			{
+				iterator = ranges[ i ].createIterator();
+				while ( ( block = iterator.getNextParagraph() ) )
+				{
+					// include contents of blockLimit elements.
+					if ( block.getName() in divLimitDefinition )
+					{
+						var j, childNodes = block.getChildren();
+						for ( j = 0 ; j < childNodes.count() ; j++ )
+							addSafely( containedBlocks, childNodes.getItem( j ) , database );
+					}
+					else
+					{
+						// Bypass dtd disallowed elements.
+						while ( !dtd[ block.getName() ] && block.getName() != 'body' )
+							block = block.getParent();
+						addSafely( containedBlocks, block, database );
+					}
+				}
+			}
+
+			CKEDITOR.dom.element.clearAllMarkers( database );
+
+			var blockGroups = groupByDivLimit( containedBlocks );
+			var ancestor, blockEl, divElement;
+
+			for ( i = 0 ; i < blockGroups.length ; i++ )
+			{
+				var currentNode = blockGroups[ i ][ 0 ];
+
+				// Calculate the common parent node of all contained elements.
+				ancestor = currentNode.getParent();
+				for ( j = 1 ; j < blockGroups[ i ].length; j++ )
+					ancestor = ancestor.getCommonAncestor( blockGroups[ i ][ j ] );
+
+				divElement = new CKEDITOR.dom.element( 'div', editor.document );
+
+				// Normalize the blocks in each group to a common parent.
+				for ( j = 0; j < blockGroups[ i ].length ; j++ )
+				{
+					currentNode = blockGroups[ i ][ j ];
+
+					while ( !currentNode.getParent().equals( ancestor ) )
+						currentNode = currentNode.getParent();
+
+					// This could introduce some duplicated elements in array.
+					blockGroups[ i ][ j ] = currentNode;
+				}
+
+				// Wrapped blocks counting
+				var fixedBlock = null;
+				for ( j = 0 ; j < blockGroups[ i ].length ; j++ )
+				{
+					currentNode = blockGroups[ i ][ j ];
+
+					// Avoid DUP elements introduced by grouping.
+					if ( !( currentNode.getCustomData && currentNode.getCustomData( 'block_processed' ) ) )
+					{
+						currentNode.is && CKEDITOR.dom.element.setMarker( database, currentNode, 'block_processed', true );
+
+						// Establish new container, wrapping all elements in this group.
+						if ( !j )
+							divElement.insertBefore( currentNode );
+
+						divElement.append( currentNode );
+					}
+				}
+
+				CKEDITOR.dom.element.clearAllMarkers( database );
+				containers.push( divElement );
+			}
+
+			selection.selectBookmarks( bookmarks );
+			return containers;
+		}
+
+		function getDiv( editor )
+		{
+			var path = new CKEDITOR.dom.elementPath( editor.getSelection().getStartElement() ),
+				blockLimit = path.blockLimit,
+				div = blockLimit && blockLimit.getAscendant( 'div', true );
+			return div;
+		}
+		/**
+		 * Divide a set of nodes to different groups by their path's blocklimit element.
+		 * Note: the specified nodes should be in source order naturally, which mean they are supposed to producea by following class:
+		 *  * CKEDITOR.dom.range.Iterator
+		 *  * CKEDITOR.dom.domWalker
+		 *  @return {Array []} the grouped nodes
+		 */
+		function groupByDivLimit( nodes )
+		{
+			var groups = [],
+				lastDivLimit = null,
+				path, block;
+			for ( var i = 0 ; i < nodes.length ; i++ )
+			{
+				block = nodes[i];
+				var limit = getDivLimitElement( block );
+				if ( !limit.equals( lastDivLimit ) )
+				{
+					lastDivLimit = limit ;
+					groups.push( [] ) ;
+				}
+				groups[ groups.length - 1 ].push( block ) ;
+			}
+			return groups;
+		}
+
+		// Synchronous field values to other impacted fields is required, e.g. div styles
+		// change should also alter inline-style text.
+		function commitInternally( targetFields )
+		{
+			var dialog = this.getDialog(),
+				 element = dialog._element && dialog._element.clone()
+						 || new CKEDITOR.dom.element( 'div', editor.document );
+
+			// Commit this field and broadcast to target fields.
+			this.commit( element, true );
+
+			targetFields = [].concat( targetFields );
+			var length = targetFields.length, field;
+			for ( var i = 0; i < length; i++ )
+			{
+				field = dialog.getContentElement.apply( dialog, targetFields[ i ].split( ':' ) );
+				field && field.setup && field.setup( element, true );
+			}
+		}
+
+
+		// Registered 'CKEDITOR.style' instances.
+		var styles = {} ;
+		/**
+		 * Hold a collection of created block container elements.
+		 */
+		var containers = [];
+		/**
+		 * @type divDialog
+		 */
+		return {
+			title : editor.lang.div.title,
+			minWidth : 400,
+			minHeight : 165,
+			contents :
+			[
+			{
+				id :'info',
+				label :editor.lang.common.generalTab,
+				title :editor.lang.common.generalTab,
+				elements :
+				[
+					{
+						type :'hbox',
+						widths : [ '50%', '50%' ],
+						children :
+						[
+							{
+								id :'elementStyle',
+								type :'select',
+								style :'width: 100%;',
+								label :editor.lang.div.styleSelectLabel,
+								'default' : '',
+								// Options are loaded dynamically.
+								items :
+								[
+									[ editor.lang.common.notSet , '' ]
+								],
+								onChange : function()
+								{
+									commitInternally.call( this, [ 'info:class', 'advanced:dir', 'advanced:style' ] );
+								},
+								setup : function( element )
+								{
+									for ( var name in styles )
+										styles[ name ].checkElementRemovable( element, true ) && this.setValue( name );
+								},
+								commit: function( element )
+								{
+									var styleName;
+									if ( ( styleName = this.getValue() ) )
+										styles[ styleName ].applyToObject( element );
+								}
+							},
+							{
+								id :'class',
+								type :'text',
+								label :editor.lang.common.cssClass,
+								'default' : ''
+							}
+						]
+					}
+				]
+			},
+			{
+					id :'advanced',
+					label :editor.lang.common.advancedTab,
+					title :editor.lang.common.advancedTab,
+					elements :
+					[
+					{
+						type :'vbox',
+						padding :1,
+						children :
+						[
+							{
+								type :'hbox',
+								widths : [ '50%', '50%' ],
+								children :
+								[
+									{
+										type :'text',
+										id :'id',
+										label :editor.lang.common.id,
+										'default' : ''
+									},
+									{
+										type :'text',
+										id :'lang',
+										label :editor.lang.link.langCode,
+										'default' : ''
+									}
+								]
+							},
+							{
+								type :'hbox',
+								children :
+								[
+										{
+											type :'text',
+											id :'style',
+											style :'width: 100%;',
+											label :editor.lang.common.cssStyle,
+											'default' : '',
+											commit : function( element )
+											{
+												// Merge with 'elementStyle', which is of higher priority.
+												var value = this.getValue(),
+														merged = [ value, element.getAttribute( 'style' ) ].join( ';' );
+												value && element.setAttribute( 'style', merged );
+											}
+										}
+								]
+							},
+							{
+								type :'hbox',
+								children :
+								[
+										{
+											type :'text',
+											id :'title',
+											style :'width: 100%;',
+											label :editor.lang.common.advisoryTitle,
+											'default' : ''
+										}
+								]
+							},
+							{
+								type :'select',
+								id :'dir',
+								style :'width: 100%;',
+								label :editor.lang.common.langDir,
+								'default' : '',
+								items :
+								[
+									[ editor.lang.common.notSet , '' ],
+									[
+										editor.lang.common.langDirLtr,
+										'ltr'
+									],
+									[
+										editor.lang.common.langDirRtl,
+										'rtl'
+									]
+								]
+							}
+						]
+					}
+					]
+				}
+			],
+			onLoad : function()
+			{
+				setupFields.call(this);
+
+				// Preparing for the 'elementStyle' field.
+				var dialog = this,
+					 stylesField = this.getContentElement( 'info', 'elementStyle' );
+
+				 // Reuse the 'stylescombo' plugin's styles definition.
+				editor.getStylesSet( function( stylesDefinitions )
+				{
+					var styleName;
+
+					if ( stylesDefinitions )
+					{
+						// Digg only those styles that apply to 'div'.
+						for ( var i = 0 ; i < stylesDefinitions.length ; i++ )
+						{
+							var styleDefinition = stylesDefinitions[ i ];
+							if ( styleDefinition.element && styleDefinition.element == 'div' )
+							{
+								styleName = styleDefinition.name;
+								styles[ styleName ] = new CKEDITOR.style( styleDefinition );
+
+								// Populate the styles field options with style name.
+								stylesField.items.push( [ styleName, styleName ] );
+								stylesField.add( styleName, styleName );
+							}
+						}
+					}
+
+					// We should disable the content element
+					// it if no options are available at all.
+					stylesField[ stylesField.items.length > 1 ? 'enable' : 'disable' ]();
+
+					// Now setup the field value manually.
+					setTimeout( function() { stylesField.setup( dialog._element ); }, 0 );
+				} );
+			},
+			onShow : function()
+			{
+				// Whether always create new container regardless of existed
+				// ones.
+				if ( command == 'editdiv' )
+				{
+					// Try to discover the containers that already existed in
+					// ranges
+					var div = getDiv( editor );
+					// update dialog field values
+					div && this.setupContent( this._element = div );
+				}
+			},
+			onOk : function()
+			{
+				editor.fire( 'saveSnapshot' );
+				if ( command == 'editdiv' )
+					containers = [ this._element ];
+				else
+					containers = createDiv( editor, true );
+
+				// Update elements attributes
+				var size = containers.length;
+				for ( var i = 0; i < size; i++ )
+				{
+					this.commitContent( containers[ i ] );
+
+					// Remove empty 'style' attribute.
+					!containers[ i ].getAttribute( 'style' ) && containers[ i ].removeAttribute( 'style' );
+				}
+				editor.fire( 'saveSnapshot' );
+
+				this.hide();
+			},
+			onHide : function()
+			{
+				delete this._element;
+			}
+		};
+	}
+
+	CKEDITOR.dialog.add( 'creatediv', function( editor )
+		{
+			return divDialog( editor, 'creatediv' );
+		} );
+	CKEDITOR.dialog.add( 'editdiv', function( editor )
+		{
+			return divDialog( editor, 'editdiv' );
+		} );
+} )();
+
+/*
+ * @name CKEDITOR.config.div_wrapTable
+ * Whether to wrap the whole table instead of indivisual cells when created 'div' in table cell.
+ * @type Boolean
+ * @default false
+ * @example config.div_wrapTable = true;
+ */