CKEDITOR.ui.balloonToolbar
A class representing an instance of the balloon toolbar.
The easiest way to create a balloon toolbar is by using the CKEDITOR.editor.balloonToolbars create
method.
However, it is possible to maintain it manually, like below:
// The following example will show a balloon toolbar on any selection change. The toolbar is anchored to the
// last element in the selection, assuming that the editor variable is an instance of CKEDITOR.editor.
editor.on( 'instanceReady', function() {
var toolbar = new CKEDITOR.ui.balloonToolbar( editor );
toolbar.addItems( {
link: new CKEDITOR.ui.button( {
command: 'link'
} ),
unlink: new CKEDITOR.ui.button( {
command: 'unlink'
} )
} );
editor.on( 'selectionChange', function( evt ) {
var lastElement = evt.data.path.lastElement;
if ( lastElement ) {
toolbar.attach( lastElement );
}
} );
} );
Filtering
Properties
-
-
A view instance of the balloon toolbar.
Methods
-
since 4.8.0
constructor( editor, definition ) → balloonToolbar
CKEDITOR.ui.balloonToolbar#constructor
Creates a balloon toolbar instance.
Parameters
editor : editor
The editor instance for which the toolbar is created.
definition : Object
An object containing the panel definition. See CKEDITOR.ui.balloonPanel documentation for an example definition.
Returns
balloonToolbar
-
addItem( name, element )
CKEDITOR.ui.balloonToolbar#addItem
Adds an item to the balloon toolbar.
Parameters
name : String
The menu item name.
element : button | richCombo
An instance of the UI element.
-
addItems( elements )
CKEDITOR.ui.balloonToolbar#addItems
Adds one or more items to the balloon toolbar.
Parameters
elements : Object
An object where keys are used as
itemName
and corresponding values as a definition for the addItem call.
-
attach( element, [ hidden ] )
CKEDITOR.ui.balloonToolbar#attach
Displays the balloon toolbar, pointing it to the
element
.Parameters
element : element
The element to which the panel is attached.
[ hidden ] : Boolean
Do not show the balloon toolbar after attaching it.
Defaults to
false
-
deleteItem( name )
CKEDITOR.ui.balloonToolbar#deleteItem
Removes a particular menu item from the balloon toolbar.
Parameters
name : String
The name of the menu item to be deleted.
-
destroy()
CKEDITOR.ui.balloonToolbar#destroy
Hides the toolbar, removes it from the DOM, and clears all its items.
-
getItem( name ) → button | richCombo
CKEDITOR.ui.balloonToolbar#getItem
Retrieves a particular menu item from the balloon toolbar.
Parameters
name : String
The name of the desired menu item.
Returns
button | richCombo
-
hide()
CKEDITOR.ui.balloonToolbar#hide
Hides the balloon toolbar.
-
refresh()
CKEDITOR.ui.balloonToolbar#refresh
Refreshes all command states so buttons state on the balloon toolbar are up to date.
-
Repositions the balloon toolbar, pointing to the previously attached
element
. -
show()
CKEDITOR.ui.balloonToolbar#show
Shows the balloon toolbar.