Events
The yFiles Class Framework is complemented by further support that provides convenience functionality around event handling.
Events can be easily subscribed to and unsubscribed from through associated methods for adding and removing listener callbacks. These methods take an event handler function as their parameter.
For example, the QueryItemToolTip
event of class GraphViewerInputMode can be easily subscribed to and unsubscribed
from through the addQueryItemToolTipListener
and removeQueryItemToolTipListener
method, respectively.
In the yFiles for HTML API documentation, the associated methods to add and remove listener callbacks to events are currently listed along with the corresponding event.
By means of the delegate
factory method, appropriate event
handler functions can be conveniently registered as implicit closures.
The delegate
method wraps a given function together with
a target object which serves as the caller context for when the given function actually
gets invoked. See below for the detailed delegate
documentation.
The following code snippet shows how an event handler function is registered as a
closure with the current this
context:
When, in response to the QueryItemToolTip event, the $onQueryItemToolTip
listener callback gets invoked, all uses of this
within the callback’s
body actually access the object that the this
referenced at invocation
time of the delegate
factory method.
Delegates
The delegate
function wraps one or more JavaScript Function`s and allows to assign an execution context that
will be used as `this
parameter during the invocation. It works similar as the native
EcmaScript bind
function.
The advantage of using delegate
over Ecmascript’s bind
function is that although both implementations
will yield fresh instances every time they are called, delegate
adds an equals
functionality to
the function that will be used during event registration and de-registration.Thus the same construct can be used for removing the event subscription to successfully remove a previously
added event listener.Using bind
would not work in this case because these are two different instances which cannot be checked for identity, and the remove operation would become a no-op.
In addition to adding an execution context to a function, delegates can be combined with the delegate.combine
and
delegate.remove
functions:
Function | Description |
---|---|
delegate(fun, context) | Function that wraps Function fun such that during invocation context is bound to the this argument, similarly to the built-in JavaScript bind functionality. The resulting delegate function has an extra equals
method that is used when calling the delegate.remove function. |
delegate.combine(fun1, fun2) | Function that combines Function`s `fun1 and fun2 to a combined delegate that, when called, will call the passed functions one after another
and return the return value of fun2 . |
delegate.remove(fun1, fun2) | Function that consists of the delegate fun1 with the first occurrence of fun2 removed from it. Will use the equals method of delegates
for comparison that was added with the delegate binding function. |
delegate.removeAll(fun1, fun2) | delegate.remove but will return a delegate Function with all occurrences of fun2 removed from fun1 . |
The delegate.combine
and delegate.remove
functions can be used to conveniently define own events.