DOM \ Events

Dealing with events in Fron is a little different, because we are using wrapping here too:

• addEventListener is just on if you want to attach it with capture use the banged version on!
• since we are wrapping listeners the removeEventListener (it became only off) works a differently:
  • If no arguments are passed it will remove all event listeners
  • If only one argument are passed it will remove all event listeners with that type
  • If two arguments are passed it will remove only that listener
• delegate will delegate events only that matches the given selector
• with trigger you can trigger CustomEvent directly

Examples:

div = DOM::Element.new 'div'

# Save the listener
listener = div.on :click do
  puts 'I am clicked'
end

# Remove only that listener
div.off :click, listener

# Only propagate clicks for span
div.delegate :click, 'span' do
  puts 'A span is clicked'
end

# Remove all click events
div.off :click

# Remove all events
div.off

# Trigger events with custom data
div.trigger :click, { data: 'data' }
div.on :click do |event|
  puts event.data # data
end