|
@@ -165,6 +165,11 @@ export default class ToolbarView extends View {
|
|
|
*/
|
|
*/
|
|
|
this._groupedItemsDropdown = this._createGrouppedItemsDropdown();
|
|
this._groupedItemsDropdown = this._createGrouppedItemsDropdown();
|
|
|
|
|
|
|
|
|
|
+ /**
|
|
|
|
|
+ * TODO
|
|
|
|
|
+ */
|
|
|
|
|
+ this._itemsGroupper = null;
|
|
|
|
|
+
|
|
|
/**
|
|
/**
|
|
|
* A top–level collection aggregating building blocks of the toolbar. It mainly exists to
|
|
* A top–level collection aggregating building blocks of the toolbar. It mainly exists to
|
|
|
* make sure {@link #items} do not mix up with the {@link #groupedItemsDropdown}, which helps
|
|
* make sure {@link #items} do not mix up with the {@link #groupedItemsDropdown}, which helps
|
|
@@ -254,7 +259,7 @@ export default class ToolbarView extends View {
|
|
|
// Start listening for the keystrokes coming from #element.
|
|
// Start listening for the keystrokes coming from #element.
|
|
|
this.keystrokes.listenTo( this.element );
|
|
this.keystrokes.listenTo( this.element );
|
|
|
|
|
|
|
|
- this._itemsGroupper = new ToolbarItemsGroupper( {
|
|
|
|
|
|
|
+ this._itemsGroupper = new ToolbarItemsGrouper( {
|
|
|
shouldGroupWhenFull: this.options.shouldGroupWhenFull,
|
|
shouldGroupWhenFull: this.options.shouldGroupWhenFull,
|
|
|
items: this.items,
|
|
items: this.items,
|
|
|
ungroupedItems: this._ungroupedItems,
|
|
ungroupedItems: this._ungroupedItems,
|
|
@@ -441,7 +446,7 @@ class UngrouppedItemsView extends View {
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
-class ToolbarItemsGroupper {
|
|
|
|
|
|
|
+class ToolbarItemsGrouper {
|
|
|
constructor( options ) {
|
|
constructor( options ) {
|
|
|
Object.assign( this, options );
|
|
Object.assign( this, options );
|
|
|
|
|
|
|
@@ -554,7 +559,7 @@ class ToolbarItemsGroupper {
|
|
|
// Group #items as long as some wrap to the next row. This will happen, for instance,
|
|
// Group #items as long as some wrap to the next row. This will happen, for instance,
|
|
|
// when the toolbar is getting narrow and there is not enough space to display all items in
|
|
// when the toolbar is getting narrow and there is not enough space to display all items in
|
|
|
// a single row.
|
|
// a single row.
|
|
|
- while ( this.areToolbarItemsOverflowing ) {
|
|
|
|
|
|
|
+ while ( this.areItemsOverflowing ) {
|
|
|
this.groupLastItem();
|
|
this.groupLastItem();
|
|
|
|
|
|
|
|
wereItemsGrouped = true;
|
|
wereItemsGrouped = true;
|
|
@@ -565,7 +570,7 @@ class ToolbarItemsGroupper {
|
|
|
// for instance, the toolbar is stretching and there's more space in it than before.
|
|
// for instance, the toolbar is stretching and there's more space in it than before.
|
|
|
if ( !wereItemsGrouped && this.groupedItems && this.groupedItems.length ) {
|
|
if ( !wereItemsGrouped && this.groupedItems && this.groupedItems.length ) {
|
|
|
// Ungroup items as long as none are overflowing or there are none to ungroup left.
|
|
// Ungroup items as long as none are overflowing or there are none to ungroup left.
|
|
|
- while ( this.groupedItems.length && !this.areToolbarItemsOverflowing ) {
|
|
|
|
|
|
|
+ while ( this.groupedItems.length && !this.areItemsOverflowing ) {
|
|
|
this.ungroupFirstItem();
|
|
this.ungroupFirstItem();
|
|
|
}
|
|
}
|
|
|
|
|
|
|
@@ -573,7 +578,7 @@ class ToolbarItemsGroupper {
|
|
|
// put it back to the group toolbar ("undo the last ungroup"). We don't know whether
|
|
// put it back to the group toolbar ("undo the last ungroup"). We don't know whether
|
|
|
// an item will wrap or not until we ungroup it (that's a DOM/CSS thing) so this
|
|
// an item will wrap or not until we ungroup it (that's a DOM/CSS thing) so this
|
|
|
// clean–up is vital for the algorithm.
|
|
// clean–up is vital for the algorithm.
|
|
|
- if ( this.areToolbarItemsOverflowing ) {
|
|
|
|
|
|
|
+ if ( this.areItemsOverflowing ) {
|
|
|
this.groupLastItem();
|
|
this.groupLastItem();
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
@@ -630,7 +635,7 @@ class ToolbarItemsGroupper {
|
|
|
* @protected
|
|
* @protected
|
|
|
* @type {Boolean}
|
|
* @type {Boolean}
|
|
|
*/
|
|
*/
|
|
|
- get areToolbarItemsOverflowing() {
|
|
|
|
|
|
|
+ get areItemsOverflowing() {
|
|
|
// An empty toolbar cannot overflow.
|
|
// An empty toolbar cannot overflow.
|
|
|
if ( !this.ungroupedItems.length ) {
|
|
if ( !this.ungroupedItems.length ) {
|
|
|
return false;
|
|
return false;
|