浏览代码

InlineEditableUIView extends EditableUIView#template. Got rid of EditableUIView#setEditableElement method.

Aleksander Nowodzinski 9 年之前
父节点
当前提交
fb8b2fa10f

+ 31 - 38
packages/ckeditor5-ui/src/editableui/editableuiview.js

@@ -6,7 +6,6 @@
 'use strict';
 
 import View from '../view.js';
-import CKEditorError from '../../utils/ckeditorerror.js';
 
 /**
  * @memberOf ui.editableUI
@@ -16,56 +15,50 @@ export default class EditableUIView extends View {
 	/**
 	 * Creates an instance of the EditableUIView class.
 	 *
-	 * @method constructor
 	 * @param {ui.Model} model (View)Model of this view.
 	 * @param {utils.Locale} [locale] The {@link ckeditor5.Editor#locale editor's locale} instance.
 	 * @param {HTMLElement} [editableElement] The editable element. If not specified the editable UI view
 	 * should create it. Otherwise, the existing element should be used.
 	 */
+	constructor( model, locale, editableElement ) {
+		super( model, locale );
 
-	/**
-	 * The element which is the main editable element (usually the one with `contentEditable="true"`).
-	 *
-	 * @readonly
-	 * @member {HTMLElement} ui.editable.EditableUIView#editableElement
-	 */
-
-	/**
-	 * Sets the {@link #editableElement} property and applies necessary bindings to it.
-	 *
-	 * @param {HTMLElement} editableElement
-	 * @param {ui.TemplateDefinition} def
-	 */
-	setEditableElement( editableElement, def = { attributes: {} } ) {
 		const bind = this.attributeBinder;
-		const t = this.t;
-		const label = t( 'Rich Text Editor, %0', [ this.model.editableName ] );
 
-		if ( this.editableElement ) {
-			throw new CKEditorError(
-				'editableview-cannot-override-editableelement: The editableElement cannot be overriden.'
-			);
+		if ( editableElement ) {
+			this.element = this.editableElement = editableElement;
 		}
 
-		this.editableElement = editableElement;
+		this.template = {
+			tag: 'div',
+			attributes: {
+				class: [
+					bind.to( 'isFocused', value => value ? 'ck-focused' : 'ck-blurred' ),
+					'ck-editor__editable'
+				],
+				contenteditable: bind.to( 'isEditable' ),
+			}
+		};
+	}
 
-		if ( !def.attributes.class ) {
-			def.attributes.class = [];
+	init() {
+		if ( this.editableElement ) {
+			this.applyTemplateToElement( this.editableElement, this.template );
+		} else {
+			this.editableElement = this.element;
 		}
 
-		Object.assign( def.attributes, {
-			role: 'textbox',
-			'aria-label': label,
-			title: label,
-		} );
-
-		def.attributes.class.push(
-			'ck-editor__editable',
-			bind.to( 'isFocused', value => value ? 'ck-focused' : 'ck-blurred' )
-		);
-
-		def.attributes.contenteditable = bind.to( 'isEditable' );
+		return super.init();
+	}
 
-		this.applyTemplateToElement( editableElement, def );
+	destroy() {
+		this.editableElement.contentEditable = false;
 	}
+
+	/**
+	 * The element which is the main editable element (usually the one with `contentEditable="true"`).
+	 *
+	 * @readonly
+	 * @member {HTMLElement} ui.editable.EditableUIView#editableElement
+	 */
 }

+ 7 - 21
packages/ckeditor5-ui/src/editableui/inline/inlineeditableuiview.js

@@ -9,30 +9,16 @@ import EditableUIView from '/ckeditor5/ui/editableui/editableuiview.js';
 
 export default class InlineEditableUIView extends EditableUIView {
 	constructor( model, locale, editableElement ) {
-		super( model, locale );
+		super( model, locale, editableElement );
 
-		if ( editableElement ) {
-			this.element = editableElement;
-		} else {
-			this.template = {
-				tag: 'div'
-			};
-		}
-	}
+		const label = this.t( 'Rich Text Editor, %0', [ this.model.editableName ] );
 
-	init() {
-		this.setEditableElement( this.element, {
-			attributes: {
-				class: [ 'ck-editor__editable_inline' ]
-			},
+		Object.assign( this.template.attributes, {
+			role: 'textbox',
+			'aria-label': label,
+			title: label
 		} );
 
-		super.init();
-	}
-
-	destroy() {
-		super.destroy();
-
-		this.editableElement.contentEditable = false;
+		this.template.attributes.class.push( 'ck-editor__editable_inline' );
 	}
 }