Selaa lähdekoodia

Removed ImageBalloonPanelView. Will be replaced by the ContextualBalloon integration.

Aleksander Nowodzinski 8 vuotta sitten
vanhempi
commit
616dfe2ae3

+ 0 - 102
packages/ckeditor5-image/src/image/ui/imageballoonpanelview.js

@@ -1,102 +0,0 @@
-/**
- * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
-
-/**
- * @module image/image/ui/imageballoonpanel
- */
-
-import throttle from '@ckeditor/ckeditor5-utils/src/lib/lodash/throttle';
-import global from '@ckeditor/ckeditor5-utils/src/dom/global';
-import BalloonPanelView from '@ckeditor/ckeditor5-ui/src/panel/balloon/balloonpanelview';
-import { isImageWidget } from '../utils';
-
-/**
- * Image balloon panel class. It extends {module:ui/panel/balloon/balloonpanelview~BalloonPanelView} by adding helpers
- * to use with image widgets. It sets proper positioning on `scroll` and `resize` events and hides the panel when
- * image is no longer selected or focus is lost.
- *
- * @extends module:ui/panel/balloon/balloonpanelview~BalloonPanelView
- */
-export default class ImageBalloonPanelView extends BalloonPanelView {
-	/**
-	 * @inheritDoc
-	 */
-	constructor( editor ) {
-		super( editor.locale );
-
-		this.editor = editor;
-		const editingView = editor.editing.view;
-
-		// Hide the balloon if editor had focus and now focus is lost.
-		this.listenTo( editor.ui.focusTracker, 'change:isFocused', ( evt, name, is, was ) => {
-			if ( was && !is ) {
-				this.detach();
-			}
-		} );
-
-		// Hide the balloon if no image is currently selected.
-		editor.listenTo( editingView, 'render', () => {
-			const selectedElement = editingView.selection.getSelectedElement();
-
-			if ( !selectedElement || !isImageWidget( selectedElement ) ) {
-				this.detach();
-			}
-		}, { priority: 'low' } );
-
-		/**
-		 * Wraps {@link #_attach} method with throttle function that will fire it not more than every 100ms.
-		 * It is used as `scroll` and `resize` callback.
-		 *
-		 * @private
-		 * @member {Function} #_throttledAttach
-		 */
-		this._throttledAttach = throttle( () => {
-			this._attach();
-		}, 100 );
-	}
-
-	/**
-	 * @inheritDoc
-	 */
-	init() {
-		// Let the focusTracker know about new focusable UI element.
-		this.editor.ui.focusTracker.add( this.element );
-
-		super.init();
-	}
-
-	/**
-	 * Attaches the panel and enables `scroll` and `resize` listeners.
-	 */
-	attach() {
-		this._attach();
-		this.editor.ui.view.listenTo( global.window, 'scroll', this._throttledAttach );
-		this.editor.ui.view.listenTo( global.window, 'resize', this._throttledAttach );
-	}
-
-	/**
-	 * Detaches the panel and disables `scroll` and `resize` listeners.
-	 */
-	detach() {
-		this.hide();
-		this.editor.ui.view.stopListening( global.window, 'scroll', this._throttledAttach );
-		this.editor.ui.view.stopListening( global.window, 'resize', this._throttledAttach );
-	}
-
-	/**
-	 * Attaches the panel to the first selection range.
-	 *
-	 * @private
-	 */
-	_attach() {
-		const editingView = this.editor.editing.view;
-		const defaultPositions = BalloonPanelView.defaultPositions;
-
-		this.attachTo( {
-			target: editingView.domConverter.viewToDom( editingView.selection.getSelectedElement() ),
-			positions: [ defaultPositions.northArrowSouth, defaultPositions.southArrowNorth ]
-		} );
-	}
-}

+ 0 - 145
packages/ckeditor5-image/tests/image/ui/imageballoonpanelview.js

@@ -1,145 +0,0 @@
-/**
- * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
-
-/* global window, document, Event */
-
-import ClassicEditor from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
-
-import ImageEngine from '../../../src/image/imageengine';
-import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
-
-import ImageBalloonPanel from '../../../src/image/ui/imageballoonpanelview';
-import BalloonPanelView from '@ckeditor/ckeditor5-ui/src/panel/balloon/balloonpanelview';
-
-import { setData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
-
-describe( 'ImageBalloonPanel', () => {
-	let editor, panel, doc, editorElement;
-
-	beforeEach( () => {
-		editorElement = document.createElement( 'div' );
-		document.body.appendChild( editorElement );
-
-		return ClassicEditor
-			.create( editorElement, {
-				plugins: [ ImageEngine, Paragraph ]
-			} )
-			.then( newEditor => {
-				editor = newEditor;
-				panel = new ImageBalloonPanel( editor );
-				doc = editor.document;
-
-				return editor.ui.view.body.add( panel );
-			} );
-	} );
-
-	afterEach( () => {
-		editorElement.remove();
-
-		return editor.destroy();
-	} );
-
-	it( 'should add element to editor\'s focus tracker after init', () => {
-		const spy = sinon.spy( editor.ui.focusTracker, 'add' );
-		const panel = new ImageBalloonPanel( editor );
-
-		sinon.assert.notCalled( spy );
-
-		panel.init();
-		sinon.assert.calledOnce( spy );
-		sinon.assert.calledWithExactly( spy, panel.element );
-	} );
-
-	it( 'should detach panel when focus is removed', () => {
-		const spy = sinon.spy( panel, 'detach' );
-		editor.ui.focusTracker.isFocused = true;
-		editor.ui.focusTracker.isFocused = false;
-
-		sinon.assert.calledOnce( spy );
-	} );
-
-	it( 'should detach when image element is no longer selected', () => {
-		const spy = sinon.spy( panel, 'detach' );
-
-		setData( doc, '<paragraph>foo</paragraph>[<image src=""></image>]' );
-		panel.attach();
-
-		doc.enqueueChanges( () => {
-			doc.selection.removeAllRanges();
-		} );
-
-		sinon.assert.calledOnce( spy );
-	} );
-
-	it( 'should attach panel correctly', () => {
-		const spy = sinon.spy( panel, 'attachTo' );
-
-		setData( doc, '[<image src=""></image>]' );
-		panel.attach();
-
-		testPanelAttach( spy );
-	} );
-
-	it( 'should calculate panel position on scroll event', () => {
-		setData( doc, '[<image src=""></image>]' );
-		panel.attach();
-
-		const spy = sinon.spy( panel, 'attachTo' );
-
-		window.dispatchEvent( new Event( 'scroll' ) );
-
-		testPanelAttach( spy );
-	} );
-
-	it( 'should calculate panel position on resize event event', () => {
-		setData( doc, '[<image src=""></image>]' );
-		panel.attach();
-
-		const spy = sinon.spy( panel, 'attachTo' );
-
-		window.dispatchEvent( new Event( 'resize' ) );
-
-		testPanelAttach( spy );
-	} );
-
-	it( 'should hide panel on detach', () => {
-		setData( doc, '[<image src=""></image>]' );
-		panel.attach();
-
-		const spy = sinon.spy( panel, 'hide' );
-
-		panel.detach();
-
-		sinon.assert.calledOnce( spy );
-	} );
-
-	it( 'should not reposition panel after detaching', () => {
-		setData( doc, '[<image src=""></image>]' );
-		panel.attach();
-
-		const spy = sinon.spy( panel, 'attachTo' );
-
-		panel.detach();
-		window.dispatchEvent( new Event( 'resize' ) );
-		window.dispatchEvent( new Event( 'scroll' ) );
-
-		sinon.assert.notCalled( spy );
-	} );
-
-	// Tests if panel.attachTo() was called correctly.
-	function testPanelAttach( spy ) {
-		sinon.assert.calledOnce( spy );
-		const options = spy.firstCall.args[ 0 ];
-
-		// Check if proper target element was used.
-		expect( options.target.tagName.toLowerCase() ).to.equal( 'figure' );
-
-		// Check if correct positions are used.
-		const [ north, south ] = options.positions;
-
-		expect( north ).to.equal( BalloonPanelView.defaultPositions.northArrowSouth );
-		expect( south ).to.equal( BalloonPanelView.defaultPositions.southArrowNorth );
-	}
-} );