Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(ElementEvents): batch subscription #586

Open
wants to merge 4 commits into
base: master
Choose a base branch
from

Conversation

bigopon
Copy link
Member

@bigopon bigopon commented Dec 14, 2017

This PR enhance ElementEvents class with ability to subscribe to multiple events at once.

Usage example:

  import { ElementEvents } from 'aurelia-framework'

  const input = document.createElement('input');
  const elementEvents = new ElementEvents(input);
  elementEvents.subscribe({
    input: () => {
        // handle input value changed
    },
    blur: () => {
        // handle input blur
    },
    focus: {
      handler: () => {
        // handle input focus
      },
      once: true
    }
  });

Also compatible with subscribeOnce

  import { ElementEvents } from 'aurelia-framework'

  const input = document.createElement('input');
  const elementEvents = new ElementEvents(input);
  elementEvents.subscribeOnce({
    input: () => {
        // handle input value changed
    },
    blur: () => {
        // handle input blur
    },
    focus: {
      handler: () => {
        // handle input focus
      },
      once: false
    },
    keydown: {
      handler: () => {},
      once: true,
      capture: true
    }
  });

The result of subscribe / subscribeOnce will be an plain object with same properties with input:

  import { ElementEvents } from 'aurelia-framework'

  const input = document.createElement('input');
  const elementEvents = new ElementEvents(input);
  const subscriptions = elementEvents.subscribe({
    input: () => { },
    blur: () => { },
    focus: {
      handler: () => { },
      once: false
    }
  });

  Object.keys(subscriptions); // <======= ['input', 'blur', 'focus']

  // To dispose single
  subscriptions.input.dispose();

@bigopon
Copy link
Member Author

bigopon commented Dec 14, 2017

If this gets merged, then it should be encouraged over the other overload signature with traditional arguments:

subscribe(
  eventName: string,
  handler: Function,
  captureOrOptions?: boolean | AddEventListenerOption): EventHandler;

as the third parameter value is true by default, which is not usually expected.

Copy link
Member

@zewa666 zewa666 left a comment

Choose a reason for hiding this comment

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

Love this idea. Just left a small remark

export declare interface SubscriptionHandlerConfig {
handler: Function
capture?: boolean
passive?: boolean
Copy link
Member

Choose a reason for hiding this comment

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

Whats this passive prop for? I see it nowhere handled in code

Copy link
Member Author

Choose a reason for hiding this comment

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

It is used when we pass the whole object to EventTarget.prototype.addEventListener third paramter. Same with passive in spec.

@Vheissu
Copy link
Member

Vheissu commented Dec 14, 2017

Would love to see this one merged, this is fantastic.

@stsje
Copy link

stsje commented Dec 14, 2017

How often do you actually need this? Usually you would subscribe to events in the view <button click.delegate="">

I would keep the API as it is, and not introduce a change with minimal gains

@CLAassistant
Copy link

CLAassistant commented Aug 8, 2019

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.


bigopon seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.
You have signed the CLA already but the status is still pending? Let us recheck it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants