editableview.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. /**
  2. * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. 'use strict';
  6. import View from '../ui/view.js';
  7. import CKEditorError from '../ckeditorerror.js';
  8. /**
  9. * @memberOf core.editable
  10. * @extends core.ui.View
  11. */
  12. export default class EditableView extends View {
  13. /**
  14. * The element which is the main editable element (usually the one with `contentEditable="true"`).
  15. *
  16. * @readonly
  17. * @member {HTMLElement} core.editable.EditableView#editableElement
  18. */
  19. /**
  20. * Sets the {@link #editableElement} property and applies necessary bindings to it.
  21. *
  22. * @param {HTMLElement} editableElement
  23. */
  24. setEditableElement( editableElement ) {
  25. const bind = this.attributeBinder;
  26. if ( this.editableElement ) {
  27. throw new CKEditorError(
  28. 'editableview-cannot-override-editableelement: The editableElement cannot be overriden.'
  29. );
  30. }
  31. this.editableElement = editableElement;
  32. this.applyTemplateToElement( editableElement, {
  33. on: {
  34. focus: () => {
  35. this.model.isFocused = true;
  36. },
  37. blur: () => {
  38. this.model.isFocused = false;
  39. }
  40. },
  41. attributes: {
  42. contentEditable: bind.to( 'isEditable' )
  43. }
  44. } );
  45. }
  46. }