Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added DocumentListStyle command #11232

Merged
merged 10 commits into from
Feb 9, 2022
Merged

Added DocumentListStyle command #11232

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
bbac39b
Added DocumentListStyle command
arkflpc Feb 7, 2022
c63dac8
Converting to list and style application in single batch
arkflpc Feb 8, 2022
dfe7b36
Moved some checks out of listwalker
arkflpc Feb 8, 2022
6a84586
Code refactoring.
niegowski Feb 8, 2022
c63648a
Fix after code-review
arkflpc Feb 9, 2022
ab4baf4
Apply review comment.
niegowski Feb 9, 2022
76f2f50
Fix after code-review
arkflpc Feb 9, 2022
3eb6716
Fix after code-review
arkflpc Feb 9, 2022
2631672
Reordered imports.
niegowski Feb 9, 2022
fe4e747
Fix after code-review
arkflpc Feb 9, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion packages/ckeditor5-list/src/documentlist/documentlistcommand.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,8 @@ export default class DocumentListCommand extends Command {
}
// Turning on the list items for a collapsed selection inside a list item.
else if ( document.selection.isCollapsed && blocks[ 0 ].hasAttribute( 'listType' ) ) {
const changedBlocks = getListItems( blocks[ 0 ] );
const documentListEditingPlugin = this.editor.plugins.get( 'DocumentListEditing' );
const changedBlocks = getListItems( blocks[ 0 ], documentListEditingPlugin.getSameListDefiningAttributes() );

for ( const block of changedBlocks ) {
writer.setAttribute( 'listType', this.type, block );
Expand Down
31 changes: 30 additions & 1 deletion packages/ckeditor5-list/src/documentlist/documentlistediting.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,14 @@ export default class DocumentListEditing extends Plugin {
* @inheritDoc
*/
init() {
/**
* TODO
*
* @private
* @type {Array.<String>}
*/
this._sameListDefiningAttributes = [ 'listType' ];

const editor = this.editor;
const model = editor.model;

Expand Down Expand Up @@ -120,6 +128,24 @@ export default class DocumentListEditing extends Plugin {
}
}

/**
* TODO
*
* @param {String} attributeName
*/
registerSameListDefiningAttributes( attributeName ) {
this._sameListDefiningAttributes.push( attributeName );
}

/**
* TODO
*
* @returns {Array.<String>}
*/
getSameListDefiningAttributes() {
return this._sameListDefiningAttributes;
}

/**
* Attaches the listener to the {@link module:engine/view/document~Document#event:delete} event and handles backspace/delete
* keys in and around document lists.
Expand Down Expand Up @@ -148,7 +174,10 @@ export default class DocumentListEditing extends Plugin {
return;
}

const previousBlock = ListWalker.first( positionParent, { sameIndent: true, sameItemType: true } );
const previousBlock = ListWalker.first( positionParent, {
sameListAttributes: this.getSameListDefiningAttributes(),
sameIndent: true
} );

// Outdent the first block of a first list item.
if ( !previousBlock && positionParent.getAttribute( 'listIndent' ) === 0 ) {
Expand Down
51 changes: 9 additions & 42 deletions packages/ckeditor5-list/src/documentlist/utils/listwalker.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
* @module list/documentlist/utils/listwalker
*/

import { first } from 'ckeditor5/src/utils';
import { first, toArray } from 'ckeditor5/src/utils';

/**
* Document list blocks iterator.
Expand All @@ -20,9 +20,7 @@ export default class ListWalker {
* @param {Object} options
* @param {'forward'|'backward'} [options.direction='backward'] The iterating direction.
* @param {Boolean} [options.includeSelf=false] Whether start block should be included in the result (if it's matching other criteria).
* @param {Boolean} [options.sameItemId=false] Whether should return only blocks with the same `listItemId` attribute
* as the start element.
* @param {Boolean} [options.sameItemType=false] Whether should return only blocks wit the same `listType` attribute.
* @param {Array.<String>} [options.sameListAttributes=[]] Additional attributes that must be the same for each block.
* @param {Boolean} [options.sameIndent=false] Whether blocks with the same indent level as the start block should be included
* in the result.
* @param {Boolean} [options.lowerIndent=false] Whether blocks with a lower indent level than the start block should be included
Expand All @@ -47,22 +45,6 @@ export default class ListWalker {
*/
this._referenceIndent = startElement.getAttribute( 'listIndent' );

/**
* The `listItemId` of the start block.
*
* @private
* @type {String}
*/
this._startItemId = startElement.getAttribute( 'listItemId' );

/**
* The `listType` of the start block.
*
* @private
* @type {String}
*/
this._startItemType = startElement.getAttribute( 'listType' );

/**
* The iterating direction.
*
Expand All @@ -72,28 +54,20 @@ export default class ListWalker {
this._isForward = options.direction == 'forward';

/**
* Whether should return only blocks with the same `listItemId` attribute as the start element.
* Whether start block should be included in the result (if it's matching other criteria).
*
* @private
* @type {Boolean}
*/
this._includeSelf = !!options.includeSelf;

/**
* Whether only blocks with the `listItemId` attribute same as the start element should be included.
* Additional attributes that must be the same for each block.
*
* @private
* @type {Boolean}
*/
this._sameItemId = !!options.sameItemId;

/**
* Whether should return only blocks wit the same `listType` attribute.
*
* @private
* @type {Boolean}
* @type {Array.<String>}
*/
this._sameItemType = !!options.sameItemType;
this._sameListAttributes = toArray( options.sameListAttributes || [] );

/**
* Whether blocks with the same indent level as the start block should be included in the result.
Expand Down Expand Up @@ -127,9 +101,7 @@ export default class ListWalker {
* @param {Object} options
* @param {'forward'|'backward'} [options.direction='backward'] The iterating direction.
* @param {Boolean} [options.includeSelf=false] Whether start block should be included in the result (if it's matching other criteria).
* @param {Boolean} [options.sameItemId=false] Whether should return only blocks with the same `listItemId` attribute
* as the start element.
* @param {Boolean} [options.sameItemType=false] Whether should return only blocks wit the same `listType` attribute.
* @param {Array.<String>} [options.sameListAttributes=[]] Additional attributes that must be the same for each block.
* @param {Boolean} [options.sameIndent=false] Whether blocks with the same indent level as the start block should be included
* in the result.
* @param {Boolean} [options.lowerIndent=false] Whether blocks with a lower indent level than the start block should be included
Expand Down Expand Up @@ -198,13 +170,8 @@ export default class ListWalker {
continue;
}

// Abort if item has a different ID.
if ( this._sameItemId && node.getAttribute( 'listItemId' ) != this._startItemId ) {
break;
}

// Abort if item has a different type.
if ( this._sameItemType && node.getAttribute( 'listType' ) != this._startItemType ) {
// Abort if item has any additionally specified attribute different.
if ( this._sameListAttributes.some( attr => node.getAttribute( attr ) !== this._startElement.getAttribute( attr ) ) ) {
break;
}
}
Expand Down
15 changes: 8 additions & 7 deletions packages/ckeditor5-list/src/documentlist/utils/model.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ export function getListItemBlocks( listItem, options = {} ) {
...options,
includeSelf: isForward,
sameIndent: true,
sameItemId: true
sameListAttributes: 'listItemId'
} ) );

return isForward ? items : items.reverse();
Expand All @@ -90,21 +90,22 @@ export function getNestedListBlocks( listItem ) {
}

/**
* Returns array of all blocks/items of the same list as given block (same indent, same type).
* Returns array of all blocks/items of the same list as given block (same indent, same type and properties).
*
* @protected
* @param {module:engine/model/element~Element} listItem Starting list item element.
* @param {Array.<String>} sameListDefiningAttributes TODO
* @returns {Array.<module:engine/model/element~Element>}
*/
export function getListItems( listItem ) {
export function getListItems( listItem, sameListDefiningAttributes ) {
const backwardBlocks = new ListWalker( listItem, {
sameIndent: true,
sameItemType: true
sameListAttributes: sameListDefiningAttributes
} );

const forwardBlocks = new ListWalker( listItem, {
sameIndent: true,
sameItemType: true,
sameListAttributes: sameListDefiningAttributes,
includeSelf: true,
direction: 'forward'
} );
Expand All @@ -125,7 +126,7 @@ export function getListItems( listItem ) {
export function isFirstBlockOfListItem( listBlock ) {
const previousSibling = ListWalker.first( listBlock, {
sameIndent: true,
sameItemId: true
sameListAttributes: 'listItemId'
} );

if ( !previousSibling ) {
Expand All @@ -146,7 +147,7 @@ export function isLastBlockOfListItem( listBlock ) {
const nextSibling = ListWalker.first( listBlock, {
direction: 'forward',
sameIndent: true,
sameItemId: true
sameListAttributes: 'listItemId'
} );

if ( !nextSibling ) {
Expand Down
9 changes: 5 additions & 4 deletions packages/ckeditor5-list/src/documentlistproperties/documentlistpropertiesediting.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@

import { Plugin } from 'ckeditor5/src/core';
import DocumentListEditing from '../documentlist/documentlistediting';
import DocumentListStyleCommand from './documentliststylecommand';
import { listPropertiesDowncastConverter, listPropertiesUpcastConverter } from './converters';
import { iterateSiblingListBlocks } from '../documentlist/utils/listwalker';

Expand Down Expand Up @@ -58,6 +59,7 @@ export default class DocumentListPropertiesEditing extends Plugin {
init() {
const editor = this.editor;
const model = editor.model;
const documentListEditing = editor.plugins.get( DocumentListEditing );

const enabledProperties = editor.config.get( 'list.properties' );
const strategies = createAttributeStrategies( enabledProperties );
Expand All @@ -68,6 +70,7 @@ export default class DocumentListPropertiesEditing extends Plugin {

for ( const strategy of strategies ) {
strategy.addCommand( editor );
documentListEditing.registerSameListDefiningAttributes( strategy.attributeName );
}

// Set up conversion.
Expand All @@ -87,8 +90,6 @@ export default class DocumentListPropertiesEditing extends Plugin {
}
} );

const documentListEditing = editor.plugins.get( DocumentListEditing );

// Verify if the list view element (ul or ol) requires refreshing.
documentListEditing.on( 'refreshChecker:list', ( evt, { viewElement, modelAttributes } ) => {
for ( const strategy of strategies ) {
Expand Down Expand Up @@ -145,8 +146,8 @@ function createAttributeStrategies( enabledProperties ) {
defaultValue: DEFAULT_LIST_TYPE,
viewConsumables: { styles: 'list-style-type' },

addCommand( /* editor */ ) {
// editor.commands.add( 'listStyle', new ListStyleCommand( editor, DEFAULT_LIST_TYPE ) );
addCommand( editor ) {
editor.commands.add( 'listStyle', new DocumentListStyleCommand( editor, DEFAULT_LIST_TYPE ) );
},

appliesToListItem() {
Expand Down
Loading