[6a3a178] | 1 | import { Observable } from '../Observable';
|
---|
| 2 | import { isArray } from '../util/isArray';
|
---|
| 3 | import { isFunction } from '../util/isFunction';
|
---|
| 4 | import { NodeEventHandler } from './fromEvent';
|
---|
| 5 | import { map } from '../operators/map';
|
---|
| 6 |
|
---|
| 7 | /* tslint:disable:max-line-length */
|
---|
| 8 | export function fromEventPattern<T>(addHandler: (handler: NodeEventHandler) => any, removeHandler?: (handler: NodeEventHandler, signal?: any) => void): Observable<T>;
|
---|
| 9 | /** @deprecated resultSelector no longer supported, pipe to map instead */
|
---|
| 10 | export function fromEventPattern<T>(addHandler: (handler: NodeEventHandler) => any, removeHandler?: (handler: NodeEventHandler, signal?: any) => void, resultSelector?: (...args: any[]) => T): Observable<T>;
|
---|
| 11 | /* tslint:enable:max-line-length */
|
---|
| 12 |
|
---|
| 13 | /**
|
---|
| 14 | * Creates an Observable from an arbitrary API for registering event handlers.
|
---|
| 15 | *
|
---|
| 16 | * <span class="informal">When that method for adding event handler was something {@link fromEvent}
|
---|
| 17 | * was not prepared for.</span>
|
---|
| 18 | *
|
---|
| 19 | * ![](fromEventPattern.png)
|
---|
| 20 | *
|
---|
| 21 | * `fromEventPattern` allows you to convert into an Observable any API that supports registering handler functions
|
---|
| 22 | * for events. It is similar to {@link fromEvent}, but far
|
---|
| 23 | * more flexible. In fact, all use cases of {@link fromEvent} could be easily handled by
|
---|
| 24 | * `fromEventPattern` (although in slightly more verbose way).
|
---|
| 25 | *
|
---|
| 26 | * This operator accepts as a first argument an `addHandler` function, which will be injected with
|
---|
| 27 | * handler parameter. That handler is actually an event handler function that you now can pass
|
---|
| 28 | * to API expecting it. `addHandler` will be called whenever Observable
|
---|
| 29 | * returned by the operator is subscribed, so registering handler in API will not
|
---|
| 30 | * necessarily happen when `fromEventPattern` is called.
|
---|
| 31 | *
|
---|
| 32 | * After registration, every time an event that we listen to happens,
|
---|
| 33 | * Observable returned by `fromEventPattern` will emit value that event handler
|
---|
| 34 | * function was called with. Note that if event handler was called with more
|
---|
| 35 | * then one argument, second and following arguments will not appear in the Observable.
|
---|
| 36 | *
|
---|
| 37 | * If API you are using allows to unregister event handlers as well, you can pass to `fromEventPattern`
|
---|
| 38 | * another function - `removeHandler` - as a second parameter. It will be injected
|
---|
| 39 | * with the same handler function as before, which now you can use to unregister
|
---|
| 40 | * it from the API. `removeHandler` will be called when consumer of resulting Observable
|
---|
| 41 | * unsubscribes from it.
|
---|
| 42 | *
|
---|
| 43 | * In some APIs unregistering is actually handled differently. Method registering an event handler
|
---|
| 44 | * returns some kind of token, which is later used to identify which function should
|
---|
| 45 | * be unregistered or it itself has method that unregisters event handler.
|
---|
| 46 | * If that is the case with your API, make sure token returned
|
---|
| 47 | * by registering method is returned by `addHandler`. Then it will be passed
|
---|
| 48 | * as a second argument to `removeHandler`, where you will be able to use it.
|
---|
| 49 | *
|
---|
| 50 | * If you need access to all event handler parameters (not only the first one),
|
---|
| 51 | * or you need to transform them in any way, you can call `fromEventPattern` with optional
|
---|
| 52 | * third parameter - project function which will accept all arguments passed to
|
---|
| 53 | * event handler when it is called. Whatever is returned from project function will appear on
|
---|
| 54 | * resulting stream instead of usual event handlers first argument. This means
|
---|
| 55 | * that default project can be thought of as function that takes its first parameter
|
---|
| 56 | * and ignores the rest.
|
---|
| 57 | *
|
---|
| 58 | * ## Example
|
---|
| 59 | * ### Emits clicks happening on the DOM document
|
---|
| 60 | *
|
---|
| 61 | * ```ts
|
---|
| 62 | * import { fromEventPattern } from 'rxjs';
|
---|
| 63 | *
|
---|
| 64 | * function addClickHandler(handler) {
|
---|
| 65 | * document.addEventListener('click', handler);
|
---|
| 66 | * }
|
---|
| 67 | *
|
---|
| 68 | * function removeClickHandler(handler) {
|
---|
| 69 | * document.removeEventListener('click', handler);
|
---|
| 70 | * }
|
---|
| 71 | *
|
---|
| 72 | * const clicks = fromEventPattern(
|
---|
| 73 | * addClickHandler,
|
---|
| 74 | * removeClickHandler
|
---|
| 75 | * );
|
---|
| 76 | * clicks.subscribe(x => console.log(x));
|
---|
| 77 | *
|
---|
| 78 | * // Whenever you click anywhere in the browser, DOM MouseEvent
|
---|
| 79 | * // object will be logged.
|
---|
| 80 | * ```
|
---|
| 81 | *
|
---|
| 82 | * ## Example
|
---|
| 83 | * ### Use with API that returns cancellation token
|
---|
| 84 | *
|
---|
| 85 | * ```ts
|
---|
| 86 | * import { fromEventPattern } from 'rxjs';
|
---|
| 87 | *
|
---|
| 88 | * const token = someAPI.registerEventHandler(function() {});
|
---|
| 89 | * someAPI.unregisterEventHandler(token); // this APIs cancellation method accepts
|
---|
| 90 | * // not handler itself, but special token.
|
---|
| 91 | *
|
---|
| 92 | * const someAPIObservable = fromEventPattern(
|
---|
| 93 | * function(handler) { return someAPI.registerEventHandler(handler); }, // Note that we return the token here...
|
---|
| 94 | * function(handler, token) { someAPI.unregisterEventHandler(token); } // ...to then use it here.
|
---|
| 95 | * );
|
---|
| 96 | * ```
|
---|
| 97 | *
|
---|
| 98 | * ## Example
|
---|
| 99 | * ### Use with project function
|
---|
| 100 | *
|
---|
| 101 | * ```ts
|
---|
| 102 | * import { fromEventPattern } from 'rxjs';
|
---|
| 103 | *
|
---|
| 104 | * someAPI.registerEventHandler((eventType, eventMessage) => {
|
---|
| 105 | * console.log(eventType, eventMessage); // Logs "EVENT_TYPE" "EVENT_MESSAGE" to console.
|
---|
| 106 | * });
|
---|
| 107 | *
|
---|
| 108 | * const someAPIObservable = fromEventPattern(
|
---|
| 109 | * handler => someAPI.registerEventHandler(handler),
|
---|
| 110 | * handler => someAPI.unregisterEventHandler(handler)
|
---|
| 111 | * (eventType, eventMessage) => eventType + " --- " + eventMessage // without that function only "EVENT_TYPE"
|
---|
| 112 | * ); // would be emitted by the Observable
|
---|
| 113 | *
|
---|
| 114 | * someAPIObservable.subscribe(value => console.log(value));
|
---|
| 115 | *
|
---|
| 116 | * // Logs:
|
---|
| 117 | * // "EVENT_TYPE --- EVENT_MESSAGE"
|
---|
| 118 | * ```
|
---|
| 119 | *
|
---|
| 120 | * @see {@link fromEvent}
|
---|
| 121 | * @see {@link bindCallback}
|
---|
| 122 | * @see {@link bindNodeCallback}
|
---|
| 123 | *
|
---|
| 124 | * @param {function(handler: Function): any} addHandler A function that takes
|
---|
| 125 | * a `handler` function as argument and attaches it somehow to the actual
|
---|
| 126 | * source of events.
|
---|
| 127 | * @param {function(handler: Function, token?: any): void} [removeHandler] A function that
|
---|
| 128 | * takes a `handler` function as an argument and removes it from the event source. If `addHandler`
|
---|
| 129 | * returns some kind of token, `removeHandler` function will have it as a second parameter.
|
---|
| 130 | * @param {function(...args: any): T} [project] A function to
|
---|
| 131 | * transform results. It takes the arguments from the event handler and
|
---|
| 132 | * should return a single value.
|
---|
| 133 | * @return {Observable<T>} Observable which, when an event happens, emits first parameter
|
---|
| 134 | * passed to registered event handler. Alternatively it emits whatever project function returns
|
---|
| 135 | * at that moment.
|
---|
| 136 | * @static true
|
---|
| 137 | * @name fromEventPattern
|
---|
| 138 | * @owner Observable
|
---|
| 139 | */
|
---|
| 140 |
|
---|
| 141 | export function fromEventPattern<T>(addHandler: (handler: NodeEventHandler) => any,
|
---|
| 142 | removeHandler?: (handler: NodeEventHandler, signal?: any) => void,
|
---|
| 143 | resultSelector?: (...args: any[]) => T): Observable<T | T[]> {
|
---|
| 144 |
|
---|
| 145 | if (resultSelector) {
|
---|
| 146 | // DEPRECATED PATH
|
---|
| 147 | return fromEventPattern<T>(addHandler, removeHandler).pipe(
|
---|
| 148 | map(args => isArray(args) ? resultSelector(...args) : resultSelector(args))
|
---|
| 149 | );
|
---|
| 150 | }
|
---|
| 151 |
|
---|
| 152 | return new Observable<T | T[]>(subscriber => {
|
---|
| 153 | const handler = (...e: T[]) => subscriber.next(e.length === 1 ? e[0] : e);
|
---|
| 154 |
|
---|
| 155 | let retValue: any;
|
---|
| 156 | try {
|
---|
| 157 | retValue = addHandler(handler);
|
---|
| 158 | } catch (err) {
|
---|
| 159 | subscriber.error(err);
|
---|
| 160 | return undefined;
|
---|
| 161 | }
|
---|
| 162 |
|
---|
| 163 | if (!isFunction(removeHandler)) {
|
---|
| 164 | return undefined;
|
---|
| 165 | }
|
---|
| 166 |
|
---|
| 167 | return () => removeHandler(handler, retValue) ;
|
---|
| 168 | });
|
---|
| 169 | }
|
---|