Browse Source

Implemented ButtonView#isVisible.

Aleksander Nowodzinski 8 years ago
parent
commit
bff40fdc34

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

@@ -85,6 +85,14 @@ export default class ButtonView extends View {
 		this.set( 'isEnabled', true );
 
 		/**
+		 * Controls whether the button view is visible.
+		 *
+		 * @observable
+		 * @member {Boolean} #isVisible
+		 */
+		this.set( 'isVisible', true );
+
+		/**
 		 * (Optional) Whether the label of the button is hidden (e.g. button with icon only).
 		 *
 		 * @observable
@@ -142,6 +150,7 @@ export default class ButtonView extends View {
 					'ck-button',
 					bind.if( '_tooltipString', 'ck-tooltip_s' ),
 					bind.to( 'isEnabled', value => value ? 'ck-enabled' : 'ck-disabled' ),
+					bind.if( 'isVisible', 'ck-hidden', value => !value ),
 					bind.to( 'isOn', value => value ? 'ck-on' : 'ck-off' ),
 					bind.if( 'withText', 'ck-button_with-text' )
 				],

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

@@ -25,6 +25,7 @@ describe( 'ButtonView', () => {
 			it( 'is set initially', () => {
 				expect( view.element.classList ).to.have.length( 3 );
 				expect( view.element.classList.contains( 'ck-button' ) ).to.true;
+				expect( view.element.classList.contains( 'ck-enabled' ) ).to.true;
 				expect( view.element.classList.contains( 'ck-off' ) ).to.true;
 			} );
 
@@ -44,6 +45,14 @@ describe( 'ButtonView', () => {
 				expect( view.element.classList.contains( 'ck-on' ) ).to.false;
 			} );
 
+			it( 'reacts on view#isVisible', () => {
+				view.isVisible = true;
+				expect( view.element.classList.contains( 'ck-hidden' ) ).to.be.false;
+
+				view.isVisible = false;
+				expect( view.element.classList.contains( 'ck-hidden' ) ).to.be.true;
+			} );
+
 			it( 'reacts on view#withText', () => {
 				view.withText = true;
 				expect( view.element.classList.contains( 'ck-button_with-text' ) ).to.true;