]> git.immae.eu Git - perso/Immae/Projets/packagist/ludivine-ckeditor-component.git/blobdiff - sources/plugins/div/dialogs/div.js
Add audio, color and fonts
[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / plugins / div / dialogs / div.js
diff --git a/sources/plugins/div/dialogs/div.js b/sources/plugins/div/dialogs/div.js
new file mode 100644 (file)
index 0000000..140424f
--- /dev/null
@@ -0,0 +1,430 @@
+/*\r
+ * Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.\r
+ * For licensing, see LICENSE.md or http://ckeditor.com/license\r
+ */\r
+\r
+( function() {\r
+\r
+       // Add to collection with DUP examination.\r
+       // @param {Object} collection\r
+       // @param {Object} element\r
+       // @param {Object} database\r
+       function addSafely( collection, element, database ) {\r
+               // 1. IE doesn't support customData on text nodes;\r
+               // 2. Text nodes never get chance to appear twice;\r
+               if ( !element.is || !element.getCustomData( 'block_processed' ) ) {\r
+                       element.is && CKEDITOR.dom.element.setMarker( database, element, 'block_processed', true );\r
+                       collection.push( element );\r
+               }\r
+       }\r
+\r
+       // Dialog reused by both 'creatediv' and 'editdiv' commands.\r
+       // @param {Object} editor\r
+       // @param {String} command      The command name which indicate what the current command is.\r
+       function divDialog( editor, command ) {\r
+               // Definition of elements at which div operation should stopped.\r
+               var divLimitDefinition = ( function() {\r
+\r
+                       // Customzie from specialize blockLimit elements\r
+                       var definition = CKEDITOR.tools.extend( {}, CKEDITOR.dtd.$blockLimit );\r
+\r
+                       if ( editor.config.div_wrapTable ) {\r
+                               delete definition.td;\r
+                               delete definition.th;\r
+                       }\r
+                       return definition;\r
+               } )();\r
+\r
+               // DTD of 'div' element\r
+               var dtd = CKEDITOR.dtd.div;\r
+\r
+               // Get the first div limit element on the element's path.\r
+               // @param {Object} element\r
+               function getDivContainer( element ) {\r
+                       var container = editor.elementPath( element ).blockLimit;\r
+\r
+                       // Never consider read-only (i.e. contenteditable=false) element as\r
+                       // a first div limit (#11083).\r
+                       if ( container.isReadOnly() )\r
+                               container = container.getParent();\r
+\r
+                       // Dont stop at 'td' and 'th' when div should wrap entire table.\r
+                       if ( editor.config.div_wrapTable && container.is( [ 'td', 'th' ] ) ) {\r
+                               var parentPath = editor.elementPath( container.getParent() );\r
+                               container = parentPath.blockLimit;\r
+                       }\r
+\r
+                       return container;\r
+               }\r
+\r
+               // Init all fields' setup/commit function.\r
+               // @memberof divDialog\r
+               function setupFields() {\r
+                       this.foreach( function( field ) {\r
+                               // Exclude layout container elements\r
+                               if ( /^(?!vbox|hbox)/.test( field.type ) ) {\r
+                                       if ( !field.setup ) {\r
+                                               // Read the dialog fields values from the specified\r
+                                               // element attributes.\r
+                                               field.setup = function( element ) {\r
+                                                       field.setValue( element.getAttribute( field.id ) || '', 1 );\r
+                                               };\r
+                                       }\r
+                                       if ( !field.commit ) {\r
+                                               // Set element attributes assigned by the dialog\r
+                                               // fields.\r
+                                               field.commit = function( element ) {\r
+                                                       var fieldValue = this.getValue();\r
+                                                       // ignore default element attribute values\r
+                                                       if ( field.id == 'dir' && element.getComputedStyle( 'direction' ) == fieldValue ) {\r
+                                                               return;\r
+                                                       }\r
+\r
+                                                       if ( fieldValue )\r
+                                                               element.setAttribute( field.id, fieldValue );\r
+                                                       else\r
+                                                               element.removeAttribute( field.id );\r
+                                               };\r
+                                       }\r
+                               }\r
+                       } );\r
+               }\r
+\r
+               // Wrapping 'div' element around appropriate blocks among the selected ranges.\r
+               // @param {Object} editor\r
+               function createDiv( editor ) {\r
+                       // new adding containers OR detected pre-existed containers.\r
+                       var containers = [];\r
+                       // node markers store.\r
+                       var database = {};\r
+                       // All block level elements which contained by the ranges.\r
+                       var containedBlocks = [],\r
+                               block;\r
+\r
+                       // Get all ranges from the selection.\r
+                       var selection = editor.getSelection(),\r
+                               ranges = selection.getRanges();\r
+                       var bookmarks = selection.createBookmarks();\r
+                       var i, iterator;\r
+\r
+                       // collect all included elements from dom-iterator\r
+                       for ( i = 0; i < ranges.length; i++ ) {\r
+                               iterator = ranges[ i ].createIterator();\r
+                               while ( ( block = iterator.getNextParagraph() ) ) {\r
+                                       // include contents of blockLimit elements.\r
+                                       if ( block.getName() in divLimitDefinition && !block.isReadOnly() ) {\r
+                                               var j,\r
+                                                       childNodes = block.getChildren();\r
+                                               for ( j = 0; j < childNodes.count(); j++ )\r
+                                                       addSafely( containedBlocks, childNodes.getItem( j ), database );\r
+                                       } else {\r
+                                               while ( !dtd[ block.getName() ] && !block.equals( ranges[ i ].root ) )\r
+                                                       block = block.getParent();\r
+                                               addSafely( containedBlocks, block, database );\r
+                                       }\r
+                               }\r
+                       }\r
+\r
+                       CKEDITOR.dom.element.clearAllMarkers( database );\r
+\r
+                       var blockGroups = groupByDivLimit( containedBlocks );\r
+                       var ancestor, divElement;\r
+\r
+                       for ( i = 0; i < blockGroups.length; i++ ) {\r
+                               var currentNode = blockGroups[ i ][ 0 ];\r
+\r
+                               // Calculate the common parent node of all contained elements.\r
+                               ancestor = currentNode.getParent();\r
+                               for ( j = 1; j < blockGroups[ i ].length; j++ )\r
+                                       ancestor = ancestor.getCommonAncestor( blockGroups[ i ][ j ] );\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
+                                       currentNode = blockGroups[ i ][ j ];\r
+\r
+                                       while ( !currentNode.getParent().equals( ancestor ) )\r
+                                               currentNode = currentNode.getParent();\r
+\r
+                                       // This could introduce some duplicated elements in array.\r
+                                       blockGroups[ i ][ j ] = currentNode;\r
+                               }\r
+\r
+                               // Wrapped blocks counting\r
+                               for ( j = 0; j < blockGroups[ i ].length; j++ ) {\r
+                                       currentNode = blockGroups[ i ][ j ];\r
+\r
+                                       // Avoid DUP elements introduced by grouping.\r
+                                       if ( !( currentNode.getCustomData && currentNode.getCustomData( 'block_processed' ) ) ) {\r
+                                               currentNode.is && CKEDITOR.dom.element.setMarker( database, currentNode, 'block_processed', true );\r
+\r
+                                               // Establish new container, wrapping all elements in this group.\r
+                                               if ( !j )\r
+                                                       divElement.insertBefore( currentNode );\r
+\r
+                                               divElement.append( currentNode );\r
+                                       }\r
+                               }\r
+\r
+                               CKEDITOR.dom.element.clearAllMarkers( database );\r
+                               containers.push( divElement );\r
+                       }\r
+\r
+                       selection.selectBookmarks( bookmarks );\r
+                       return containers;\r
+               }\r
+\r
+               // Divide a set of nodes to different groups by their path's blocklimit element.\r
+               // Note: the specified nodes should be in source order naturally, which mean they are supposed to producea by following class:\r
+               //  * CKEDITOR.dom.range.Iterator\r
+               //  * CKEDITOR.dom.domWalker\r
+               // @returns {Array[]} the grouped nodes\r
+               function groupByDivLimit( nodes ) {\r
+                       var groups = [],\r
+                               lastDivLimit = null,\r
+                               block;\r
+\r
+                       for ( var i = 0; i < nodes.length; i++ ) {\r
+                               block = nodes[ i ];\r
+                               var limit = getDivContainer( block );\r
+                               if ( !limit.equals( lastDivLimit ) ) {\r
+                                       lastDivLimit = limit;\r
+                                       groups.push( [] );\r
+                               }\r
+                               groups[ groups.length - 1 ].push( block );\r
+                       }\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
+                       var dialog = this.getDialog(),\r
+                               element = dialog._element && dialog._element.clone() || 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,\r
+                               field;\r
+                       for ( var i = 0; i < length; i++ ) {\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
+               var containers = [];\r
+\r
+               // @type divDialog\r
+               return {\r
+                       title: editor.lang.div.title,\r
+                       minWidth: 400,\r
+                       minHeight: 165,\r
+                       contents: [ {\r
+                               id: 'info',\r
+                               label: editor.lang.common.generalTab,\r
+                               title: editor.lang.common.generalTab,\r
+                               elements: [ {\r
+                                       type: 'hbox',\r
+                                       widths: [ '50%', '50%' ],\r
+                                       children: [ {\r
+                                               id: 'elementStyle',\r
+                                               type: 'select',\r
+                                               style: 'width: 100%;',\r
+                                               label: editor.lang.div.styleSelectLabel,\r
+                                               'default': '',\r
+                                               // Options are loaded dynamically.\r
+                                               items: [\r
+                                                       [ editor.lang.common.notSet, '' ]\r
+                                               ],\r
+                                               onChange: function() {\r
+                                                       commitInternally.call( this, [ 'info:elementStyle', 'info:class', 'advanced:dir', 'advanced:style' ] );\r
+                                               },\r
+                                               setup: function( element ) {\r
+                                                       for ( var name in styles )\r
+                                                               styles[ name ].checkElementRemovable( element, true, editor ) && this.setValue( name, 1 );\r
+                                               },\r
+                                               commit: function( element ) {\r
+                                                       var styleName;\r
+                                                       if ( ( styleName = this.getValue() ) ) {\r
+                                                               var style = styles[ styleName ];\r
+                                                               style.applyToObject( element, editor );\r
+                                                       }\r
+                                                       else {\r
+                                                               element.removeAttribute( 'style' );\r
+                                                       }\r
+                                               }\r
+                                       },\r
+                                       {\r
+                                               id: 'class',\r
+                                               type: 'text',\r
+                                               requiredContent: 'div(cke-xyz)', // Random text like 'xyz' will check if all are allowed.\r
+                                               label: editor.lang.common.cssClass,\r
+                                               'default': ''\r
+                                       } ]\r
+                               } ]\r
+                       },\r
+                       {\r
+                               id: 'advanced',\r
+                               label: editor.lang.common.advancedTab,\r
+                               title: editor.lang.common.advancedTab,\r
+                               elements: [ {\r
+                                       type: 'vbox',\r
+                                       padding: 1,\r
+                                       children: [ {\r
+                                               type: 'hbox',\r
+                                               widths: [ '50%', '50%' ],\r
+                                               children: [ {\r
+                                                       type: 'text',\r
+                                                       id: 'id',\r
+                                                       requiredContent: 'div[id]',\r
+                                                       label: editor.lang.common.id,\r
+                                                       'default': ''\r
+                                               },\r
+                                               {\r
+                                                       type: 'text',\r
+                                                       id: 'lang',\r
+                                                       requiredContent: 'div[lang]',\r
+                                                       label: editor.lang.common.langCode,\r
+                                                       'default': ''\r
+                                               } ]\r
+                                       },\r
+                                       {\r
+                                               type: 'hbox',\r
+                                               children: [ {\r
+                                                       type: 'text',\r
+                                                       id: 'style',\r
+                                                       requiredContent: 'div{cke-xyz}', // Random text like 'xyz' will check if all are allowed.\r
+                                                       style: 'width: 100%;',\r
+                                                       label: editor.lang.common.cssStyle,\r
+                                                       'default': '',\r
+                                                       commit: function( element ) {\r
+                                                               element.setAttribute( 'style', this.getValue() );\r
+                                                       }\r
+                                               } ]\r
+                                       },\r
+                                       {\r
+                                               type: 'hbox',\r
+                                               children: [ {\r
+                                                       type: 'text',\r
+                                                       id: 'title',\r
+                                                       requiredContent: 'div[title]',\r
+                                                       style: 'width: 100%;',\r
+                                                       label: editor.lang.common.advisoryTitle,\r
+                                                       'default': ''\r
+                                               } ]\r
+                                       },\r
+                                       {\r
+                                               type: 'select',\r
+                                               id: 'dir',\r
+                                               requiredContent: 'div[dir]',\r
+                                               style: 'width: 100%;',\r
+                                               label: editor.lang.common.langDir,\r
+                                               'default': '',\r
+                                               items: [\r
+                                                       [ editor.lang.common.notSet, '' ],\r
+                                                       [ editor.lang.common.langDirLtr, 'ltr' ],\r
+                                                       [ editor.lang.common.langDirRtl, 'rtl' ]\r
+                                               ]\r
+                                       } ] }\r
+                               ]\r
+                       } ],\r
+                       onLoad: function() {\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
+                                       var styleName, style;\r
+\r
+                                       if ( stylesDefinitions ) {\r
+                                               // Digg only those styles that apply to 'div'.\r
+                                               for ( var i = 0; i < stylesDefinitions.length; i++ ) {\r
+                                                       var styleDefinition = stylesDefinitions[ i ];\r
+                                                       if ( styleDefinition.element && styleDefinition.element == 'div' ) {\r
+                                                               styleName = styleDefinition.name;\r
+                                                               styles[ styleName ] = style = new CKEDITOR.style( styleDefinition );\r
+\r
+                                                               if ( editor.filter.check( style ) ) {\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
+\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 if dialog was opened on element. (#9689)\r
+                                       setTimeout( function() {\r
+                                               dialog._element && stylesField.setup( dialog._element );\r
+                                       }, 0 );\r
+                               } );\r
+                       },\r
+                       onShow: function() {\r
+                               // Whether always create new container regardless of existed\r
+                               // ones.\r
+                               if ( command == 'editdiv' ) {\r
+                                       // Try to discover the containers that already existed in\r
+                                       // ranges\r
+                                       // update dialog field values\r
+                                       this.setupContent( this._element = CKEDITOR.plugins.div.getSurroundDiv( editor ) );\r
+                               }\r
+                       },\r
+                       onOk: function() {\r
+                               if ( command == 'editdiv' )\r
+                                       containers = [ this._element ];\r
+                               else\r
+                                       containers = createDiv( editor, true );\r
+\r
+                               // Update elements attributes\r
+                               var size = containers.length;\r
+                               for ( var i = 0; i < size; i++ ) {\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
+                               // 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
+\r
+       CKEDITOR.dialog.add( 'creatediv', function( editor ) {\r
+               return divDialog( editor, 'creatediv' );\r
+       } );\r
+\r
+       CKEDITOR.dialog.add( 'editdiv', function( editor ) {\r
+               return divDialog( editor, 'editdiv' );\r
+       } );\r
+\r
+} )();\r
+\r
+/**\r
+ * Whether to wrap the entire table instead of individual cells when creating a `<div>` in a table cell.\r
+ *\r
+ *             config.div_wrapTable = true;\r
+ *\r
+ * @cfg {Boolean} [div_wrapTable=false]\r
+ * @member CKEDITOR.config\r
+ */\r