/*\r
-Copyright (c) 2003-2009, CKSource - Frederico Knabben. All rights reserved.\r
+Copyright (c) 2003-2012, CKSource - Frederico Knabben. All rights reserved.\r
For licensing, see LICENSE.html or http://ckeditor.com/license\r
*/\r
\r
/**\r
- * @fileOverview The "filebrowser" plugin, it adds support for file uploads and\r
+ * @fileOverview The "filebrowser" plugin that adds support for file uploads and\r
* browsing.\r
*\r
- * When file is selected inside of the file browser or uploaded, its url is\r
- * inserted automatically to a field, which is described in the 'filebrowser'\r
- * attribute. To specify field that should be updated, pass the tab id and\r
- * element id, separated with a colon.\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
- * Example 1: (Browse)\r
+ * <strong>Example 1: (Browse)</strong>\r
*\r
* <pre>\r
* {\r
* }\r
* </pre>\r
*\r
- * If you set the 'filebrowser' attribute on any element other than\r
- * 'fileButton', the 'Browse' action will be triggered.\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
- * Example 2: (Quick Upload)\r
+ * <strong>Example 2: (Quick Upload)</strong>\r
*\r
* <pre>\r
* {\r
* }\r
* </pre>\r
*\r
- * If you set the 'filebrowser' attribute on a fileButton element, the\r
- * 'QuickUpload' action will be executed.\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
- * Filebrowser plugin also supports more advanced configuration (through\r
- * javascript object).\r
+ * The filebrowser plugin also supports more advanced configuration performed through\r
+ * a JavaScript object.\r
*\r
* The following settings are supported:\r
*\r
- * <pre>\r
- * [action] - Browse or QuickUpload\r
- * [target] - field to update, tabId:elementId\r
- * [params] - additional arguments to be passed to the server connector (optional)\r
- * [onSelect] - function to execute when file is selected/uploaded (optional)\r
- * [url] - the URL to be called (optional)\r
- * </pre>\r
+ * <ul>\r
+ * <li><code>action</code> – <code>Browse</code> or <code>QuickUpload</code>.</li>\r
+ * <li><code>target</code> – the field to update in the <code><em>tabId:elementId</em></code> format.</li>\r
+ * <li><code>params</code> – additional arguments to be passed to the server connector (optional).</li>\r
+ * <li><code>onSelect</code> – a function to execute when the file is selected/uploaded (optional).</li>\r
+ * <li><code>url</code> – the URL to be called (optional).</li>\r
+ * </ul>\r
*\r
- * Example 3: (Quick Upload)\r
+ * <strong>Example 3: (Quick Upload)</strong>\r
*\r
* <pre>\r
* {\r
* id : 'buttonId',\r
* filebrowser :\r
* {\r
- * action : 'QuickUpload', //required\r
- * target : 'tab1:elementId', //required\r
- * params : //optional\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
+ * onSelect : function( fileUrl, errorMessage ) // optional\r
* {\r
- * // Do not call the built-in selectFuntion\r
+ * // Do not call the built-in selectFuntion.\r
* // return false;\r
* }\r
* },\r
* }\r
* </pre>\r
*\r
- * Suppose we have a file element with id 'myFile', text field with id\r
- * 'elementId' and a fileButton. If filebowser.url is not specified explicitly,\r
- * form action will be set to 'filebrowser[DialogName]UploadUrl' or, if not\r
- * specified, to 'filebrowserUploadUrl'. Additional parameters from 'params'\r
- * object will be added to the query string. It is possible to create your own\r
- * uploadHandler and cancel the built-in updateTargetElement command.\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
- * Example 4: (Browse)\r
+ * <strong>Example 4: (Browse)</strong>\r
*\r
* <pre>\r
* {\r
* }\r
* </pre>\r
*\r
- * In this example, after pressing a button, file browser will be opened in a\r
- * popup. If we don't specify filebrowser.url attribute,\r
- * 'filebrowser[DialogName]BrowseUrl' or 'filebrowserBrowseUrl' will be used.\r
- * After selecting a file in a file browser, an element with id 'elementId' will\r
- * be updated. Just like in the third example, a custom 'onSelect' function may be\r
- * defined.\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
( function()\r
{\r
- /**\r
+ /*\r
* Adds (additional) arguments to given url.\r
*\r
* @param {String}\r
return url + ( ( url.indexOf( "?" ) != -1 ) ? "&" : "?" ) + queryString.join( "&" );\r
}\r
\r
- /**\r
+ /*\r
* Make a string's first character uppercase.\r
*\r
* @param {String}\r
return f + str.substr( 1 );\r
}\r
\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
params.langCode = editor.langCode;\r
\r
var url = addQueryString( this.filebrowser.url, params );\r
- editor.popup( url, width, height );\r
+ // TODO: V4: Remove backward compatibility (#8163).\r
+ editor.popup( url, width, height, editor.config.filebrowserWindowFeatures || editor.config.fileBrowserWindowFeatures );\r
}\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
return true;\r
}\r
\r
- /**\r
+ /*\r
* Setups the file element.\r
*\r
* @param {CKEDITOR.ui.dialog.file}\r
fileInput.filebrowser = filebrowser;\r
}\r
\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.dialogDefinitionObject}\r
+ * @param {CKEDITOR.dialog.definitionObject}\r
* definition Dialog definition.\r
* @param {Array}\r
- * elements Array of {@link CKEDITOR.dialog.contentDefinition}\r
+ * elements Array of {@link CKEDITOR.dialog.definition.content}\r
* objects.\r
*/\r
function attachFileBrowser( editor, dialogName, definition, elements )\r
{\r
element = elements[ i ];\r
\r
- if ( element.type == 'hbox' || element.type == 'vbox' )\r
+ if ( element.type == 'hbox' || element.type == 'vbox' || element.type == 'fieldset' )\r
attachFileBrowser( editor, dialogName, definition, element.children );\r
\r
if ( !element.filebrowser )\r
\r
if ( element.filebrowser.action == 'Browse' )\r
{\r
- var url = element.filebrowser.url || editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ]\r
- || editor.config.filebrowserBrowseUrl;\r
+ var url = element.filebrowser.url;\r
+ if ( url === undefined )\r
+ {\r
+ url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];\r
+ if ( url === undefined )\r
+ url = editor.config.filebrowserBrowseUrl;\r
+ }\r
\r
if ( url )\r
{\r
}\r
else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] )\r
{\r
- url = element.filebrowser.url || editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ]\r
- || editor.config.filebrowserUploadUrl;\r
+ url = element.filebrowser.url;\r
+ if ( url === undefined )\r
+ {\r
+ url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];\r
+ if ( url === undefined )\r
+ url = editor.config.filebrowserUploadUrl;\r
+ }\r
\r
if ( url )\r
{\r
- element.onClick = uploadFile;\r
+ var onClick = element.onClick;\r
+ element.onClick = function( evt )\r
+ {\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
+ return uploadFile.call( sender, evt );\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
{\r
var dialog = sourceElement.getDialog();\r
var targetElement = sourceElement.filebrowser.target || null;\r
- url = url.replace( /#/g, '%23' );\r
\r
// If there is a reference to targetElement, update it.\r
if ( targetElement )\r
}\r
}\r
\r
- /**\r
+ /*\r
* Returns true if filebrowser is configured in one of the elements.\r
*\r
- * @param {CKEDITOR.dialog.dialogDefinitionObject}\r
+ * @param {CKEDITOR.dialog.definitionObject}\r
* definition Dialog definition.\r
* @param String\r
* tabId The tab id where element(s) can be found.\r
var ids = elementId.split( ";" );\r
for ( var i = 0 ; i < ids.length ; i++ )\r
{\r
- if ( isConfigured( definition, tabId, ids[i]) )\r
+ if ( isConfigured( definition, tabId, ids[i] ) )\r
return true;\r
}\r
return false;\r
}\r
\r
- return ( definition.getContents( tabId ).get( elementId ).filebrowser && definition.getContents( tabId ).get( elementId ).filebrowser.url );\r
+ var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;\r
+ return ( elementFileBrowser && elementFileBrowser.url );\r
}\r
\r
function setUrl( fileUrl, data )\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
init : function( editor, pluginPath )\r
{\r
editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );\r
+ editor.on( 'destroy', function () { CKEDITOR.tools.removeFunction( this._.filebrowserFn ); } );\r
+ }\r
+ } );\r
\r
- CKEDITOR.on( 'dialogDefinition', function( evt )\r
+ CKEDITOR.on( 'dialogDefinition', function( evt )\r
+ {\r
+ var definition = evt.data.definition,\r
+ element;\r
+ // Associate filebrowser to elements with 'filebrowser' attribute.\r
+ for ( var i in definition.contents )\r
+ {\r
+ if ( ( element = definition.contents[ i ] ) )\r
{\r
- // Associate filebrowser to elements with 'filebrowser' attribute.\r
- for ( var i in evt.data.definition.contents )\r
+ attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );\r
+ if ( element.hidden && element.filebrowser )\r
{\r
- attachFileBrowser( evt.editor, evt.data.name, evt.data.definition, evt.data.definition.contents[ i ].elements );\r
- if ( evt.data.definition.contents[ i ].hidden && evt.data.definition.contents[ i ].filebrowser )\r
- {\r
- evt.data.definition.contents[ i ].hidden =\r
- !isConfigured( evt.data.definition, evt.data.definition.contents[ i ][ 'id' ], evt.data.definition.contents[ i ].filebrowser );\r
- }\r
+ element.hidden = !isConfigured( definition, element[ 'id' ], element.filebrowser );\r
}\r
- } );\r
+ }\r
}\r
} );\r
\r
} )();\r
+\r
+/**\r
+ * The location of an external file browser that should be launched when the <strong>Browse Server</strong>\r
+ * button is pressed. If configured, the <strong>Browse Server</strong> button will appear in the\r
+ * <strong>Link</strong>, <strong>Image</strong>, and <strong>Flash</strong> dialog windows.\r
+ * @see The <a href="http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader)">File Browser/Uploader</a> documentation.\r
+ * @name CKEDITOR.config.filebrowserBrowseUrl\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserBrowseUrl = '/browser/browse.php';\r
+ */\r
+\r
+/**\r
+ * The location of the script that handles file uploads.\r
+ * If set, the <strong>Upload</strong> tab will appear in the <strong>Link</strong>, <strong>Image</strong>,\r
+ * and <strong>Flash</strong> dialog windows.\r
+ * @name CKEDITOR.config.filebrowserUploadUrl\r
+ * @see The <a href="http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader)">File Browser/Uploader</a> documentation.\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserUploadUrl = '/uploader/upload.php';\r
+ */\r
+\r
+/**\r
+ * The location of an external file browser that should be launched when the <strong>Browse Server</strong>\r
+ * button is pressed in the <strong>Image</strong> dialog window.\r
+ * If not set, CKEditor will use <code>{@link CKEDITOR.config.filebrowserBrowseUrl}</code>.\r
+ * @name CKEDITOR.config.filebrowserImageBrowseUrl\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';\r
+ */\r
+\r
+/**\r
+ * The location of an external file browser that should be launched when the <strong>Browse Server</strong>\r
+ * button is pressed in the <strong>Flash</strong> dialog window.\r
+ * If not set, CKEditor will use <code>{@link CKEDITOR.config.filebrowserBrowseUrl}</code>.\r
+ * @name CKEDITOR.config.filebrowserFlashBrowseUrl\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';\r
+ */\r
+\r
+/**\r
+ * The location of the script that handles file uploads in the <strong>Image</strong> dialog window.\r
+ * If not set, CKEditor will use <code>{@link CKEDITOR.config.filebrowserUploadUrl}</code>.\r
+ * @name CKEDITOR.config.filebrowserImageUploadUrl\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';\r
+ */\r
+\r
+/**\r
+ * The location of the script that handles file uploads in the <strong>Flash</strong> dialog window.\r
+ * If not set, CKEditor will use <code>{@link CKEDITOR.config.filebrowserUploadUrl}</code>.\r
+ * @name CKEDITOR.config.filebrowserFlashUploadUrl\r
+ * @since 3.0\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';\r
+ */\r
+\r
+/**\r
+ * The location of an external file browser that should be launched when the <strong>Browse Server</strong>\r
+ * button is pressed in the <strong>Link</strong> tab of the <strong>Image</strong> dialog window.\r
+ * If not set, CKEditor will use <code>{@link CKEDITOR.config.filebrowserBrowseUrl}</code>.\r
+ * @name CKEDITOR.config.filebrowserImageBrowseLinkUrl\r
+ * @since 3.2\r
+ * @type String\r
+ * @default <code>''</code> (empty string = disabled)\r
+ * @example\r
+ * config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';\r
+ */\r
+\r
+/**\r
+ * The features to use in the file browser popup window.\r
+ * @name CKEDITOR.config.filebrowserWindowFeatures\r
+ * @since 3.4.1\r
+ * @type String\r
+ * @default <code>'location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes'</code>\r
+ * @example\r
+ * config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';\r
+ */\r
+\r
+/**\r
+ * The width of the file browser popup window. It can be a number denoting a value in\r
+ * pixels or a percent string.\r
+ * @name CKEDITOR.config.filebrowserWindowWidth\r
+ * @type Number|String\r
+ * @default <code>'80%'</code>\r
+ * @example\r
+ * config.filebrowserWindowWidth = 750;\r
+ * @example\r
+ * config.filebrowserWindowWidth = '50%';\r
+ */\r
+\r
+/**\r
+ * The height of the file browser popup window. It can be a number denoting a value in\r
+ * pixels or a percent string.\r
+ * @name CKEDITOR.config.filebrowserWindowHeight\r
+ * @type Number|String\r
+ * @default <code>'70%'</code>\r
+ * @example\r
+ * config.filebrowserWindowHeight = 580;\r
+ * @example\r
+ * config.filebrowserWindowHeight = '50%';\r
+ */\r
Got questions, comments, patches, etc.? Contact Jason Woofenden