Keeps track of viewport position, viewport dimensions and element positions.

Similar to Browser.Dom.Viewport with the addition of maxX and maxY.

You can use maxX and maxY to check if an element has ever been in the viewport before.

Similar to Browser.Dom.Element without scene and viewport.

Takes a list of element ids you want to track and attempts to find them on the current page.

A message type for the state to update.

Update viewport size and element positions.

Update current viewport x and y offset.

Subscribe to browser resize events to recalculate element positions.

Track element positions after you've initialized the state.

Use this when the page content moves around after initialization, like for example when images load and stuff gets pushed down.

True if the element with the given id is in the current viewport.

note: The result is a Maybe because the element might not be on the page at all.

True if the element with the given id is in or above the current viewport.

note: The result is a Maybe because the element might not be on the page at all.

True if the element with the given id is in the current viewport but with an offset. A positive offset will make the viewport smaller and vice versa.

note: The result is a Maybe because the element might not be on the page at all.

True if the element with the given id is in or above the current viewport but an offset. A positive offset will make the viewport smaller and vice versa.

note: The result is a Maybe because the element might not be on the page at all.

Write your own check function.

For example isInOrAboveViewWithMargin is implemented like:

isInOrAboveViewWithMargin : String -> Margin -> State -> Maybe Bool
isInOrAboveViewWithMargin id margin state =
    let
        calc { viewport } element =
            (viewport.y - margin.bottom + viewport.height > element.y)
                && (viewport.x - margin.right + viewport.width > element.x)
    in
    custom (\a b -> Maybe.map (calc a) b) id state

note: Element is a Maybe because the element might not be on the page at all.