ckeditor.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. /**
  2. * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. 'use strict';
  6. import Editor from './ckeditor5/editor.js';
  7. import Collection from './ckeditor5/utils/collection.js';
  8. import Config from './ckeditor5/utils/config.js';
  9. import CKEditorError from './ckeditor5/utils/ckeditorerror.js';
  10. import isArrayLike from './ckeditor5/utils/lib/lodash/isArrayLike.js';
  11. import clone from './ckeditor5/utils/lib/lodash/clone.js';
  12. import utils from './ckeditor5/utils/utils.js';
  13. /**
  14. * This is the API entry point. The entire CKEditor code runs under this object.
  15. *
  16. * @namespace CKEDITOR
  17. */
  18. const CKEDITOR = {
  19. /**
  20. * A collection containing all editor instances created.
  21. *
  22. * @readonly
  23. * @member {utils.Collection} CKEDITOR.instances
  24. */
  25. instances: new Collection(),
  26. /**
  27. * Holds global configuration defaults, which will be used by editor instances when such configurations are not
  28. * available on them directly.
  29. *
  30. * @readonly
  31. * @member {utils.Config} CKEDITOR.config
  32. */
  33. config: new Config(),
  34. /**
  35. * Creates an editor instance for the provided DOM element.
  36. *
  37. * The creation of editor instances is an asynchronous operation, therefore a promise is returned by this
  38. * method.
  39. *
  40. * CKEDITOR.create( '#content' );
  41. *
  42. * CKEDITOR.create( '#content' ).then( ( editor ) => {
  43. * // Manipulate "editor" here.
  44. * } );
  45. *
  46. * @method CKEDITOR.create
  47. * @param {String|HTMLElement|HTMLCollection|NodeList|Array.<HTMLElement>|Object.<String, HTMLElement>} elements
  48. * One or more elements on which the editor will be initialized. Different creators can handle these
  49. * elements differently, but usually a creator loads the data from the element and either makes
  50. * it editable or hides it and inserts the editor UI next to it.
  51. * @returns {Promise} A promise, which will be fulfilled with the created editor.
  52. */
  53. create( elements, config ) {
  54. return new Promise( ( resolve ) => {
  55. const editor = new Editor( normalizeElements( elements ), config );
  56. this.instances.add( editor );
  57. // Remove the editor from `instances` when destroyed.
  58. editor.once( 'destroy', () => {
  59. this.instances.remove( editor );
  60. } );
  61. resolve(
  62. // Initializes the editor, which returns a promise.
  63. editor.init()
  64. .then( () => {
  65. // After initialization, return the created editor.
  66. return editor;
  67. } )
  68. );
  69. } );
  70. }
  71. };
  72. export default CKEDITOR;
  73. function normalizeElements( elements ) {
  74. let elementsObject;
  75. // If a query selector has been passed, transform it into a real element.
  76. if ( typeof elements == 'string' ) {
  77. elementsObject = toElementsObject( document.querySelectorAll( elements ) );
  78. }
  79. // Arrays and array-like objects.
  80. else if ( isArrayLike( elements ) ) {
  81. elementsObject = toElementsObject( elements );
  82. }
  83. // Single HTML element.
  84. else if ( elements instanceof HTMLElement ) {
  85. elementsObject = toElementsObject( [ elements ] );
  86. }
  87. // Object.
  88. else {
  89. elementsObject = clone( elements );
  90. }
  91. if ( !Object.keys( elementsObject ).length ) {
  92. throw new CKEditorError( 'ckeditor5-create-no-elements: No elements have been passed to CKEDITOR.create()' );
  93. }
  94. return elementsObject;
  95. }
  96. function toElementsObject( elements ) {
  97. return Array.from( elements ).reduce( ( ret, el ) => {
  98. ret[ getEditorElementName( el ) ] = el;
  99. return ret;
  100. }, {} );
  101. }
  102. function getEditorElementName( element ) {
  103. if ( element.id ) {
  104. return element.id;
  105. }
  106. if ( element.dataset.editable ) {
  107. return element.dataset.editable;
  108. }
  109. return 'editable' + utils.uid();
  110. }