浏览代码

Changed: Rename parts of SplitButton buttons to action/select.

Maciej Gołaszewski 8 年之前
父节点
当前提交
11a6134a61

+ 13 - 15
packages/ckeditor5-ui/src/button/splitbuttonview.js

@@ -13,6 +13,7 @@ import ButtonView from './buttonview';
 import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
 import FocusTracker from '@ckeditor/ckeditor5-utils/src/focustracker';
 
+// TODO: temporary hack...
 import arrowIcon from '@ckeditor/ckeditor5-core/theme/icons/low-vision.svg';
 
 import './../../theme/components/button/splitbutton.css';
@@ -29,8 +30,8 @@ export default class SplitButtonView extends View {
 
 		this.children = this.createCollection();
 
-		this.buttonView = this._createButtonView();
-		this.selectView = this._createArrowView();
+		this.actionView = this._createActionView();
+		this.selectView = this._createSelectView();
 
 		this.keystrokes = new KeystrokeHandler();
 		this.focusTracker = new FocusTracker();
@@ -52,17 +53,17 @@ export default class SplitButtonView extends View {
 	render() {
 		super.render();
 
-		this.children.add( this.buttonView );
+		this.children.add( this.actionView );
 		this.children.add( this.selectView );
 
-		this.focusTracker.add( this.buttonView.element );
+		this.focusTracker.add( this.actionView.element );
 		this.focusTracker.add( this.selectView.element );
 
 		this.keystrokes.listenTo( this.element );
 
 		// Overrides toolbar focus cycling behavior
 		this.keystrokes.set( 'arrowright', ( evt, cancel ) => {
-			if ( this.focusTracker.focusedElement === this.buttonView.element ) {
+			if ( this.focusTracker.focusedElement === this.actionView.element ) {
 				this.selectView.focus();
 
 				cancel();
@@ -72,7 +73,7 @@ export default class SplitButtonView extends View {
 		// Overrides toolbar focus cycling behavior
 		this.keystrokes.set( 'arrowleft', ( evt, cancel ) => {
 			if ( this.focusTracker.focusedElement === this.selectView.element ) {
-				this.buttonView.focus();
+				this.actionView.focus();
 
 				cancel();
 			}
@@ -80,23 +81,20 @@ export default class SplitButtonView extends View {
 	}
 
 	focus() {
-		this.buttonView.focus();
+		this.actionView.focus();
 	}
 
-	_createButtonView() {
+	_createActionView() {
 		const buttonView = new ButtonView();
 
-		buttonView.bind( 'icon' ).to( this, 'icon' );
+		buttonView.bind( 'icon', 'isEnabled', 'label' ).to( this );
 
 		buttonView.delegate( 'execute' ).to( this );
 
-		buttonView.bind( 'isEnabled' ).to( this );
-		buttonView.bind( 'label' ).to( this );
-
 		return buttonView;
 	}
 
-	_createArrowView() {
+	_createSelectView() {
 		const selectView = new ButtonView();
 
 		selectView.icon = arrowIcon;
@@ -107,10 +105,10 @@ export default class SplitButtonView extends View {
 			}
 		} );
 
-		selectView.delegate( 'execute' ).to( this, 'select' );
-
 		selectView.bind( 'isEnabled' ).to( this );
 
+		selectView.delegate( 'execute' ).to( this, 'select' );
+
 		return selectView;
 	}
 }

+ 3 - 3
packages/ckeditor5-ui/src/dropdown/dropdownview.js

@@ -57,7 +57,7 @@ export default class DropdownView extends View {
 		this.buttonView = buttonView;
 
 		/**
-		 * Panel of the dropdown. It opens when the {@link #buttonView} is
+		 * Panel of the dropdown. It opens when the {@link #actionView} is
 		 * {@link module:ui/button/buttonview~ButtonView#event:execute executed} (i.e. clicked).
 		 *
 		 * Child views can be added to the panel's `children` collection:
@@ -158,7 +158,7 @@ export default class DropdownView extends View {
 		super.render();
 
 		// Toggle the the dropdown when it's button has been clicked.
-		this.listenTo( this.buttonView, 'select', () => {
+		this.listenTo( this.butstonView, 'select', () => {
 			this.isOpen = !this.isOpen;
 		} );
 
@@ -201,7 +201,7 @@ export default class DropdownView extends View {
 	}
 
 	/**
-	 * Focuses the {@link #buttonView}.
+	 * Focuses the {@link #actionView}.
 	 */
 	focus() {
 		this.buttonView.focus();

+ 5 - 5
packages/ckeditor5-ui/src/dropdown/utils.js

@@ -85,16 +85,16 @@ export function createButtonForDropdown( model, locale ) {
 }
 
 export function createSplitButtonForDropdown( model, locale ) {
-	const buttonView = new SplitButtonView( locale );
+	const splitButtonView = new SplitButtonView( locale );
 
 	// TODO: check 'isOn' binding.
-	buttonView.bind( 'label', 'isEnabled', 'withText', 'keystroke', 'tooltip', 'icon' ).to( model );
+	splitButtonView.bind( 'label', 'isEnabled', 'withText', 'keystroke', 'tooltip', 'icon' ).to( model );
 
 	// TODO: something wierd with binding
-	buttonView.buttonView.bind( 'isOn' ).to( model );
-	buttonView.buttonView.bind( 'tooltip' ).to( model );
+	splitButtonView.actionView.bind( 'isOn' ).to( model );
+	splitButtonView.actionView.bind( 'tooltip' ).to( model );
 
-	return buttonView;
+	return splitButtonView;
 }
 
 export function createDropdownView( model, buttonView, locale ) {