Gesso.Interactions.Internal

type EventProp event i = (event -> i) -> IProp HTMLcanvas i

An IProp is an HTML property, with kind IProp :: Row Type -> Type -> Type, where the row type is the set of all valid properties for the element that this property will be attached to.

Typically, an event listener type would look like this:

onMouseMove
  :: forall r i
   . (MouseEvent -> i)
  -> IProp (onMouseMove :: MouseEvent | r) i

where the event type is predetermined and the row type is parameterized to allow any element with an onMouseMove property.

This generic EventProp is the inverse: parameterized to allow any event type, but the property must be a valid property of the HTMLcanvas row.

type Handler event state = event -> UpdateFunction state

An event handler is a variant of an update function, which receives an event and produces an update function in response.

data Interaction event state

An Interaction is a combination event listener and handler which is turned into an HTML property and attached to a Gesso canvas. They can be constructed with the "on" functions (onMouseMove, onKeyDown, etc.)

Constructors

• Interaction (forall i. EventProp event i) (Handler event state)

type Interactions state = { base :: Array (Interaction Event state), clipboard :: Array (Interaction ClipboardEvent state), drag :: Array (Interaction DragEvent state), focus :: Array (Interaction FocusEvent state), keyboard :: Array (Interaction KeyboardEvent state), mouse :: Array (Interaction MouseEvent state), pointer :: Array (Interaction PointerEvent state), touch :: Array (Interaction TouchEvent state), wheel :: Array (Interaction WheelEvent state) }

Interactions is a record containing arrays of interactions for each type of event that Canvas supports. It's used in Gesso.Application.AppBehavior to add event handlers to a component.

toProps :: forall state i. (UpdateFunction state -> i) -> Interactions state -> Array (IProp HTMLcanvas i)

Convert an Interactions record to an array of HTML properties. The return value of the toCallback parameter, i, is only known by the component and should be whatever Action type the component has, like QueueUpdate in Canvas.

data ClipboardEvent

data Event

Basic type for all DOM events.

data DragEvent

data PointerEvent

data TouchEvent

data FocusEvent

data KeyboardEvent

data MouseEvent

data WheelEvent