| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211 |
- /**
- * @license Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
- /**
- * @module clipboard/clipboardobserver
- */
- import DomEventObserver from '@ckeditor/ckeditor5-engine/src/view/observer/domeventobserver';
- import EventInfo from '@ckeditor/ckeditor5-utils/src/eventinfo';
- import DataTransfer from './datatransfer';
- /**
- * Clipboard events observer.
- *
- * Fires the following events:
- *
- * * {@link module:engine/view/document~Document#event:clipboardInput}
- * * {@link module:engine/view/document~Document#event:dragover}
- * * {@link module:engine/view/document~Document#event:drop}
- * * {@link module:engine/view/document~Document#event:paste}
- * * {@link module:engine/view/document~Document#event:copy}
- * * {@link module:engine/view/document~Document#event:cut}
- *
- * Note that this observer is not available by default (it is not added by the engine).
- * To make it available it needs to be added to {@link module:engine/view/document~Document} by
- * the {@link module:engine/view/view~View#addObserver `View#addObserver()`} method. You can also load the
- * {@link module:clipboard/clipboard~Clipboard} plugin which adds this observer automatically (because it uses it).
- *
- * @extends module:engine/view/observer/domeventobserver~DomEventObserver
- */
- export default class ClipboardObserver extends DomEventObserver {
- constructor( view ) {
- super( view );
- const viewDocument = this.document;
- this.domEventType = [ 'paste', 'copy', 'cut', 'drop', 'dragover' ];
- this.listenTo( viewDocument, 'paste', handleInput, { priority: 'low' } );
- this.listenTo( viewDocument, 'drop', handleInput, { priority: 'low' } );
- function handleInput( evt, data ) {
- data.preventDefault();
- const targetRanges = data.dropRange ? [ data.dropRange ] : Array.from( viewDocument.selection.getRanges() );
- const eventInfo = new EventInfo( viewDocument, 'clipboardInput' );
- viewDocument.fire( eventInfo, {
- dataTransfer: data.dataTransfer,
- targetRanges
- } );
- // If CKEditor handled the input, do not bubble the original event any further.
- // This helps external integrations recognize that fact and act accordingly.
- // https://github.com/ckeditor/ckeditor5-upload/issues/92
- if ( eventInfo.stop.called ) {
- data.stopPropagation();
- }
- }
- }
- onDomEvent( domEvent ) {
- const evtData = {
- dataTransfer: new DataTransfer( domEvent.clipboardData ? domEvent.clipboardData : domEvent.dataTransfer )
- };
- if ( domEvent.type == 'drop' ) {
- evtData.dropRange = getDropViewRange( this.view, domEvent );
- }
- this.fire( domEvent.type, domEvent, evtData );
- }
- }
- function getDropViewRange( view, domEvent ) {
- const domDoc = domEvent.target.ownerDocument;
- const x = domEvent.clientX;
- const y = domEvent.clientY;
- let domRange;
- // Webkit & Blink.
- if ( domDoc.caretRangeFromPoint && domDoc.caretRangeFromPoint( x, y ) ) {
- domRange = domDoc.caretRangeFromPoint( x, y );
- }
- // FF.
- else if ( domEvent.rangeParent ) {
- domRange = domDoc.createRange();
- domRange.setStart( domEvent.rangeParent, domEvent.rangeOffset );
- domRange.collapse( true );
- }
- if ( domRange ) {
- return view.domConverter.domRangeToView( domRange );
- } else {
- return view.document.selection.getFirstRange();
- }
- }
- /**
- * Fired as a continuation of {@link #event:paste} and {@link #event:drop} events.
- *
- * It is a part of the {@glink framework/guides/deep-dive/clipboard#input-pipeline "clipboard input pipeline"}.
- *
- * Fired with a `dataTransfer` which comes from the clipboard and which content should be processed
- * and inserted into the editor.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:clipboard/clipboardobserver~ClipboardObserver
- * @see module:clipboard/clipboard~Clipboard
- * @event module:engine/view/document~Document#event:clipboardInput
- * @param {Object} data Event data.
- * @param {module:clipboard/datatransfer~DataTransfer} data.dataTransfer Data transfer instance.
- * @param {Array.<module:engine/view/range~Range>} data.targetRanges Ranges which are the target of the operation
- * (usually – into which the content should be inserted).
- * If clipboard input was triggered by a paste operation, then these are the selection ranges. If by a drop operation,
- * then it's the drop position (which can be different than the selection at the moment of drop).
- */
- /**
- * Fired when user drags content over one of the editables.
- *
- * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:engine/view/document~Document#event:clipboardInput
- * @event module:engine/view/document~Document#event:dragover
- * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
- */
- /**
- * Fired when user dropped content into one of the editables.
- *
- * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:engine/view/document~Document#event:clipboardInput
- * @event module:engine/view/document~Document#event:drop
- * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
- * @param {module:engine/view/range~Range} dropRange The position into which the content is dropped.
- */
- /**
- * Fired when user pasted content into one of the editables.
- *
- * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:engine/view/document~Document#event:clipboardInput
- * @event module:engine/view/document~Document#event:paste
- * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
- */
- /**
- * Fired when user copied content from one of the editables.
- *
- * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:clipboard/clipboardobserver~ClipboardObserver
- * @event module:engine/view/document~Document#event:copy
- * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
- */
- /**
- * Fired when user cut content from one of the editables.
- *
- * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
- *
- * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
- * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/view~View#addObserver} method.
- * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
- *
- * @see module:clipboard/clipboardobserver~ClipboardObserver
- * @event module:engine/view/document~Document#event:cut
- * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
- */
- /**
- * The value of the {@link module:engine/view/document~Document#event:paste},
- * {@link module:engine/view/document~Document#event:copy} and {@link module:engine/view/document~Document#event:cut} events.
- *
- * In order to access clipboard data use `dataTransfer` property.
- *
- * @class module:clipboard/clipboardobserver~ClipboardEventData
- * @extends module:engine/view/observer/domeventdata~DomEventData
- */
- /**
- * Data transfer instance.
- *
- * @readonly
- * @member {module:clipboard/datatransfer~DataTransfer} module:clipboard/clipboardobserver~ClipboardEventData#dataTransfer
- */
|