BubblingEmitter
Bubbling emitter for the view document.
Bubbling emitter is triggering events in the context of specified view element name, predefined '$text', '$root', '$document' and '$capture' contexts, and context matchers provided as a function.
Before bubbling starts, listeners for '$capture' context are triggered. Then the bubbling starts from the deeper selection position (by firing event on the '$text' context) and propagates the view document tree up to the '$root' and finally the listeners at '$document' context are fired (this is the default context).
Examples:
// Listeners registered in the context of the view element names:
this.listenTo( viewDocument, 'enter', ( evt, data ) => {
// ...
}, { context: 'blockquote' } );
this.listenTo( viewDocument, 'enter', ( evt, data ) => {
// ...
}, { context: 'li' } );
// Listeners registered in the context of the '$text' and '$root' nodes.
this.listenTo( view.document, 'arrowKey', ( evt, data ) => {
// ...
}, { context: '$text', priority: 'high' } );
this.listenTo( view.document, 'arrowKey', ( evt, data ) => {
// ...
}, { context: '$root' } );
// Listeners registered in the context of custom callback function.
this.listenTo( view.document, 'arrowKey', ( evt, data ) => {
// ...
}, { context: isWidget } );
this.listenTo( view.document, 'arrowKey', ( evt, data ) => {
// ...
}, { context: isWidget, priority: 'high' } );
Example flow for selection in text:
<blockquote><p>Foo[]bar</p></blockquote>
Fired events on contexts:
'$capture''$text''p''blockquote''$root''$document'
Example flow for selection on element (i.e., Widget):
<blockquote><p>Foo[<widget/>]bar</p></blockquote>
Fired events on contexts:
'$capture'- widget (custom matcher)
'p''blockquote''$root''$document'
There could be multiple listeners registered for the same context and at different priority levels:
<p>Foo[]bar</p>
'$capture'at priorities:'highest''high''normal''low''lowest'
'$text'at priorities:'highest''high''normal''low''lowest'
'p'at priorities:'highest''high''normal''low''lowest'
'$root'at priorities:'highest''high''normal''low''lowest'
'$document'at priorities:'highest''high''normal''low''lowest'