Glazier.React.Event

This module based on ReactFluxPropertiesAndEvents.hs.

Documentation

data DOMEventTarget

The object that dispatched the event. https://developer.mozilla.org/en-US/docs/Web/API/Event/target

Instances

PToJSVal DOMEventTarget

Methods

pToJSVal :: DOMEventTarget -> JSVal

IsJSVal DOMEventTarget

Methods

jsval_ :: DOMEventTarget -> JSVal

ToJS DOMEventTarget

Methods

toJS :: DOMEventTarget -> JSVal

FromJS DOMEventTarget

Methods

fromJS :: JSVal -> IO (Maybe DOMEventTarget)

data DOMEvent

The native event https://developer.mozilla.org/en-US/docs/Web/API/Event

Instances

PToJSVal DOMEvent

Methods

pToJSVal :: DOMEvent -> JSVal

IsJSVal DOMEvent

Methods

jsval_ :: DOMEvent -> JSVal

ToJS DOMEvent

Methods

toJS :: DOMEvent -> JSVal

FromJS DOMEvent

Methods

fromJS :: JSVal -> IO (Maybe DOMEvent)

data SyntheticEvent

Every event in React is a synthetic event, a cross-browser wrapper around the native event. SyntheticEvent must only be used in the first part of eventHandler.

Instances

PToJSVal SyntheticEvent

Methods

pToJSVal :: SyntheticEvent -> JSVal

IsJSVal SyntheticEvent

Methods

jsval_ :: SyntheticEvent -> JSVal

ToJS SyntheticEvent

Methods

toJS :: SyntheticEvent -> JSVal

FromJS SyntheticEvent

Methods

fromJS :: JSVal -> IO (Maybe SyntheticEvent)

eventHandler :: NFData a => (evt -> a) -> (a -> b) -> evt -> b

Using the NFData idea from ReactFluxPropertiesAndEvents.hs React re-uses SyntheticEvent from a pool, which means it may no longer be valid if we lazily parse it. However, we still want lazy parsing so we don't parse unnecessary fields. Additionally, we don't want to block during the event handling.The reason this is a problem is because Javascript is single threaded, but Haskell is lazy. Therefore GHCJS threads are a strange mixture of synchronous and asynchronous threads, where a synchronous thread might be converted to an asynchronous thread if a "black hole" is encountered. See https://github.com/ghcjs/ghcjs-base/blob/master/GHCJS/Concurrent.hs This safe interface requires two input functions: 1. a function to reduce SyntheticEvent to a NFData. The mkEventCallback will ensure that the NFData is forced which will ensure all the required fields from Synthetic event has been parsed. This function must not block. 2. a second function that uses the NFData. This function is allowed to block. mkEventHandler results in a function that you can safely pass into syncCallback1 with ContinueAsync.

eventHandlerM :: (Monad m, NFData a) => (evt -> m a) -> (a -> m b) -> evt -> m b

a monadic version of eventHandler The monad's effects must not block!

data Event

Every SyntheticEvent can be parsed to an Event. Event must only be used in the first part of eventHandler.

Constructors

Event Bool Bool DOMEventTarget Bool Int Bool DOMEvent DOMEventTarget Int JSString

preventDefault :: SyntheticEvent -> IO ()

isDefaultPrevented :: SyntheticEvent -> Bool

stopPropagation :: SyntheticEvent -> IO ()

isPropagationStopped :: SyntheticEvent -> Bool

parseEvent :: SyntheticEvent -> IO Event

data MouseEvent

Mouse and Drag/Drop events MouseEvent must only be used in the first part of eventHandler. https://facebook.github.io/react/docs/events.html#mouse-events https://developer.mozilla.org/en-US/docs/Web/Events Event names (eventType) onClick (click) onContextMenu (contextmenu) onDoubleClick (dblclick) onDrag (drag) onDragEnd (dragend) onDragEnter (dragenter) onDragExit (dragexit) onDragLeave (dragleave) onDragOver (dragover) onDragStart (dragstart) onDrop (drop) onMouseDown (mousedown) onMouseEnter (mouseenter) onMouseLeave (mouseleave) onMouseMove (mousemove) onMouseOut (mouseout) onMouseOver (mouseover) onMouseUp (mouseup)

Constructors

MouseEvent Bool Int Int Int Int Bool (JSString -> Bool) Bool Int Int DOMEventTarget Int Int Bool

parseMouseEvent :: SyntheticEvent -> IO (Maybe MouseEvent)

We can lie about this not being in IO because within the strict part of eventHandlerM the SyntheticEvent is effectively immutable.

data KeyboardEvent

Keyboard events KeyboardEvent must only be used in the first part of eventHandler. https://facebook.github.io/react/docs/events.html#keyboard-events Event names (eventType) onKeyDown (keydown) onKeyPress (keypress) onKeyUp (keyyp)

Constructors

KeyboardEvent Bool Int Bool (JSString -> Bool) JSString Int JSString Int Bool Bool Bool Int

parseKeyboardEvent :: SyntheticEvent -> IO (Maybe KeyboardEvent)

We can lie about this not being in IO because within the strict part of eventHandlerM the SyntheticEvent is effectively immutable.