Update ckeditor to version 3.2.1

[gopost.git] / ckeditor / _source / plugins / div / dialogs / div.js

/*
 * 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;
 */