8
0

inlineeditableuiview.js 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. /**
  2. * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. /**
  6. * @module ui/editableui/inline/inlineeditableuiview
  7. */
  8. import EditableUIView from '../../editableui/editableuiview';
  9. /**
  10. * The inline editable UI class implementing an inline {@link module:ui/editableui/editableuiview~EditableUIView}.
  11. *
  12. * @extends module:ui/editableui/editableuiview~EditableUIView
  13. */
  14. export default class InlineEditableUIView extends EditableUIView {
  15. /**
  16. * Creates an instance of the InlineEditableUIView class.
  17. *
  18. * @param {module:utils/locale~Locale} [locale] The locale instance.
  19. * @param {HTMLElement} [editableElement] The editable element. If not specified, the
  20. * {@link module:ui/editableui/editableuiview~EditableUIView}
  21. * will create it. Otherwise, the existing element will be used.
  22. */
  23. constructor( locale, editingView, editableElement ) {
  24. super( locale, editingView, editableElement );
  25. /**
  26. * The name of the editable UI view.
  27. *
  28. * @observable
  29. * @member {String} #name
  30. */
  31. this.set( 'name', null );
  32. this.extendTemplate( {
  33. attributes: {
  34. role: 'textbox',
  35. class: 'ck-editor__editable_inline'
  36. }
  37. } );
  38. }
  39. enableEditingRootListeners() {
  40. super.enableEditingRootListeners();
  41. const t = this.t;
  42. const updateAriaLabelAttribute = () => {
  43. this.editingView.change( writer => {
  44. if ( this.name ) {
  45. writer.setAttribute( 'aria-label', t( 'Rich Text Editor, %0', [ this.name ] ), this.viewRoot );
  46. } else {
  47. writer.removeAttribute( 'aria-label', this.viewRoot );
  48. }
  49. } );
  50. };
  51. this.on( 'change:name', updateAriaLabelAttribute );
  52. updateAriaLabelAttribute();
  53. }
  54. disableEditingRootListeners() {
  55. this.editingView.change( writer => {
  56. writer.removeAttribute( 'aria-label', this.viewRoot );
  57. } );
  58. }
  59. }