event-target.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. 'use strict';
  2. exports.__esModule = true;
  3. var _events = require('./utils/events.js');
  4. var Events = _interopRequireWildcard(_events);
  5. function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj['default'] = obj; return newObj; } }
  6. /**
  7. * `EventTarget` is a class that can have the same API as the DOM `EventTarget`. It
  8. * adds shorthand functions that wrap around lengthy functions. For example:
  9. * the `on` function is a wrapper around `addEventListener`.
  10. *
  11. * @see [EventTarget Spec]{@link https://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventTarget}
  12. * @class EventTarget
  13. */
  14. var EventTarget = function EventTarget() {};
  15. /**
  16. * A Custom DOM event.
  17. *
  18. * @typedef {Object} EventTarget~Event
  19. * @see [Properties]{@link https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent}
  20. */
  21. /**
  22. * All event listeners should follow the following format.
  23. *
  24. * @callback EventTarget~EventListener
  25. * @this {EventTarget}
  26. *
  27. * @param {EventTarget~Event} event
  28. * the event that triggered this function
  29. *
  30. * @param {Object} [hash]
  31. * hash of data sent during the event
  32. */
  33. /**
  34. * An object containing event names as keys and booleans as values.
  35. *
  36. * > NOTE: If an event name is set to a true value here {@link EventTarget#trigger}
  37. * will have extra functionality. See that function for more information.
  38. *
  39. * @property EventTarget.prototype.allowedEvents_
  40. * @private
  41. */
  42. /**
  43. * @file src/js/event-target.js
  44. */
  45. EventTarget.prototype.allowedEvents_ = {};
  46. /**
  47. * Adds an `event listener` to an instance of an `EventTarget`. An `event listener` is a
  48. * function that will get called when an event with a certain name gets triggered.
  49. *
  50. * @param {string|string[]} type
  51. * An event name or an array of event names.
  52. *
  53. * @param {EventTarget~EventListener} fn
  54. * The function to call with `EventTarget`s
  55. */
  56. EventTarget.prototype.on = function (type, fn) {
  57. // Remove the addEventListener alias before calling Events.on
  58. // so we don't get into an infinite type loop
  59. var ael = this.addEventListener;
  60. this.addEventListener = function () {};
  61. Events.on(this, type, fn);
  62. this.addEventListener = ael;
  63. };
  64. /**
  65. * An alias of {@link EventTarget#on}. Allows `EventTarget` to mimic
  66. * the standard DOM API.
  67. *
  68. * @function
  69. * @see {@link EventTarget#on}
  70. */
  71. EventTarget.prototype.addEventListener = EventTarget.prototype.on;
  72. /**
  73. * Removes an `event listener` for a specific event from an instance of `EventTarget`.
  74. * This makes it so that the `event listener` will no longer get called when the
  75. * named event happens.
  76. *
  77. * @param {string|string[]} type
  78. * An event name or an array of event names.
  79. *
  80. * @param {EventTarget~EventListener} fn
  81. * The function to remove.
  82. */
  83. EventTarget.prototype.off = function (type, fn) {
  84. Events.off(this, type, fn);
  85. };
  86. /**
  87. * An alias of {@link EventTarget#off}. Allows `EventTarget` to mimic
  88. * the standard DOM API.
  89. *
  90. * @function
  91. * @see {@link EventTarget#off}
  92. */
  93. EventTarget.prototype.removeEventListener = EventTarget.prototype.off;
  94. /**
  95. * This function will add an `event listener` that gets triggered only once. After the
  96. * first trigger it will get removed. This is like adding an `event listener`
  97. * with {@link EventTarget#on} that calls {@link EventTarget#off} on itself.
  98. *
  99. * @param {string|string[]} type
  100. * An event name or an array of event names.
  101. *
  102. * @param {EventTarget~EventListener} fn
  103. * The function to be called once for each event name.
  104. */
  105. EventTarget.prototype.one = function (type, fn) {
  106. // Remove the addEventListener alialing Events.on
  107. // so we don't get into an infinite type loop
  108. var ael = this.addEventListener;
  109. this.addEventListener = function () {};
  110. Events.one(this, type, fn);
  111. this.addEventListener = ael;
  112. };
  113. /**
  114. * This function causes an event to happen. This will then cause any `event listeners`
  115. * that are waiting for that event, to get called. If there are no `event listeners`
  116. * for an event then nothing will happen.
  117. *
  118. * If the name of the `Event` that is being triggered is in `EventTarget.allowedEvents_`.
  119. * Trigger will also call the `on` + `uppercaseEventName` function.
  120. *
  121. * Example:
  122. * 'click' is in `EventTarget.allowedEvents_`, so, trigger will attempt to call
  123. * `onClick` if it exists.
  124. *
  125. * @param {string|EventTarget~Event|Object} event
  126. * The name of the event, an `Event`, or an object with a key of type set to
  127. * an event name.
  128. */
  129. EventTarget.prototype.trigger = function (event) {
  130. var type = event.type || event;
  131. if (typeof event === 'string') {
  132. event = { type: type };
  133. }
  134. event = Events.fixEvent(event);
  135. if (this.allowedEvents_[type] && this['on' + type]) {
  136. this['on' + type](event);
  137. }
  138. Events.trigger(this, event);
  139. };
  140. /**
  141. * An alias of {@link EventTarget#trigger}. Allows `EventTarget` to mimic
  142. * the standard DOM API.
  143. *
  144. * @function
  145. * @see {@link EventTarget#trigger}
  146. */
  147. EventTarget.prototype.dispatchEvent = EventTarget.prototype.trigger;
  148. exports['default'] = EventTarget;