converters.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. /**
  2. * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. import first from '@ckeditor/ckeditor5-utils/src/first';
  6. /**
  7. * @module image/imagestyle/converters
  8. */
  9. /**
  10. * Returns a converter for the `imageStyle` attribute. It can be used for adding, changing and removing the attribute.
  11. *
  12. * @param {Object} styles An object containing available styles. See {@link module:image/imagestyle/imagestyleengine~ImageStyleFormat}
  13. * for more details.
  14. * @returns {Function} A model-to-view attribute converter.
  15. */
  16. export function modelToViewStyleAttribute( styles ) {
  17. return ( evt, data, consumable, conversionApi ) => {
  18. if ( !consumable.consume( data.item, evt.name ) ) {
  19. return;
  20. }
  21. // Check if there is class name associated with given value.
  22. const newStyle = getStyleByName( data.attributeNewValue, styles );
  23. const oldStyle = getStyleByName( data.attributeOldValue, styles );
  24. const viewElement = conversionApi.mapper.toViewElement( data.item );
  25. if ( oldStyle ) {
  26. viewElement.removeClass( oldStyle.className );
  27. }
  28. if ( newStyle ) {
  29. viewElement.addClass( newStyle.className );
  30. }
  31. };
  32. }
  33. /**
  34. * Returns a view-to-model converter converting image CSS classes to a proper value in the model.
  35. *
  36. * @param {Array.<module:image/imagestyle/imagestyleengine~ImageStyleFormat>} styles Styles for which the converter is created.
  37. * @returns {Function} A view-to-model converter.
  38. */
  39. export function viewToModelStyleAttribute( styles ) {
  40. // Convert only non–default styles.
  41. const filteredStyles = styles.filter( style => !style.isDefault );
  42. return ( evt, data, conversionApi ) => {
  43. if ( !data.modelRange ) {
  44. return;
  45. }
  46. const viewFigureElement = data.viewItem;
  47. const modelImageElement = first( data.modelRange.getItems() );
  48. // Check if `imageStyle` attribute is allowed for current element.
  49. if ( !conversionApi.schema.checkAttribute( modelImageElement, 'imageStyle' ) ) {
  50. return;
  51. }
  52. // Convert style one by one.
  53. for ( const style of filteredStyles ) {
  54. // Try to consume class corresponding with style.
  55. if ( conversionApi.consumable.consume( viewFigureElement, { class: style.className } ) ) {
  56. // And convert this style to model attribute.
  57. conversionApi.writer.setAttribute( 'imageStyle', style.name, modelImageElement );
  58. }
  59. }
  60. };
  61. }
  62. // Returns style with given `name` from array of styles.
  63. //
  64. // @param {String} name
  65. // @param {Array.<module:image/imagestyle/imagestyleengine~ImageStyleFormat> } styles
  66. // @return {module:image/imagestyle/imagestyleengine~ImageStyleFormat|undefined}
  67. function getStyleByName( name, styles ) {
  68. for ( const style of styles ) {
  69. if ( style.name === name ) {
  70. return style;
  71. }
  72. }
  73. }