| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136 |
- /**
- * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
- /**
- * @module engine/view/uielement
- */
- import Element from './element';
- import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
- import Node from './node';
- import { keyCodes } from '@ckeditor/ckeditor5-utils/src/keyboard';
- /**
- * UIElement class. It is used to represent UI not a content of the document.
- * This element can't be split and selection can't be placed inside this element.
- */
- export default class UIElement extends Element {
- /**
- * Creates new instance of UIElement.
- *
- * Throws {@link module:utils/ckeditorerror~CKEditorError CKEditorError} `view-uielement-cannot-add` when third parameter is passed,
- * to inform that usage of UIElement is incorrect (adding child nodes to UIElement is forbidden).
- *
- * @param {String} name Node name.
- * @param {Object|Iterable} [attributes] Collection of attributes.
- */
- constructor( name, attributes, children ) {
- super( name, attributes, children );
- /**
- * Returns `null` because filler is not needed for UIElements.
- *
- * @method #getFillerOffset
- * @returns {null} Always returns null.
- */
- this.getFillerOffset = getFillerOffset;
- }
- /**
- * @inheritDoc
- */
- is( type, name = null ) {
- if ( !name ) {
- return type == 'uiElement' || super.is( type );
- } else {
- return ( type == 'uiElement' && name == this.name ) || super.is( type, name );
- }
- }
- /**
- * Overrides {@link module:engine/view/element~Element#insertChildren} method.
- * Throws {@link module:utils/ckeditorerror~CKEditorError CKEditorError} `view-uielement-cannot-add` to prevent adding any child nodes
- * to UIElement.
- */
- insertChildren( index, nodes ) {
- if ( nodes && ( nodes instanceof Node || Array.from( nodes ).length > 0 ) ) {
- /**
- * Cannot add children to {@link module:engine/view/uielement~UIElement}.
- *
- * @error view-uielement-cannot-add
- */
- throw new CKEditorError( 'view-uielement-cannot-add: Cannot add child nodes to UIElement instance.' );
- }
- }
- /**
- * Renders this {@link module:engine/view/uielement~UIElement} to DOM. This method is called by
- * {@link module:engine/view/domconverter~DomConverter}.
- *
- * @param {Document} domDocument
- * @return {HTMLElement}
- */
- render( domDocument ) {
- const domElement = domDocument.createElement( this.name );
- for ( const key of this.getAttributeKeys() ) {
- domElement.setAttribute( key, this.getAttribute( key ) );
- }
- return domElement;
- }
- }
- /**
- * This function injects UI element handling to the given {@link module:engine/view/document~Document document}.
- *
- * A callback is added to {@link module:engine/view/document~Document#event:keydown document keydown event}.
- * The callback handles the situation when right arrow key is pressed and selection is collapsed before a UI element.
- * Without this handler, it would be impossible to "jump over" UI element using right arrow key.
- *
- * @param {module:engine/view/document~Document} document Document to which the quirks handling will be injected.
- */
- export function injectUiElementHandling( document ) {
- document.on( 'keydown', ( evt, data ) => jumpOverUiElement( evt, data, document.domConverter ) );
- }
- // Returns `null` because block filler is not needed for UIElements.
- //
- // @returns {null}
- function getFillerOffset() {
- return null;
- }
- // Selection cannot be placed in a `UIElement`. Whenever it is placed there, it is moved before it. This
- // causes a situation when it is impossible to jump over `UIElement` using right arrow key, because the selection
- // ends up in ui element (in DOM) and is moved back to the left. This handler fixes this situation.
- function jumpOverUiElement( evt, data, domConverter ) {
- if ( data.keyCode == keyCodes.arrowright ) {
- const domSelection = data.domTarget.ownerDocument.defaultView.getSelection();
- if ( domSelection.rangeCount == 1 && domSelection.getRangeAt( 0 ).collapsed ) {
- const domParent = domSelection.getRangeAt( 0 ).startContainer;
- const domOffset = domSelection.getRangeAt( 0 ).startOffset;
- const viewPosition = domConverter.domPositionToView( domParent, domOffset );
- // In case if dom element is not converted to view or is not mapped or something. Happens for example in some tests.
- if ( viewPosition === null ) {
- return;
- }
- // Skip all following ui elements.
- const nextViewPosition = viewPosition.getLastMatchingPosition( value => value.item.is( 'uiElement' ) );
- // If anything has been skipped, fix position.
- // This `if` could be possibly omitted but maybe it is better not to mess with DOM selection if not needed.
- if ( !viewPosition.isEqual( nextViewPosition ) ) {
- const newDomPosition = domConverter.viewPositionToDom( nextViewPosition );
- domSelection.collapse( newDomPosition.parent, newDomPosition.offset );
- }
- }
- }
- }
|