Update to 4.7.3

[perso/Immae/Projets/packagist/ludivine-ckeditor-component.git] / sources / plugins / filebrowser / 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 The "filebrowser" plugin that adds support for file uploads and\r
 *               browsing.\r
 *\r
 * When a file is uploaded or selected inside the file browser, its URL is\r
 * inserted automatically into a field defined in the <code>filebrowser</code>\r
 * attribute. In order to specify a field that should be updated, pass the tab ID and\r
 * the element ID, separated with a colon.<br /><br />\r
 *\r
 * <strong>Example 1: (Browse)</strong>\r
 *\r
 * <pre>\r
 * {\r
 * 	type : 'button',\r
 * 	id : 'browse',\r
 * 	filebrowser : 'tabId:elementId',\r
 * 	label : editor.lang.common.browseServer\r
 * }\r
 * </pre>\r
 *\r
 * If you set the <code>filebrowser</code> attribute for an element other than\r
 * the <code>fileButton</code>, the <code>Browse</code> action will be triggered.<br /><br />\r
 *\r
 * <strong>Example 2: (Quick Upload)</strong>\r
 *\r
 * <pre>\r
 * {\r
 * 	type : 'fileButton',\r
 * 	id : 'uploadButton',\r
 * 	filebrowser : 'tabId:elementId',\r
 * 	label : editor.lang.common.uploadSubmit,\r
 * 	'for' : [ 'upload', 'upload' ]\r
 * }\r
 * </pre>\r
 *\r
 * If you set the <code>filebrowser</code> attribute for a <code>fileButton</code>\r
 * element, the <code>QuickUpload</code> action will be executed.<br /><br />\r
 *\r
 * The filebrowser plugin also supports more advanced configuration performed through\r
 * a JavaScript object.\r
 *\r
 * The following settings are supported:\r
 *\r
 * <ul>\r
 * <li><code>action</code> &ndash; <code>Browse</code> or <code>QuickUpload</code>.</li>\r
 * <li><code>target</code> &ndash; the field to update in the <code><em>tabId:elementId</em></code> format.</li>\r
 * <li><code>params</code> &ndash; additional arguments to be passed to the server connector (optional).</li>\r
 * <li><code>onSelect</code> &ndash; a function to execute when the file is selected/uploaded (optional).</li>\r
 * <li><code>url</code> &ndash; the URL to be called (optional).</li>\r
 * </ul>\r
 *\r
 * <strong>Example 3: (Quick Upload)</strong>\r
 *\r
 * <pre>\r
 * {\r
 * 	type : 'fileButton',\r
 * 	label : editor.lang.common.uploadSubmit,\r
 * 	id : 'buttonId',\r
 * 	filebrowser :\r
 * 	{\r
 * 		action : 'QuickUpload', // required\r
 * 		target : 'tab1:elementId', // required\r
 * 		params : // optional\r
 * 		{\r
 * 			type : 'Files',\r
 * 			currentFolder : '/folder/'\r
 * 		},\r
 * 		onSelect : function( fileUrl, errorMessage ) // optional\r
 * 		{\r
 * 			// Do not call the built-in selectFuntion.\r
 * 			// return false;\r
 * 		}\r
 * 	},\r
 * 	'for' : [ 'tab1', 'myFile' ]\r
 * }\r
 * </pre>\r
 *\r
 * Suppose you have a file element with an ID of <code>myFile</code>, a text\r
 * field with an ID of <code>elementId</code> and a <code>fileButton</code>.\r
 * If the <code>filebowser.url</code> attribute is not specified explicitly,\r
 * the form action will be set to <code>filebrowser[<em>DialogWindowName</em>]UploadUrl</code>\r
 * or, if not specified, to <code>filebrowserUploadUrl</code>. Additional parameters\r
 * from the <code>params</code> object will be added to the query string. It is\r
 * possible to create your own <code>uploadHandler</code> and cancel the built-in\r
 * <code>updateTargetElement</code> command.<br /><br />\r
 *\r
 * <strong>Example 4: (Browse)</strong>\r
 *\r
 * <pre>\r
 * {\r
 * 	type : 'button',\r
 * 	id : 'buttonId',\r
 * 	label : editor.lang.common.browseServer,\r
 * 	filebrowser :\r
 * 	{\r
 * 		action : 'Browse',\r
 * 		url : '/ckfinder/ckfinder.html&amp;type=Images',\r
 * 		target : 'tab1:elementId'\r
 * 	}\r
 * }\r
 * </pre>\r
 *\r
 * In this example, when the button is pressed, the file browser will be opened in a\r
 * popup window. If you do not specify the <code>filebrowser.url</code> attribute,\r
 * <code>filebrowser[<em>DialogName</em>]BrowseUrl</code> or\r
 * <code>filebrowserBrowseUrl</code> will be used. After selecting a file in the file\r
 * browser, an element with an ID of <code>elementId</code> will be updated. Just\r
 * like in the third example, a custom <code>onSelect</code> function may be defined.\r
 */\r
\r
( function() {\r
	// Default input element name for CSRF protection token.\r
	var TOKEN_INPUT_NAME = 'ckCsrfToken';\r
\r
	// Adds (additional) arguments to given url.\r
	//\r
	// @param {String}\r
	//            url The url.\r
	// @param {Object}\r
	//            params Additional parameters.\r
	function addQueryString( url, params ) {\r
		var queryString = [];\r
\r
		if ( !params )\r
			return url;\r
		else {\r
			for ( var i in params )\r
				queryString.push( i + '=' + encodeURIComponent( params[ i ] ) );\r
		}\r
\r
		return url + ( ( url.indexOf( '?' ) != -1 ) ? '&' : '?' ) + queryString.join( '&' );\r
	}\r
\r
	// Make a string's first character uppercase.\r
	//\r
	// @param {String}\r
	//            str String.\r
	function ucFirst( str ) {\r
		str += '';\r
		var f = str.charAt( 0 ).toUpperCase();\r
		return f + str.substr( 1 );\r
	}\r
\r
	// The onlick function assigned to the 'Browse Server' button. Opens the\r
	// file browser and updates target field when file is selected.\r
	//\r
	// @param {CKEDITOR.event}\r
	//            evt The event object.\r
	function browseServer() {\r
		var dialog = this.getDialog();\r
		var editor = dialog.getParentEditor();\r
\r
		editor._.filebrowserSe = this;\r
\r
		var width = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowWidth' ] || editor.config.filebrowserWindowWidth || '80%';\r
		var height = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowHeight' ] || editor.config.filebrowserWindowHeight || '70%';\r
\r
		var params = this.filebrowser.params || {};\r
		params.CKEditor = editor.name;\r
		params.CKEditorFuncNum = editor._.filebrowserFn;\r
		if ( !params.langCode )\r
			params.langCode = editor.langCode;\r
\r
		var url = addQueryString( this.filebrowser.url, params );\r
		// TODO: V4: Remove backward compatibility (http://dev.ckeditor.com/ticket/8163).\r
		editor.popup( url, width, height, editor.config.filebrowserWindowFeatures || editor.config.fileBrowserWindowFeatures );\r
	}\r
\r
	// Appends token preventing CSRF attacks to the form of provided file input.\r
	//\r
	// @since 4.5.6\r
	// @param {CKEDITOR.dom.element} fileInput\r
	function appendToken( fileInput ) {\r
		var tokenElement;\r
		var form = new CKEDITOR.dom.element( fileInput.$.form );\r
\r
		if ( form ) {\r
			// Check if token input element already exists.\r
			tokenElement = form.$.elements[ TOKEN_INPUT_NAME ];\r
\r
			// Create new if needed.\r
			if ( !tokenElement ) {\r
				tokenElement = new CKEDITOR.dom.element( 'input' );\r
				tokenElement.setAttributes( {\r
					name: TOKEN_INPUT_NAME,\r
					type: 'hidden'\r
				} );\r
\r
				form.append( tokenElement );\r
			} else {\r
				tokenElement = new CKEDITOR.dom.element( tokenElement );\r
			}\r
\r
			tokenElement.setAttribute( 'value', CKEDITOR.tools.getCsrfToken() );\r
		}\r
	}\r
\r
	// The onlick function assigned to the 'Upload' button. Makes the final\r
	// decision whether form is really submitted and updates target field when\r
	// file is uploaded.\r
	//\r
	// @param {CKEDITOR.event}\r
	//            evt The event object.\r
	function uploadFile() {\r
		var dialog = this.getDialog();\r
		var editor = dialog.getParentEditor();\r
\r
		editor._.filebrowserSe = this;\r
\r
		// If user didn't select the file, stop the upload.\r
		if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement().$.value )\r
			return false;\r
\r
		if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getAction() )\r
			return false;\r
\r
		return true;\r
	}\r
\r
	// Setups the file element.\r
	//\r
	// @param {CKEDITOR.ui.dialog.file}\r
	//            fileInput The file element used during file upload.\r
	// @param {Object}\r
	//            filebrowser Object containing filebrowser settings assigned to\r
	//            the fileButton associated with this file element.\r
	function setupFileElement( editor, fileInput, filebrowser ) {\r
		var params = filebrowser.params || {};\r
		params.CKEditor = editor.name;\r
		params.CKEditorFuncNum = editor._.filebrowserFn;\r
		if ( !params.langCode )\r
			params.langCode = editor.langCode;\r
\r
		fileInput.action = addQueryString( filebrowser.url, params );\r
		fileInput.filebrowser = filebrowser;\r
	}\r
\r
	// Traverse through the content definition and attach filebrowser to\r
	// elements with 'filebrowser' attribute.\r
	//\r
	// @param String\r
	//            dialogName Dialog name.\r
	// @param {CKEDITOR.dialog.definitionObject}\r
	//            definition Dialog definition.\r
	// @param {Array}\r
	//            elements Array of {@link CKEDITOR.dialog.definition.content}\r
	//            objects.\r
	function attachFileBrowser( editor, dialogName, definition, elements ) {\r
		if ( !elements || !elements.length )\r
			return;\r
\r
		var element;\r
\r
		for ( var i = elements.length; i--; ) {\r
			element = elements[ i ];\r
\r
			if ( element.type == 'hbox' || element.type == 'vbox' || element.type == 'fieldset' )\r
				attachFileBrowser( editor, dialogName, definition, element.children );\r
\r
			if ( !element.filebrowser )\r
				continue;\r
\r
			if ( typeof element.filebrowser == 'string' ) {\r
				var fb = {\r
					action: ( element.type == 'fileButton' ) ? 'QuickUpload' : 'Browse',\r
					target: element.filebrowser\r
				};\r
				element.filebrowser = fb;\r
			}\r
\r
			if ( element.filebrowser.action == 'Browse' ) {\r
				var url = element.filebrowser.url;\r
				if ( url === undefined ) {\r
					url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];\r
					if ( url === undefined )\r
						url = editor.config.filebrowserBrowseUrl;\r
				}\r
\r
				if ( url ) {\r
					element.onClick = browseServer;\r
					element.filebrowser.url = url;\r
					element.hidden = false;\r
				}\r
			} else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] ) {\r
				url = element.filebrowser.url;\r
				if ( url === undefined ) {\r
					url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];\r
					if ( url === undefined )\r
						url = editor.config.filebrowserUploadUrl;\r
				}\r
\r
				if ( url ) {\r
					var onClick = element.onClick;\r
					element.onClick = function( evt ) {\r
						// "element" here means the definition object, so we need to find the correct\r
						// button to scope the event call\r
						var sender = evt.sender;\r
						if ( onClick && onClick.call( sender, evt ) === false )\r
							return false;\r
\r
						if ( uploadFile.call( sender, evt ) ) {\r
							var fileInput = sender.getDialog().getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement();\r
\r
							// Append token preventing CSRF attacks.\r
							appendToken( fileInput );\r
							return true;\r
						}\r
\r
\r
						return false;\r
					};\r
\r
					element.filebrowser.url = url;\r
					element.hidden = false;\r
					setupFileElement( editor, definition.getContents( element[ 'for' ][ 0 ] ).get( element[ 'for' ][ 1 ] ), element.filebrowser );\r
				}\r
			}\r
		}\r
	}\r
\r
	// Updates the target element with the url of uploaded/selected file.\r
	//\r
	// @param {String}\r
	//            url The url of a file.\r
	function updateTargetElement( url, sourceElement ) {\r
		var dialog = sourceElement.getDialog();\r
		var targetElement = sourceElement.filebrowser.target || null;\r
\r
		// If there is a reference to targetElement, update it.\r
		if ( targetElement ) {\r
			var target = targetElement.split( ':' );\r
			var element = dialog.getContentElement( target[ 0 ], target[ 1 ] );\r
			if ( element ) {\r
				element.setValue( url );\r
				dialog.selectPage( target[ 0 ] );\r
			}\r
		}\r
	}\r
\r
	// Returns true if filebrowser is configured in one of the elements.\r
	//\r
	// @param {CKEDITOR.dialog.definitionObject}\r
	//            definition Dialog definition.\r
	// @param String\r
	//            tabId The tab id where element(s) can be found.\r
	// @param String\r
	//            elementId The element id (or ids, separated with a semicolon) to check.\r
	function isConfigured( definition, tabId, elementId ) {\r
		if ( elementId.indexOf( ';' ) !== -1 ) {\r
			var ids = elementId.split( ';' );\r
			for ( var i = 0; i < ids.length; i++ ) {\r
				if ( isConfigured( definition, tabId, ids[ i ] ) )\r
					return true;\r
			}\r
			return false;\r
		}\r
\r
		var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;\r
		return ( elementFileBrowser && elementFileBrowser.url );\r
	}\r
\r
	function setUrl( fileUrl, data ) {\r
		var dialog = this._.filebrowserSe.getDialog(),\r
			targetInput = this._.filebrowserSe[ 'for' ],\r
			onSelect = this._.filebrowserSe.filebrowser.onSelect;\r
\r
		if ( targetInput )\r
			dialog.getContentElement( targetInput[ 0 ], targetInput[ 1 ] ).reset();\r
\r
		if ( typeof data == 'function' && data.call( this._.filebrowserSe ) === false )\r
			return;\r
\r
		if ( onSelect && onSelect.call( this._.filebrowserSe, fileUrl, data ) === false )\r
			return;\r
\r
		// The "data" argument may be used to pass the error message to the editor.\r
		if ( typeof data == 'string' && data )\r
			alert( data ); // jshint ignore:line\r
\r
		if ( fileUrl )\r
			updateTargetElement( fileUrl, this._.filebrowserSe );\r
	}\r
\r
	CKEDITOR.plugins.add( 'filebrowser', {\r
		requires: 'popup',\r
		init: function( editor ) {\r
			editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );\r
			editor.on( 'destroy', function() {\r
				CKEDITOR.tools.removeFunction( this._.filebrowserFn );\r
			} );\r
		}\r
	} );\r
\r
	CKEDITOR.on( 'dialogDefinition', function( evt ) {\r
		// We require filebrowser plugin to be loaded.\r
		if ( !evt.editor.plugins.filebrowser )\r
			return;\r
\r
		var definition = evt.data.definition,\r
			element;\r
		// Associate filebrowser to elements with 'filebrowser' attribute.\r
		for ( var i = 0; i < definition.contents.length; ++i ) {\r
			if ( ( element = definition.contents[ i ] ) ) {\r
				attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );\r
				if ( element.hidden && element.filebrowser )\r
					element.hidden = !isConfigured( definition, element.id, element.filebrowser );\r
\r
			}\r
		}\r
	} );\r
\r
} )();\r
\r
/**\r
 * The location of an external file manager that should be launched when the **Browse Server**\r
 * button is pressed. If configured, the **Browse Server** button will appear in the\r
 * **Link**, **Image**, and **Flash** dialog windows.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_browse_upload)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserBrowseUrl = '/browser/browse.php';\r
 *\r
 * @since 3.0\r
 * @cfg {String} [filebrowserBrowseUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of the script that handles file uploads.\r
 * If set, the **Upload** tab will appear in the **Link**, **Image**,\r
 * and **Flash** dialog windows.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_browse_upload)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserUploadUrl = '/uploader/upload.php';\r
 *\r
 * **Note:** This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).\r
 * To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}\r
 * configuration option.\r
 *\r
 * @since 3.0\r
 * @cfg {String} [filebrowserUploadUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of an external file manager that should be launched when the **Browse Server**\r
 * button is pressed in the **Image** dialog window.\r
 *\r
 * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';\r
 *\r
 * @since 3.0\r
 * @cfg {String} [filebrowserImageBrowseUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of an external file browser that should be launched when the **Browse Server**\r
 * button is pressed in the **Flash** dialog window.\r
 *\r
 * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';\r
 *\r
 * @since 3.0\r
 * @cfg {String} [filebrowserFlashBrowseUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of the script that handles file uploads in the **Image** dialog window.\r
 *\r
 * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';\r
 *\r
 * **Note:** This is a configuration setting for a [file browser/uploader](#!/guide/dev_file_browse_upload).\r
 * To configure [uploading dropped or pasted files](#!/guide/dev_file_upload) use the {@link CKEDITOR.config#uploadUrl}\r
 * or {@link CKEDITOR.config#imageUploadUrl} configuration option.\r
 *\r
 * @since 3.0\r
 * @cfg {String} [filebrowserImageUploadUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of the script that handles file uploads in the **Flash** dialog window.\r
 *\r
 * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserUploadUrl}.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';\r
 *\r
 * @since 3.0\r
 * @cfg {String} filebrowserFlashUploadUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The location of an external file manager that should be launched when the **Browse Server**\r
 * button is pressed in the **Link** tab of the **Image** dialog window.\r
 *\r
 * If not set, CKEditor will use {@link CKEDITOR.config#filebrowserBrowseUrl}.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-adding-file-manager-scripts-for-selected-dialog-windows)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';\r
 *\r
 * @since 3.2\r
 * @cfg {String} [filebrowserImageBrowseLinkUrl='' (empty string = disabled)]\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The features to use in the file manager popup window.\r
 *\r
 *		config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';\r
 *\r
 * @since 3.4.1\r
 * @cfg {String} [filebrowserWindowFeatures='location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes']\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The width of the file manager popup window. It can be a number denoting a value in\r
 * pixels or a percent string.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserWindowWidth = 750;\r
 *\r
 *		config.filebrowserWindowWidth = '50%';\r
 *\r
 * @cfg {Number/String} [filebrowserWindowWidth='80%']\r
 * @member CKEDITOR.config\r
 */\r
\r
/**\r
 * The height of the file manager popup window. It can be a number denoting a value in\r
 * pixels or a percent string.\r
 *\r
 * Read more in the [documentation](#!/guide/dev_file_manager_configuration-section-file-manager-window-size)\r
 * and see the [SDK sample](http://sdk.ckeditor.com/samples/fileupload.html).\r
 *\r
 *		config.filebrowserWindowHeight = 580;\r
 *\r
 *		config.filebrowserWindowHeight = '50%';\r
 *\r
 * @cfg {Number/String} [filebrowserWindowHeight='70%']\r
 * @member CKEDITOR.config\r
 */\r