Procházet zdrojové kódy

Implemented ButtonView#tooltipPosition attribute to control TooltipView#position.

Aleksander Nowodzinski před 8 roky
rodič
revize
dcf5d61795

+ 13 - 0
packages/ckeditor5-ui/src/button/buttonview.js

@@ -60,6 +60,18 @@ export default class ButtonView extends View {
 		 */
 		this.set( 'tooltip' );
 
+		/**
+		 * The position of the tooltip. See {@link ui/tooltip/tooltipview~TooltipView#position}
+		 * to learn more about the available position values.
+		 *
+		 * **Note:** It makes sense only when the {@link #tooltip} is active.
+		 *
+		 * @observable
+		 * @default 's'
+		 * @member {'s'|'n'} #position
+		 */
+		this.set( 'tooltipPosition', 's' );
+
 		/**
 		 * The HTML type of the button. Default `button`.
 		 *
@@ -225,6 +237,7 @@ export default class ButtonView extends View {
 			const tooltipView = this.tooltipView = new TooltipView();
 
 			tooltipView.bind( 'text' ).to( this, '_tooltipString' );
+			tooltipView.bind( 'position' ).to( this, 'tooltipPosition' );
 			this.element.appendChild( tooltipView.element );
 
 			// Make sure the tooltip will be destroyed along with the button.

+ 1 - 1
packages/ckeditor5-ui/src/tooltip/tooltipview.js

@@ -31,7 +31,7 @@ export default class TooltipView extends View {
 		this.set( 'text' );
 
 		/**
-		 * The direction of the tooltip (south or north).
+		 * The position of the tooltip (south or north).
 		 *
 		 *		+-----------+
 		 *		|   north   |

+ 13 - 0
packages/ckeditor5-ui/tests/button/buttonview.js

@@ -116,6 +116,7 @@ describe( 'ButtonView', () => {
 				expect( view.element.childNodes ).to.have.length( 3 );
 				expect( view.element.childNodes[ 2 ] ).to.equal( view.tooltipView.element );
 				expect( view.tooltipView ).to.instanceOf( TooltipView );
+				expect( view.tooltipView.position ).to.equal( 's' );
 			} );
 
 			it( 'when set, is destroyed along with the view', () => {
@@ -128,6 +129,18 @@ describe( 'ButtonView', () => {
 				sinon.assert.calledOnce( spy );
 			} );
 
+			it( 'when set, reacts to #tooltipPosition attribute', () => {
+				view.tooltip = 'foo';
+				view.icon = 'bar';
+				view.init();
+
+				expect( view.tooltipPosition ).to.equal( 's' );
+				expect( view.tooltipView.position ).to.equal( 's' );
+
+				view.tooltipPosition = 'n';
+				expect( view.tooltipView.position ).to.equal( 'n' );
+			} );
+
 			describe( 'defined as a Boolean', () => {
 				it( 'renders tooltip text out of #label and #keystroke', () => {
 					view.tooltip = true;