containerelement.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. /**
  2. * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. 'use strict';
  6. import Element from './element.js';
  7. /**
  8. * Containers are elements which define document structure. They define boundaries for
  9. * {@link engine.treeView.AttributeElement attributes}. They are mostly use for block elements like `<p>` or `<div>`.
  10. *
  11. * Editing engine does not define fixed HTML DTD. This is why the type of the {@link engine.treeView.Element} need to
  12. * be defined by the feature developer.
  13. *
  14. * Creating an element you should use `ContainerElement` class or {@link engine.treeView.AttributeElement}. This is
  15. * important to define the type of the element because of two reasons:
  16. *
  17. * Firstly, {@link engine.treeView.DomConverter} needs the information what is an editable block to convert elements to
  18. * DOM properly. {@link engine.treeView.DomConverter} will ensure that `ContainerElement` is editable and it is possible
  19. * to put caret inside it, even if the container is empty.
  20. *
  21. * Secondly, {@link engine.treeView.Writer} use this information.
  22. * {@link engine.treeView.Writer#breakAttributes Break} and {@link engine.treeView.Writer#mergeAttributes Merge}
  23. * operations are performed only in a bounds of a container nodes.
  24. *
  25. * For instance if `<p>` is an container and `<b>` is attribute:
  26. *
  27. * <p><b>fo^o</b></p>
  28. *
  29. * {@link engine.treeView.Writer#breakAttributes breakAttributes} will create:
  30. *
  31. * <p><b>fo</b><b>o</b></p>
  32. *
  33. * There might be a need to mark `<span>` element as a container node, for example in situation when it will be a
  34. * container of an inline widget:
  35. *
  36. * <span color="red">foobar</span> // attribute
  37. * <span data-widget>foobar</span> // container
  38. *
  39. * @memberOf engine.treeView
  40. * @extends engine.treeView.Element
  41. */
  42. export default class ContainerElement extends Element {
  43. /**
  44. * Creates a container element.
  45. *
  46. * @see engine.treeView.Element
  47. */
  48. constructor( name, attrs, children ) {
  49. super( name, attrs, children );
  50. }
  51. /**
  52. * Returns block {@link engine.treeView.filler filler} offset or null if block filler is not needed.
  53. *
  54. * @returns {Number|false} Block filler offset or null if block filler is not needed.
  55. */
  56. getFillerOffset() {
  57. return this.getChildCount() === 0 ? 0 : null;
  58. }
  59. }