Parcourir la source

Updated docs in ImageStyleCommand.

Szymon Kupś il y a 9 ans
Parent
commit
2e1b939fa7
1 fichiers modifiés avec 49 ajouts et 6 suppressions
  1. 49 6
      packages/ckeditor5-image/src/imagestyle/imagestylecommand.js

+ 49 - 6
packages/ckeditor5-image/src/imagestyle/imagestylecommand.js

@@ -10,27 +10,59 @@
 import Command from '../../core/command/command.js';
 import { isImage, getStyleByValue } from './utils.js';
 
+/**
+ * The image style command. It is used to apply different image styles.
+ *
+ * @extends module:core/command/command~Command
+ */
 export default class ImageStyleCommand extends Command {
+
+	/**
+	 * Creates instance of the command.
+	 *
+	 * @param {module:core/editor/editor~Editor} editor Editor instance.
+	 * @param {Object} styles Allowed styles. See {@link module:image/imagestyle/imagestyleengine~ImageStyleFormat
+	 * ImageStyleFormat} for more information.
+	 */
 	constructor( editor, styles ) {
 		super( editor );
 
+		/**
+		 * The current style value.
+		 *
+		 * @readonly
+		 * @observable
+		 * @member {String} #value
+		 */
 		this.set( 'value', false );
 
+		/**
+		 * Image styles uses by this command.
+		 *
+		 * @readonly
+		 * @member {Object} Allowed image styles. See {@link module:image/imagestyle/imagestyleengine~ImageStyleFormat}.
+		 */
 		this.styles = styles;
 
+		// Update current value and refresh state each time something change in model document.
 		this.listenTo( editor.document, 'changesDone', () => {
 			this._updateValue();
 			this.refreshState();
 		} );
 	}
 
+	/**
+	 * Updates command's value.
+	 *
+	 * @private
+	 */
 	_updateValue() {
 		const doc = this.editor.document;
 		const element = doc.selection.getSelectedElement();
 
 		if ( isImage( element ) ) {
-			if ( element.hasAttribute( 'style' ) ) {
-				const value = element.getAttribute( 'style' );
+			if ( element.hasAttribute( 'imageStyle' ) ) {
+				const value = element.getAttribute( 'imageStyle' );
 
 				// Check if value exists.
 				this.value = ( getStyleByValue( value, this.styles ) ? value : false );
@@ -43,19 +75,30 @@ export default class ImageStyleCommand extends Command {
 		}
 	}
 
+	/**
+	 * @inheritDoc
+	 */
 	_checkEnabled() {
 		const element = this.editor.document.selection.getSelectedElement();
 
 		return isImage( element );
 	}
 
-	_doExecute( options = {} ) {
-		// TODO: add batch to options.
+	/**
+	 * Executes command.
+	 *
+	 * @protected
+	 * @param {Object} options
+	 * @param {String} options.value Value to apply. It must be one of the values from styles passed to {@link #constructor}.
+	 * @param {module:engine/model/batch~Batch} [options.batch] Batch to collect all the change steps. New batch will be
+	 * created if this option is not set.
+	 */
+	_doExecute( options ) {
 		const currentValue = this.value;
 		const newValue = options.value;
 
 		// Check if new value is valid.
-		if ( getStyleByValue( newValue, this.styles ) === undefined ) {
+		if ( !getStyleByValue( newValue, this.styles ) ) {
 			return;
 		}
 
@@ -72,7 +115,7 @@ export default class ImageStyleCommand extends Command {
 		doc.enqueueChanges( () => {
 			const batch = options.batch || doc.batch();
 
-			batch.setAttribute( imageElement, 'style', newValue );
+			batch.setAttribute( imageElement, 'imageStyle', newValue );
 		} );
 	}
 }