htmldataprocessor.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. /**
  2. * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. import BasicHtmlWriter from './basichtmlwriter.js';
  6. import DomConverter from '../view/domconverter.js';
  7. import { NBSP_FILLER } from '../view/filler.js';
  8. /**
  9. * HtmlDataProcessor class.
  10. * This data processor implementation uses HTML as input/output data.
  11. *
  12. * @memberOf engine.dataProcessor
  13. * @implements engine.dataProcessor.DataProcessor
  14. */
  15. export default class HtmlDataProcessor {
  16. /**
  17. * Creates a new instance of the HtmlDataProcessor class.
  18. */
  19. constructor() {
  20. /**
  21. * DOMParser instance used to parse HTML string to HTMLDocument.
  22. *
  23. * @private
  24. * @member {DOMParser} engine.dataProcessor.HtmlDataProcessor#_domParser
  25. */
  26. this._domParser = new DOMParser();
  27. /**
  28. * DOM converter used to convert DOM elements to view elements.
  29. *
  30. * @private
  31. * @member {engine.view.DomConverter} engine.dataProcessor.HtmlDataProcessor#_domConverter.
  32. */
  33. this._domConverter = new DomConverter( { blockFiller: NBSP_FILLER } );
  34. /**
  35. * BasicHtmlWriter instance used to convert DOM elements to HTML string.
  36. *
  37. * @private
  38. * @member {engine.dataProcessor.BasicHtmlWriter} engine.dataProcessor.HtmlDataProcessor#_htmlWriter
  39. */
  40. this._htmlWriter = new BasicHtmlWriter();
  41. }
  42. /**
  43. * Converts provided {@link engine.view.DocumentFragment DocumentFragment} to data format - in this case HTML string.
  44. *
  45. * @param {engine.view.DocumentFragment} viewFragment
  46. * @returns {String} HTML string.
  47. */
  48. toData( viewFragment ) {
  49. // Convert view DocumentFragment to DOM DocumentFragment.
  50. const domFragment = this._domConverter.viewToDom( viewFragment, document );
  51. // Convert DOM DocumentFragment to HTML output.
  52. return this._htmlWriter.getHtml( domFragment );
  53. }
  54. /**
  55. * Converts provided HTML string to view tree.
  56. *
  57. * @param {String} data HTML string.
  58. * @returns {engine.view.Node|engine.view.DocumentFragment|null} Converted view element.
  59. */
  60. toView( data ) {
  61. // Convert input HTML data to DOM DocumentFragment.
  62. const domFragment = this._toDom( data );
  63. // Convert DOM DocumentFragment to view DocumentFragment.
  64. return this._domConverter.domToView( domFragment );
  65. }
  66. /**
  67. * Converts HTML String to its DOM representation. Returns DocumentFragment, containing nodes parsed from
  68. * provided data.
  69. *
  70. * @private
  71. * @param {String} data
  72. * @returns {DocumentFragment}
  73. */
  74. _toDom( data ) {
  75. data = `<div>${ data }</div>`;
  76. const document = this._domParser.parseFromString( data, 'text/xml' );
  77. // Temporary parse validation.
  78. const parserError = document.querySelector( 'parsererror' );
  79. if ( parserError ) {
  80. throw new Error( parserError.querySelector( 'div' ).textContent );
  81. }
  82. const fragment = document.createDocumentFragment();
  83. const nodes = document.documentElement.childNodes;
  84. while ( nodes.length > 0 ) {
  85. fragment.appendChild( nodes[ 0 ] );
  86. }
  87. return fragment;
  88. }
  89. }