Explorar el Código

Merge pull request #100 from ckeditor/t/99

Internal: `ImageBalloonPanelView` should use `BalloonPanelView#defaultPositions`. Closes #99.
Aleksander Nowodzinski hace 8 años
padre
commit
0b0598adea

+ 2 - 30
packages/ckeditor5-image/src/image/ui/imageballoonpanelview.js

@@ -12,35 +12,6 @@ import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 import BalloonPanelView from '@ckeditor/ckeditor5-ui/src/panel/balloon/balloonpanelview';
 import { isImageWidget } from '../utils';
 
-const arrowVOffset = BalloonPanelView.arrowVerticalOffset;
-const positions = {
-	//	   [text range]
-	//	        ^
-	//	+-----------------+
-	//	|     Balloon     |
-	//	+-----------------+
-	south( targetRect, balloonRect ) {
-		return {
-			top: targetRect.bottom + arrowVOffset,
-			left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
-			name: 'arrow_s'
-		};
-	},
-
-	//	+-----------------+
-	//	|     Balloon     |
-	//	+-----------------+
-	//	        V
-	//	   [text range]
-	north( targetRect, balloonRect ) {
-		return {
-			top: targetRect.top - balloonRect.height - arrowVOffset,
-			left: targetRect.left + targetRect.width / 2 - balloonRect.width / 2,
-			name: 'arrow_n'
-		};
-	}
-};
-
 /**
  * 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
@@ -121,10 +92,11 @@ export default class ImageBalloonPanelView extends BalloonPanelView {
 	 */
 	_attach() {
 		const editingView = this.editor.editing.view;
+		const defaultPositions = BalloonPanelView.defaultPositions;
 
 		this.attachTo( {
 			target: editingView.domConverter.viewRangeToDom( editingView.selection.getFirstRange() ),
-			positions: [ positions.north, positions.south ]
+			positions: [ defaultPositions.northArrowSouth, defaultPositions.southArrowNorth ]
 		} );
 	}
 }

+ 4 - 13
packages/ckeditor5-image/tests/image/ui/imageballoonpanelview.js

@@ -135,19 +135,10 @@ describe( 'ImageBalloonPanel', () => {
 		expect( options.target.endContainer ).to.equal( domRange.endContainer );
 		expect( options.target.endOffset ).to.equal( domRange.endOffset );
 
-		// Check if north/south calculation is correct.
+		// Check if correct positions are used.
 		const [ north, south ] = options.positions;
-		const targetRect = { top: 10, left: 20, width: 200, height: 100, bottom: 110, right: 220 };
-		const balloonRect = { width: 50, height: 20 };
-
-		const northPosition = north( targetRect, balloonRect );
-		expect( northPosition.name ).to.equal( 'arrow_n' );
-		expect( northPosition.top ).to.equal( targetRect.top - balloonRect.height - BalloonPanelView.arrowVerticalOffset );
-		expect( northPosition.left ).to.equal( targetRect.left + targetRect.width / 2 - balloonRect.width / 2 );
-
-		const southPosition = south( targetRect, balloonRect );
-		expect( southPosition.name ).to.equal( 'arrow_s' );
-		expect( southPosition.top ).to.equal( targetRect.bottom + BalloonPanelView.arrowVerticalOffset );
-		expect( southPosition.left ).to.equal( targetRect.left + targetRect.width / 2 - balloonRect.width / 2 );
+
+		expect( north ).to.equal( BalloonPanelView.defaultPositions.northArrowSouth );
+		expect( south ).to.equal( BalloonPanelView.defaultPositions.southArrowNorth );
 	}
 } );