PageRenderTime 47ms CodeModel.GetById 17ms RepoModel.GetById 1ms app.codeStats 0ms

/profiles/openpublic/libraries/ckeditor/_source/plugins/filebrowser/plugin.js

https://github.com/dphan/OpenPublic
JavaScript | 501 lines | 190 code | 47 blank | 264 comment | 57 complexity | 0ade4b5777449977bf5b2995d7b5cd66 MD5 | raw file
  1. /*
  2. Copyright (c) 2003-2010, CKSource - Frederico Knabben. All rights reserved.
  3. For licensing, see LICENSE.html or http://ckeditor.com/license
  4. */
  5. /**
  6. * @fileOverview The "filebrowser" plugin, it adds support for file uploads and
  7. * browsing.
  8. *
  9. * When file is selected inside of the file browser or uploaded, its url is
  10. * inserted automatically to a field, which is described in the 'filebrowser'
  11. * attribute. To specify field that should be updated, pass the tab id and
  12. * element id, separated with a colon.
  13. *
  14. * Example 1: (Browse)
  15. *
  16. * <pre>
  17. * {
  18. * type : 'button',
  19. * id : 'browse',
  20. * filebrowser : 'tabId:elementId',
  21. * label : editor.lang.common.browseServer
  22. * }
  23. * </pre>
  24. *
  25. * If you set the 'filebrowser' attribute on any element other than
  26. * 'fileButton', the 'Browse' action will be triggered.
  27. *
  28. * Example 2: (Quick Upload)
  29. *
  30. * <pre>
  31. * {
  32. * type : 'fileButton',
  33. * id : 'uploadButton',
  34. * filebrowser : 'tabId:elementId',
  35. * label : editor.lang.common.uploadSubmit,
  36. * 'for' : [ 'upload', 'upload' ]
  37. * }
  38. * </pre>
  39. *
  40. * If you set the 'filebrowser' attribute on a fileButton element, the
  41. * 'QuickUpload' action will be executed.
  42. *
  43. * Filebrowser plugin also supports more advanced configuration (through
  44. * javascript object).
  45. *
  46. * The following settings are supported:
  47. *
  48. * <pre>
  49. * [action] - Browse or QuickUpload
  50. * [target] - field to update, tabId:elementId
  51. * [params] - additional arguments to be passed to the server connector (optional)
  52. * [onSelect] - function to execute when file is selected/uploaded (optional)
  53. * [url] - the URL to be called (optional)
  54. * </pre>
  55. *
  56. * Example 3: (Quick Upload)
  57. *
  58. * <pre>
  59. * {
  60. * type : 'fileButton',
  61. * label : editor.lang.common.uploadSubmit,
  62. * id : 'buttonId',
  63. * filebrowser :
  64. * {
  65. * action : 'QuickUpload', //required
  66. * target : 'tab1:elementId', //required
  67. * params : //optional
  68. * {
  69. * type : 'Files',
  70. * currentFolder : '/folder/'
  71. * },
  72. * onSelect : function( fileUrl, errorMessage ) //optional
  73. * {
  74. * // Do not call the built-in selectFuntion
  75. * // return false;
  76. * }
  77. * },
  78. * 'for' : [ 'tab1', 'myFile' ]
  79. * }
  80. * </pre>
  81. *
  82. * Suppose we have a file element with id 'myFile', text field with id
  83. * 'elementId' and a fileButton. If filebowser.url is not specified explicitly,
  84. * form action will be set to 'filebrowser[DialogName]UploadUrl' or, if not
  85. * specified, to 'filebrowserUploadUrl'. Additional parameters from 'params'
  86. * object will be added to the query string. It is possible to create your own
  87. * uploadHandler and cancel the built-in updateTargetElement command.
  88. *
  89. * Example 4: (Browse)
  90. *
  91. * <pre>
  92. * {
  93. * type : 'button',
  94. * id : 'buttonId',
  95. * label : editor.lang.common.browseServer,
  96. * filebrowser :
  97. * {
  98. * action : 'Browse',
  99. * url : '/ckfinder/ckfinder.html&amp;type=Images',
  100. * target : 'tab1:elementId'
  101. * }
  102. * }
  103. * </pre>
  104. *
  105. * In this example, after pressing a button, file browser will be opened in a
  106. * popup. If we don't specify filebrowser.url attribute,
  107. * 'filebrowser[DialogName]BrowseUrl' or 'filebrowserBrowseUrl' will be used.
  108. * After selecting a file in a file browser, an element with id 'elementId' will
  109. * be updated. Just like in the third example, a custom 'onSelect' function may be
  110. * defined.
  111. */
  112. ( function()
  113. {
  114. /**
  115. * Adds (additional) arguments to given url.
  116. *
  117. * @param {String}
  118. * url The url.
  119. * @param {Object}
  120. * params Additional parameters.
  121. */
  122. function addQueryString( url, params )
  123. {
  124. var queryString = [];
  125. if ( !params )
  126. return url;
  127. else
  128. {
  129. for ( var i in params )
  130. queryString.push( i + "=" + encodeURIComponent( params[ i ] ) );
  131. }
  132. return url + ( ( url.indexOf( "?" ) != -1 ) ? "&" : "?" ) + queryString.join( "&" );
  133. }
  134. /**
  135. * Make a string's first character uppercase.
  136. *
  137. * @param {String}
  138. * str String.
  139. */
  140. function ucFirst( str )
  141. {
  142. str += '';
  143. var f = str.charAt( 0 ).toUpperCase();
  144. return f + str.substr( 1 );
  145. }
  146. /**
  147. * The onlick function assigned to the 'Browse Server' button. Opens the
  148. * file browser and updates target field when file is selected.
  149. *
  150. * @param {CKEDITOR.event}
  151. * evt The event object.
  152. */
  153. function browseServer( evt )
  154. {
  155. var dialog = this.getDialog();
  156. var editor = dialog.getParentEditor();
  157. editor._.filebrowserSe = this;
  158. var width = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowWidth' ]
  159. || editor.config.filebrowserWindowWidth || '80%';
  160. var height = editor.config[ 'filebrowser' + ucFirst( dialog.getName() ) + 'WindowHeight' ]
  161. || editor.config.filebrowserWindowHeight || '70%';
  162. var params = this.filebrowser.params || {};
  163. params.CKEditor = editor.name;
  164. params.CKEditorFuncNum = editor._.filebrowserFn;
  165. if ( !params.langCode )
  166. params.langCode = editor.langCode;
  167. var url = addQueryString( this.filebrowser.url, params );
  168. editor.popup( url, width, height, editor.config.fileBrowserWindowFeatures );
  169. }
  170. /**
  171. * The onlick function assigned to the 'Upload' button. Makes the final
  172. * decision whether form is really submitted and updates target field when
  173. * file is uploaded.
  174. *
  175. * @param {CKEDITOR.event}
  176. * evt The event object.
  177. */
  178. function uploadFile( evt )
  179. {
  180. var dialog = this.getDialog();
  181. var editor = dialog.getParentEditor();
  182. editor._.filebrowserSe = this;
  183. // If user didn't select the file, stop the upload.
  184. if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getInputElement().$.value )
  185. return false;
  186. if ( !dialog.getContentElement( this[ 'for' ][ 0 ], this[ 'for' ][ 1 ] ).getAction() )
  187. return false;
  188. return true;
  189. }
  190. /**
  191. * Setups the file element.
  192. *
  193. * @param {CKEDITOR.ui.dialog.file}
  194. * fileInput The file element used during file upload.
  195. * @param {Object}
  196. * filebrowser Object containing filebrowser settings assigned to
  197. * the fileButton associated with this file element.
  198. */
  199. function setupFileElement( editor, fileInput, filebrowser )
  200. {
  201. var params = filebrowser.params || {};
  202. params.CKEditor = editor.name;
  203. params.CKEditorFuncNum = editor._.filebrowserFn;
  204. if ( !params.langCode )
  205. params.langCode = editor.langCode;
  206. fileInput.action = addQueryString( filebrowser.url, params );
  207. fileInput.filebrowser = filebrowser;
  208. }
  209. /**
  210. * Traverse through the content definition and attach filebrowser to
  211. * elements with 'filebrowser' attribute.
  212. *
  213. * @param String
  214. * dialogName Dialog name.
  215. * @param {CKEDITOR.dialog.dialogDefinitionObject}
  216. * definition Dialog definition.
  217. * @param {Array}
  218. * elements Array of {@link CKEDITOR.dialog.contentDefinition}
  219. * objects.
  220. */
  221. function attachFileBrowser( editor, dialogName, definition, elements )
  222. {
  223. var element, fileInput;
  224. for ( var i in elements )
  225. {
  226. element = elements[ i ];
  227. if ( element.type == 'hbox' || element.type == 'vbox' )
  228. attachFileBrowser( editor, dialogName, definition, element.children );
  229. if ( !element.filebrowser )
  230. continue;
  231. if ( typeof element.filebrowser == 'string' )
  232. {
  233. var fb =
  234. {
  235. action : ( element.type == 'fileButton' ) ? 'QuickUpload' : 'Browse',
  236. target : element.filebrowser
  237. };
  238. element.filebrowser = fb;
  239. }
  240. if ( element.filebrowser.action == 'Browse' )
  241. {
  242. var url = element.filebrowser.url;
  243. if ( url === undefined )
  244. {
  245. url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'BrowseUrl' ];
  246. if ( url === undefined )
  247. url = editor.config.filebrowserBrowseUrl;
  248. }
  249. if ( url )
  250. {
  251. element.onClick = browseServer;
  252. element.filebrowser.url = url;
  253. element.hidden = false;
  254. }
  255. }
  256. else if ( element.filebrowser.action == 'QuickUpload' && element[ 'for' ] )
  257. {
  258. url = element.filebrowser.url;
  259. if ( url === undefined )
  260. {
  261. url = editor.config[ 'filebrowser' + ucFirst( dialogName ) + 'UploadUrl' ];
  262. if ( url === undefined )
  263. url = editor.config.filebrowserUploadUrl;
  264. }
  265. if ( url )
  266. {
  267. var onClick = element.onClick;
  268. element.onClick = function( evt )
  269. {
  270. // "element" here means the definition object, so we need to find the correct
  271. // button to scope the event call
  272. var sender = evt.sender;
  273. if ( onClick && onClick.call( sender, evt ) === false )
  274. return false;
  275. return uploadFile.call( sender, evt );
  276. };
  277. element.filebrowser.url = url;
  278. element.hidden = false;
  279. setupFileElement( editor, definition.getContents( element[ 'for' ][ 0 ] ).get( element[ 'for' ][ 1 ] ), element.filebrowser );
  280. }
  281. }
  282. }
  283. }
  284. /**
  285. * Updates the target element with the url of uploaded/selected file.
  286. *
  287. * @param {String}
  288. * url The url of a file.
  289. */
  290. function updateTargetElement( url, sourceElement )
  291. {
  292. var dialog = sourceElement.getDialog();
  293. var targetElement = sourceElement.filebrowser.target || null;
  294. url = url.replace( /#/g, '%23' );
  295. // If there is a reference to targetElement, update it.
  296. if ( targetElement )
  297. {
  298. var target = targetElement.split( ':' );
  299. var element = dialog.getContentElement( target[ 0 ], target[ 1 ] );
  300. if ( element )
  301. {
  302. element.setValue( url );
  303. dialog.selectPage( target[ 0 ] );
  304. }
  305. }
  306. }
  307. /**
  308. * Returns true if filebrowser is configured in one of the elements.
  309. *
  310. * @param {CKEDITOR.dialog.dialogDefinitionObject}
  311. * definition Dialog definition.
  312. * @param String
  313. * tabId The tab id where element(s) can be found.
  314. * @param String
  315. * elementId The element id (or ids, separated with a semicolon) to check.
  316. */
  317. function isConfigured( definition, tabId, elementId )
  318. {
  319. if ( elementId.indexOf( ";" ) !== -1 )
  320. {
  321. var ids = elementId.split( ";" );
  322. for ( var i = 0 ; i < ids.length ; i++ )
  323. {
  324. if ( isConfigured( definition, tabId, ids[i] ) )
  325. return true;
  326. }
  327. return false;
  328. }
  329. var elementFileBrowser = definition.getContents( tabId ).get( elementId ).filebrowser;
  330. return ( elementFileBrowser && elementFileBrowser.url );
  331. }
  332. function setUrl( fileUrl, data )
  333. {
  334. var dialog = this._.filebrowserSe.getDialog(),
  335. targetInput = this._.filebrowserSe[ 'for' ],
  336. onSelect = this._.filebrowserSe.filebrowser.onSelect;
  337. if ( targetInput )
  338. dialog.getContentElement( targetInput[ 0 ], targetInput[ 1 ] ).reset();
  339. if ( typeof data == 'function' && data.call( this._.filebrowserSe ) === false )
  340. return;
  341. if ( onSelect && onSelect.call( this._.filebrowserSe, fileUrl, data ) === false )
  342. return;
  343. // The "data" argument may be used to pass the error message to the editor.
  344. if ( typeof data == 'string' && data )
  345. alert( data );
  346. if ( fileUrl )
  347. updateTargetElement( fileUrl, this._.filebrowserSe );
  348. }
  349. CKEDITOR.plugins.add( 'filebrowser',
  350. {
  351. init : function( editor, pluginPath )
  352. {
  353. editor._.filebrowserFn = CKEDITOR.tools.addFunction( setUrl, editor );
  354. }
  355. } );
  356. CKEDITOR.on( 'dialogDefinition', function( evt )
  357. {
  358. var definition = evt.data.definition,
  359. element;
  360. // Associate filebrowser to elements with 'filebrowser' attribute.
  361. for ( var i in definition.contents )
  362. {
  363. if ( ( element = definition.contents[ i ] ) )
  364. {
  365. attachFileBrowser( evt.editor, evt.data.name, definition, element.elements );
  366. if ( element.hidden && element.filebrowser )
  367. {
  368. element.hidden = !isConfigured( definition, element[ 'id' ], element.filebrowser );
  369. }
  370. }
  371. }
  372. } );
  373. } )();
  374. /**
  375. * The location of an external file browser, that should be launched when "Browse Server" button is pressed.
  376. * If configured, the "Browse Server" button will appear in Link, Image and Flash dialogs.
  377. * @see The <a href="http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader)">File Browser/Uploader</a> documentation.
  378. * @name CKEDITOR.config.filebrowserBrowseUrl
  379. * @since 3.0
  380. * @type String
  381. * @default '' (empty string = disabled)
  382. * @example
  383. * config.filebrowserBrowseUrl = '/browser/browse.php';
  384. */
  385. /**
  386. * The location of a script that handles file uploads.
  387. * If set, the "Upload" tab will appear in "Link", "Image" and "Flash" dialogs.
  388. * @name CKEDITOR.config.filebrowserUploadUrl
  389. * @see The <a href="http://docs.cksource.com/CKEditor_3.x/Developers_Guide/File_Browser_(Uploader)">File Browser/Uploader</a> documentation.
  390. * @since 3.0
  391. * @type String
  392. * @default '' (empty string = disabled)
  393. * @example
  394. * config.filebrowserUploadUrl = '/uploader/upload.php';
  395. */
  396. /**
  397. * The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Image dialog.
  398. * If not set, CKEditor will use {@link CKEDITOR.config.filebrowserBrowseUrl}.
  399. * @name CKEDITOR.config.filebrowserImageBrowseUrl
  400. * @since 3.0
  401. * @type String
  402. * @default '' (empty string = disabled)
  403. * @example
  404. * config.filebrowserImageBrowseUrl = '/browser/browse.php?type=Images';
  405. */
  406. /**
  407. * The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Flash dialog.
  408. * If not set, CKEditor will use {@link CKEDITOR.config.filebrowserBrowseUrl}.
  409. * @name CKEDITOR.config.filebrowserFlashBrowseUrl
  410. * @since 3.0
  411. * @type String
  412. * @default '' (empty string = disabled)
  413. * @example
  414. * config.filebrowserFlashBrowseUrl = '/browser/browse.php?type=Flash';
  415. */
  416. /**
  417. * The location of a script that handles file uploads in the Image dialog.
  418. * If not set, CKEditor will use {@link CKEDITOR.config.filebrowserUploadUrl}.
  419. * @name CKEDITOR.config.filebrowserImageUploadUrl
  420. * @since 3.0
  421. * @type String
  422. * @default '' (empty string = disabled)
  423. * @example
  424. * config.filebrowserImageUploadUrl = '/uploader/upload.php?type=Images';
  425. */
  426. /**
  427. * The location of a script that handles file uploads in the Flash dialog.
  428. * If not set, CKEditor will use {@link CKEDITOR.config.filebrowserUploadUrl}.
  429. * @name CKEDITOR.config.filebrowserFlashUploadUrl
  430. * @since 3.0
  431. * @type String
  432. * @default '' (empty string = disabled)
  433. * @example
  434. * config.filebrowserFlashUploadUrl = '/uploader/upload.php?type=Flash';
  435. */
  436. /**
  437. * The location of an external file browser, that should be launched when "Browse Server" button is pressed in the Link tab of Image dialog.
  438. * If not set, CKEditor will use {@link CKEDITOR.config.filebrowserBrowseUrl}.
  439. * @name CKEDITOR.config.filebrowserImageBrowseLinkUrl
  440. * @since 3.2
  441. * @type String
  442. * @default '' (empty string = disabled)
  443. * @example
  444. * config.filebrowserImageBrowseLinkUrl = '/browser/browse.php';
  445. */
  446. /**
  447. * The "features" to use in the file browser popup window.
  448. * @name CKEDITOR.config.filebrowserWindowFeatures
  449. * @since 3.4.1
  450. * @type String
  451. * @default 'location=no,menubar=no,toolbar=no,dependent=yes,minimizable=no,modal=yes,alwaysRaised=yes,resizable=yes,scrollbars=yes'
  452. * @example
  453. * config.filebrowserWindowFeatures = 'resizable=yes,scrollbars=no';
  454. */