1 | /**
|
2 | * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
|
3 | * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
4 | */
|
5 |
|
6 | /**
|
7 | * @module basic-styles/attributecommand
|
8 | */
|
9 |
|
10 | import { Command } from 'ckeditor5/src/core';
|
11 |
|
12 | /**
|
13 | * An extension of the base {@link module:core/command~Command} class, which provides utilities for a command
|
14 | * that toggles a single attribute on a text or an element.
|
15 | *
|
16 | * `AttributeCommand` uses {@link module:engine/model/document~Document#selection}
|
17 | * to decide which nodes (if any) should be changed, and applies or removes the attribute from them.
|
18 | *
|
19 | * The command checks the {@link module:engine/model/model~Model#schema} to decide if it can be enabled
|
20 | * for the current selection and to which nodes the attribute can be applied.
|
21 | *
|
22 | * @extends module:core/command~Command
|
23 | */
|
24 | export default class AttributeCommand extends Command {
|
25 | /**
|
26 | * @param {module:core/editor/editor~Editor} editor
|
27 | * @param {String} attributeKey Attribute that will be set by the command.
|
28 | */
|
29 | constructor( editor, attributeKey ) {
|
30 | super( editor );
|
31 |
|
32 | /**
|
33 | * The attribute that will be set by the command.
|
34 | *
|
35 | * @readonly
|
36 | * @member {String}
|
37 | */
|
38 | this.attributeKey = attributeKey;
|
39 |
|
40 | /**
|
41 | * Flag indicating whether the command is active. The command is active when the
|
42 | * {@link module:engine/model/selection~Selection#hasAttribute selection has the attribute} which means that:
|
43 | *
|
44 | * * If the selection is not empty – That the attribute is set on the first node in the selection that allows this attribute.
|
45 | * * If the selection is empty – That the selection has the attribute itself (which means that newly typed
|
46 | * text will have this attribute, too).
|
47 | *
|
48 | * @observable
|
49 | * @readonly
|
50 | * @member {Boolean} #value
|
51 | */
|
52 | }
|
53 |
|
54 | /**
|
55 | * Updates the command's {@link #value} and {@link #isEnabled} based on the current selection.
|
56 | */
|
57 | refresh() {
|
58 | const model = this.editor.model;
|
59 | const doc = model.document;
|
60 |
|
61 | this.value = this._getValueFromFirstAllowedNode();
|
62 | this.isEnabled = model.schema.checkAttributeInSelection( doc.selection, this.attributeKey );
|
63 | }
|
64 |
|
65 | /**
|
66 | * Executes the command — applies the attribute to the selection or removes it from the selection.
|
67 | *
|
68 | * If the command is active (`value == true`), it will remove attributes. Otherwise, it will set attributes.
|
69 | *
|
70 | * The execution result differs, depending on the {@link module:engine/model/document~Document#selection}:
|
71 | *
|
72 | * * If the selection is on a range, the command applies the attribute to all nodes in that range
|
73 | * (if they are allowed to have this attribute by the {@link module:engine/model/schema~Schema schema}).
|
74 | * * If the selection is collapsed in a non-empty node, the command applies the attribute to the
|
75 | * {@link module:engine/model/document~Document#selection} itself (note that typed characters copy attributes from the selection).
|
76 | * * If the selection is collapsed in an empty node, the command applies the attribute to the parent node of the selection (note
|
77 | * that the selection inherits all attributes from a node if it is in an empty node).
|
78 | *
|
79 | * @fires execute
|
80 | * @param {Object} [options] Command options.
|
81 | * @param {Boolean} [options.forceValue] If set, it will force the command behavior. If `true`, the command will apply the attribute,
|
82 | * otherwise the command will remove the attribute.
|
83 | * If not set, the command will look for its current value to decide what it should do.
|
84 | */
|
85 | execute( options = {} ) {
|
86 | const model = this.editor.model;
|
87 | const doc = model.document;
|
88 | const selection = doc.selection;
|
89 | const value = ( options.forceValue === undefined ) ? !this.value : options.forceValue;
|
90 |
|
91 | model.change( writer => {
|
92 | if ( selection.isCollapsed ) {
|
93 | if ( value ) {
|
94 | writer.setSelectionAttribute( this.attributeKey, true );
|
95 | } else {
|
96 | writer.removeSelectionAttribute( this.attributeKey );
|
97 | }
|
98 | } else {
|
99 | const ranges = model.schema.getValidRanges( selection.getRanges(), this.attributeKey );
|
100 |
|
101 | for ( const range of ranges ) {
|
102 | if ( value ) {
|
103 | writer.setAttribute( this.attributeKey, value, range );
|
104 | } else {
|
105 | writer.removeAttribute( this.attributeKey, range );
|
106 | }
|
107 | }
|
108 | }
|
109 | } );
|
110 | }
|
111 |
|
112 | /**
|
113 | * Checks the attribute value of the first node in the selection that allows the attribute.
|
114 | * For the collapsed selection returns the selection attribute.
|
115 | *
|
116 | * @private
|
117 | * @returns {Boolean} The attribute value.
|
118 | */
|
119 | _getValueFromFirstAllowedNode() {
|
120 | const model = this.editor.model;
|
121 | const schema = model.schema;
|
122 | const selection = model.document.selection;
|
123 |
|
124 | if ( selection.isCollapsed ) {
|
125 | return selection.hasAttribute( this.attributeKey );
|
126 | }
|
127 |
|
128 | for ( const range of selection.getRanges() ) {
|
129 | for ( const item of range.getItems() ) {
|
130 | if ( schema.checkAttribute( item, this.attributeKey ) ) {
|
131 | return item.hasAttribute( this.attributeKey );
|
132 | }
|
133 | }
|
134 | }
|
135 |
|
136 | return false;
|
137 | }
|
138 | }
|