inline-editor.js 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. /**
  2. * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. /* globals console, window, document */
  6. import InlineEditor from '@ckeditor/ckeditor5-build-inline/src/ckeditor';
  7. import ImageResize from '@ckeditor/ckeditor5-image/src/imageresize';
  8. import { CS_CONFIG } from '@ckeditor/ckeditor5-cloud-services/tests/_utils/cloud-services-config';
  9. const inlineInjectElements = document.querySelectorAll( '#snippet-inline-editor [data-inline-inject]' );
  10. Array.from( inlineInjectElements ).forEach( inlineElement => {
  11. const config = {
  12. extraPlugins: [ ImageResize ],
  13. image: {
  14. resizeOptions: [
  15. {
  16. name: 'imageResize:original',
  17. label: 'Original',
  18. value: null
  19. },
  20. {
  21. name: 'imageResize:50',
  22. label: '50%',
  23. value: '50'
  24. },
  25. {
  26. name: 'imageResize:75',
  27. label: '75%',
  28. value: '75'
  29. }
  30. ],
  31. styles: [ 'full', 'alignLeft', 'alignRight' ],
  32. toolbar: [
  33. 'imageStyle:alignLeft',
  34. 'imageStyle:full',
  35. 'imageStyle:alignRight',
  36. '|',
  37. 'imageResize',
  38. '|',
  39. 'imageTextAlternative'
  40. ]
  41. },
  42. toolbar: {
  43. viewportTopOffset: window.getViewportTopOffsetConfig()
  44. },
  45. cloudServices: CS_CONFIG
  46. };
  47. if ( inlineElement.tagName.toLowerCase() == 'header' ) {
  48. config.removePlugins = [
  49. 'Blockquote',
  50. 'Image',
  51. 'ImageCaption',
  52. 'ImageStyle',
  53. 'ImageToolbar',
  54. 'ImageUpload',
  55. 'List',
  56. 'EasyImage',
  57. 'CKFinder',
  58. 'CKFinderUploadAdapter'
  59. ];
  60. config.toolbar.items = [ 'heading', '|', 'bold', 'italic', 'link' ];
  61. }
  62. InlineEditor
  63. .create( inlineElement, config )
  64. .then( editor => {
  65. window.editor = editor;
  66. } )
  67. .catch( err => {
  68. console.error( err );
  69. } );
  70. } );