Skip to content
This repository was archived by the owner on Feb 22, 2018. It is now read-only.

docs(EventHandler): Add EventHandler documentation. #764

Closed
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 43 additions & 15 deletions lib/core_dom/event_handler.dart
Original file line number Diff line number Diff line change
Expand Up @@ -2,45 +2,73 @@ part of angular.core.dom;

typedef void EventFunction(event);

/**
* [EventHandler] is responsible for handling events bound using on-* syntax
* (i.e. `on-click="ctrl.doSomething();"`). The root of the application has an
* EventHandler attached as does every [NgComponent].
*
* Events bound within [NgComponent] are handled by EventHandler attached to
* their [ShadowRoot]. All other events are handled by EventHandler attached
* to the application root ([NgApp]).
*
* **Note**: The expressions are executed within the closest context.
*
* Example:
*
* <div foo>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think there should be a blank line before code examples for the rendering to be correct.

You should check either the guidelines or the rendering.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Docs say that lines need to be indented 4 spaces after lines comment characters. I'll check to be safe.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

https://www.dartlang.org/articles/doc-comment-guidelines/#code-block

I haven't checked myself but I got this comment while sending a change set to the dart code.

* <button on-click="ctrl.say('Hello');">Button</button>;
* </div>
*
* @NgComponent(selector: '[foo]', publishAs: ctrl)
* class FooController {
* say(String something) => print(something);
* }
*
* When button is clicked, "Hello" will be printed in the console.
*/
@NgInjectableService()
class EventHandler {
dom.Node rootNode;
final Expando expando;
final ExceptionHandler exceptionHandler;
final listeners = <String, Function>{};
dom.Node _rootNode;
final Expando _expando;
final ExceptionHandler _exceptionHandler;
final _listeners = <String, Function>{};

EventHandler(this.rootNode, this.expando, this.exceptionHandler);
EventHandler(this._rootNode, this._expando, this._exceptionHandler);

/**
* Register an event. This makes sure that an event (of the specified name)
* which bubbles to this node, gets processed by this [EventHandler].
*/
void register(String eventName) {
listeners.putIfAbsent(eventName, () {
dom.EventListener eventListener = this.eventListener;
rootNode.on[eventName].listen(eventListener);
_listeners.putIfAbsent(eventName, () {
dom.EventListener eventListener = this._eventListener;
_rootNode.on[eventName].listen(eventListener);
return eventListener;
});
}

void eventListener(dom.Event event) {
void _eventListener(dom.Event event) {
dom.Node element = event.target;
while (element != null && element != rootNode) {
while (element != null && element != _rootNode) {
var expression;
if (element is dom.Element)
expression = (element as dom.Element).attributes[eventNameToAttrName(event.type)];
if (expression != null) {
try {
var scope = getScope(element);
var scope = _getScope(element);
if (scope != null) scope.eval(expression);
} catch (e, s) {
exceptionHandler(e, s);
_exceptionHandler(e, s);
}
}
element = element.parentNode;
}
}

Scope getScope(dom.Node element) {
Scope _getScope(dom.Node element) {
// var topElement = (rootNode is dom.ShadowRoot) ? rootNode.parentNode : rootNode;
while (element != rootNode.parentNode) {
ElementProbe probe = expando[element];
while (element != _rootNode.parentNode) {
ElementProbe probe = _expando[element];
if (probe != null) {
return probe.scope;
}
Expand Down