Update to 4.7.3

[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / plugins / justify / plugin.js

/**\r
 * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.\r
 * For licensing, see LICENSE.md or http://ckeditor.com/license\r
 */\r
\r
/**\r
 * @fileOverview Justify commands.\r
 */\r
\r
( function() {\r
	function getAlignment( element, useComputedState ) {\r
		useComputedState = useComputedState === undefined || useComputedState;\r
\r
		var align;\r
		if ( useComputedState )\r
			align = element.getComputedStyle( 'text-align' );\r
		else {\r
			while ( !element.hasAttribute || !( element.hasAttribute( 'align' ) || element.getStyle( 'text-align' ) ) ) {\r
				var parent = element.getParent();\r
				if ( !parent )\r
					break;\r
				element = parent;\r
			}\r
			align = element.getStyle( 'text-align' ) || element.getAttribute( 'align' ) || '';\r
		}\r
\r
		// Sometimes computed values doesn't tell.\r
		align && ( align = align.replace( /(?:-(?:moz|webkit)-)?(?:start|auto)/i, '' ) );\r
\r
		!align && useComputedState && ( align = element.getComputedStyle( 'direction' ) == 'rtl' ? 'right' : 'left' );\r
\r
		return align;\r
	}\r
\r
	function justifyCommand( editor, name, value ) {\r
		this.editor = editor;\r
		this.name = name;\r
		this.value = value;\r
		this.context = 'p';\r
		var classes = editor.config.justifyClasses,\r
			blockTag = editor.config.enterMode == CKEDITOR.ENTER_P ? 'p' : 'div';\r
\r
		if ( classes ) {\r
			switch ( value ) {\r
				case 'left':\r
					this.cssClassName = classes[ 0 ];\r
					break;\r
				case 'center':\r
					this.cssClassName = classes[ 1 ];\r
					break;\r
				case 'right':\r
					this.cssClassName = classes[ 2 ];\r
					break;\r
				case 'justify':\r
					this.cssClassName = classes[ 3 ];\r
					break;\r
			}\r
\r
			this.cssClassRegex = new RegExp( '(?:^|\\s+)(?:' + classes.join( '|' ) + ')(?=$|\\s)' );\r
			this.requiredContent = blockTag + '(' + this.cssClassName + ')';\r
		}\r
		else {\r
			this.requiredContent = blockTag + '{text-align}';\r
		}\r
\r
		this.allowedContent = {\r
			'caption div h1 h2 h3 h4 h5 h6 p pre td th li': {\r
				// Do not add elements, but only text-align style if element is validated by other rule.\r
				propertiesOnly: true,\r
				styles: this.cssClassName ? null : 'text-align',\r
				classes: this.cssClassName || null\r
			}\r
		};\r
\r
		// In enter mode BR we need to allow here for div, because when non other\r
		// feature allows div justify is the only plugin that uses it.\r
		if ( editor.config.enterMode == CKEDITOR.ENTER_BR )\r
			this.allowedContent.div = true;\r
	}\r
\r
	function onDirChanged( e ) {\r
		var editor = e.editor;\r
\r
		var range = editor.createRange();\r
		range.setStartBefore( e.data.node );\r
		range.setEndAfter( e.data.node );\r
\r
		var walker = new CKEDITOR.dom.walker( range ),\r
			node;\r
\r
		while ( ( node = walker.next() ) ) {\r
			if ( node.type == CKEDITOR.NODE_ELEMENT ) {\r
				// A child with the defined dir is to be ignored.\r
				if ( !node.equals( e.data.node ) && node.getDirection() ) {\r
					range.setStartAfter( node );\r
					walker = new CKEDITOR.dom.walker( range );\r
					continue;\r
				}\r
\r
				// Switch the alignment.\r
				var classes = editor.config.justifyClasses;\r
				if ( classes ) {\r
					// The left align class.\r
					if ( node.hasClass( classes[ 0 ] ) ) {\r
						node.removeClass( classes[ 0 ] );\r
						node.addClass( classes[ 2 ] );\r
					}\r
					// The right align class.\r
					else if ( node.hasClass( classes[ 2 ] ) ) {\r
						node.removeClass( classes[ 2 ] );\r
						node.addClass( classes[ 0 ] );\r
					}\r
				}\r
\r
				// Always switch CSS margins.\r
				var style = 'text-align';\r
				var align = node.getStyle( style );\r
\r
				if ( align == 'left' )\r
					node.setStyle( style, 'right' );\r
				else if ( align == 'right' )\r
					node.setStyle( style, 'left' );\r
			}\r
		}\r
	}\r
\r
	justifyCommand.prototype = {\r
		exec: function( editor ) {\r
			var selection = editor.getSelection(),\r
				enterMode = editor.config.enterMode;\r
\r
			if ( !selection )\r
				return;\r
\r
			var bookmarks = selection.createBookmarks(),\r
				ranges = selection.getRanges();\r
\r
			var cssClassName = this.cssClassName,\r
				iterator, block;\r
\r
			var useComputedState = editor.config.useComputedState;\r
			useComputedState = useComputedState === undefined || useComputedState;\r
\r
			for ( var i = ranges.length - 1; i >= 0; i-- ) {\r
				iterator = ranges[ i ].createIterator();\r
				iterator.enlargeBr = enterMode != CKEDITOR.ENTER_BR;\r
\r
				while ( ( block = iterator.getNextParagraph( enterMode == CKEDITOR.ENTER_P ? 'p' : 'div' ) ) ) {\r
					if ( block.isReadOnly() )\r
						continue;\r
\r
					// Check if style or class might be applied to currently processed element (#455).\r
					var tag = block.getName(),\r
						isAllowedTextAlign, isAllowedCssClass;\r
\r
					isAllowedTextAlign = editor.activeFilter.check( tag + '{text-align}' );\r
					isAllowedCssClass = editor.activeFilter.check( tag + '(' + cssClassName + ')' );\r
\r
					if ( !isAllowedCssClass && !isAllowedTextAlign ) {\r
						continue;\r
					}\r
\r
					block.removeAttribute( 'align' );\r
					block.removeStyle( 'text-align' );\r
\r
					// Remove any of the alignment classes from the className.\r
					var className = cssClassName && ( block.$.className = CKEDITOR.tools.ltrim( block.$.className.replace( this.cssClassRegex, '' ) ) );\r
\r
					var apply = ( this.state == CKEDITOR.TRISTATE_OFF ) && ( !useComputedState || ( getAlignment( block, true ) != this.value ) );\r
\r
					if ( cssClassName && isAllowedCssClass ) {\r
						// Append the desired class name.\r
						if ( apply )\r
							block.addClass( cssClassName );\r
						else if ( !className )\r
							block.removeAttribute( 'class' );\r
					} else if ( apply && isAllowedTextAlign ) {\r
						block.setStyle( 'text-align', this.value );\r
					}\r
				}\r
\r
			}\r
\r
			editor.focus();\r
			editor.forceNextSelectionCheck();\r
			selection.selectBookmarks( bookmarks );\r
		},\r
\r
		refresh: function( editor, path ) {\r
			var firstBlock = path.block || path.blockLimit,\r
				name = firstBlock.getName(),\r
				isEditable = firstBlock.equals( editor.editable() ),\r
				isStylable = this.cssClassName ? editor.activeFilter.check( name + '(' + this.cssClassName + ')' ) :\r
					editor.activeFilter.check( name + '{text-align}' );\r
\r
			// #455\r
			// 1. Check if we are directly in editbale. Justification should be always allowed, and not highlighted.\r
			//    Checking path.elements.length is required to filter out situation `body > ul` where ul is selected and path.blockLimit returns editable.\r
			// 2. Check if current element can have applied specific class.\r
			// 3. Check if current element can have applied text-align style.\r
			if (  isEditable && path.elements.length === 1 ) {\r
				this.setState( CKEDITOR.TRISTATE_OFF );\r
			} else if ( !isEditable && isStylable ) {\r
				// 2 & 3 in one condition.\r
				this.setState( getAlignment( firstBlock, this.editor.config.useComputedState ) == this.value ? CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF );\r
			} else {\r
				this.setState( CKEDITOR.TRISTATE_DISABLED );\r
			}\r
		}\r
	};\r
\r
	CKEDITOR.plugins.add( 'justify', {\r
		// jscs:disable maximumLineLength\r
		lang: 'af,ar,az,bg,bn,bs,ca,cs,cy,da,de,de-ch,el,en,en-au,en-ca,en-gb,eo,es,es-mx,et,eu,fa,fi,fo,fr,fr-ca,gl,gu,he,hi,hr,hu,id,is,it,ja,ka,km,ko,ku,lt,lv,mk,mn,ms,nb,nl,no,oc,pl,pt,pt-br,ro,ru,si,sk,sl,sq,sr,sr-latn,sv,th,tr,tt,ug,uk,vi,zh,zh-cn', // %REMOVE_LINE_CORE%\r
		// jscs:enable maximumLineLength\r
		icons: 'justifyblock,justifycenter,justifyleft,justifyright', // %REMOVE_LINE_CORE%\r
		hidpi: true, // %REMOVE_LINE_CORE%\r
		init: function( editor ) {\r
			if ( editor.blockless )\r
				return;\r
\r
			var left = new justifyCommand( editor, 'justifyleft', 'left' ),\r
				center = new justifyCommand( editor, 'justifycenter', 'center' ),\r
				right = new justifyCommand( editor, 'justifyright', 'right' ),\r
				justify = new justifyCommand( editor, 'justifyblock', 'justify' );\r
\r
			editor.addCommand( 'justifyleft', left );\r
			editor.addCommand( 'justifycenter', center );\r
			editor.addCommand( 'justifyright', right );\r
			editor.addCommand( 'justifyblock', justify );\r
\r
			if ( editor.ui.addButton ) {\r
				editor.ui.addButton( 'JustifyLeft', {\r
					label: editor.lang.justify.left,\r
					command: 'justifyleft',\r
					toolbar: 'align,10'\r
				} );\r
				editor.ui.addButton( 'JustifyCenter', {\r
					label: editor.lang.justify.center,\r
					command: 'justifycenter',\r
					toolbar: 'align,20'\r
				} );\r
				editor.ui.addButton( 'JustifyRight', {\r
					label: editor.lang.justify.right,\r
					command: 'justifyright',\r
					toolbar: 'align,30'\r
				} );\r
				editor.ui.addButton( 'JustifyBlock', {\r
					label: editor.lang.justify.block,\r
					command: 'justifyblock',\r
					toolbar: 'align,40'\r
				} );\r
			}\r
			editor.on( 'dirChanged', onDirChanged );\r
		}\r
	} );\r
} )();\r
\r
/**\r
 * List of classes to use for aligning the contents. If it's `null`, no classes will be used\r
 * and instead the corresponding CSS values will be used.\r
 *\r
 * The array should contain 4 members, in the following order: left, center, right, justify.\r
 *\r
 *		// Use the classes 'AlignLeft', 'AlignCenter', 'AlignRight', 'AlignJustify'\r
 *		config.justifyClasses = [ 'AlignLeft', 'AlignCenter', 'AlignRight', 'AlignJustify' ];\r
 *\r
 * @cfg {Array} [justifyClasses=null]\r
 * @member CKEDITOR.config\r
 */\r