API Docs for: 3.13.0
Show:

File: event/js/outside.js

  1. /**
  2. * Outside events are synthetic DOM events that fire when a corresponding native
  3. * or synthetic DOM event occurs outside a bound element.
  4. *
  5. * The following outside events are pre-defined by this module:
  6. * <ul>
  7. * <li>blur</li>
  8. * <li>change</li>
  9. * <li>click</li>
  10. * <li>dblclick</li>
  11. * <li>focus</li>
  12. * <li>keydown</li>
  13. * <li>keypress</li>
  14. * <li>keyup</li>
  15. * <li>mousedown</li>
  16. * <li>mousemove</li>
  17. * <li>mouseout</li>
  18. * <li>mouseover</li>
  19. * <li>mouseup</li>
  20. * <li>select</li>
  21. * <li>submit</li>
  22. * </ul>
  23. *
  24. * Define new outside events with
  25. * <code>Y.Event.defineOutside(eventType);</code>.
  26. * By default, the created synthetic event name will be the name of the event
  27. * with "outside" appended (e.g. "click" becomes "clickoutside"). If you want
  28. * a different name for the created Event, pass it as a second argument like so:
  29. * <code>Y.Event.defineOutside(eventType, "yonderclick")</code>.
  30. *
  31. * This module was contributed by Brett Stimmerman, promoted from his
  32. * gallery-outside-events module at
  33. * http://yuilibrary.com/gallery/show/outside-events
  34. *
  35. * @module event
  36. * @submodule event-outside
  37. * @author brettstimmerman
  38. * @since 3.4.0
  39. */
  40.  
  41. // Outside events are pre-defined for each of these native DOM events
  42. var nativeEvents = [
  43. 'blur', 'change', 'click', 'dblclick', 'focus', 'keydown', 'keypress',
  44. 'keyup', 'mousedown', 'mousemove', 'mouseout', 'mouseover', 'mouseup',
  45. 'select', 'submit'
  46. ];
  47.  
  48. /**
  49. * Defines a new outside event to correspond with the given DOM event.
  50. *
  51. * By default, the created synthetic event name will be the name of the event
  52. * with "outside" appended (e.g. "click" becomes "clickoutside"). If you want
  53. * a different name for the created Event, pass it as a second argument like so:
  54. * <code>Y.Event.defineOutside(eventType, "yonderclick")</code>.
  55. *
  56. * @method defineOutside
  57. * @param {String} event DOM event
  58. * @param {String} name (optional) custom outside event name
  59. * @static
  60. * @for Event
  61. */
  62. Y.Event.defineOutside = function (event, name) {
  63. name = name || (event + 'outside');
  64.  
  65. var config = {
  66.  
  67. on: function (node, sub, notifier) {
  68. sub.handle = Y.one('doc').on(event, function(e) {
  69. if (this.isOutside(node, e.target)) {
  70. e.currentTarget = node;
  71. notifier.fire(e);
  72. }
  73. }, this);
  74. },
  75.  
  76. detach: function (node, sub, notifier) {
  77. sub.handle.detach();
  78. },
  79.  
  80. delegate: function (node, sub, notifier, filter) {
  81. sub.handle = Y.one('doc').delegate(event, function (e) {
  82. if (this.isOutside(node, e.target)) {
  83. notifier.fire(e);
  84. }
  85. }, filter, this);
  86. },
  87.  
  88. isOutside: function (node, target) {
  89. return target !== node && !target.ancestor(function (p) {
  90. return p === node;
  91. });
  92. }
  93. };
  94. config.detachDelegate = config.detach;
  95.  
  96. Y.Event.define(name, config);
  97. };
  98.  
  99. // Define outside events for some common native DOM events
  100. Y.Array.each(nativeEvents, function (event) {
  101. Y.Event.defineOutside(event);
  102. });
  103.