Options
All
  • Public
  • Public/Protected
  • All
Menu

WARNING: This interface is not stable yet and may be subject to change. It is only intended for internal use at this point.

Describes a piece of content that is renderable into a HTML DOM Element. An instance of IRenderable can only be rendered into one element at a time. For example, renderable.renderTo(element1); renderable.renderTo(element2); will cause the renderable to only be rendered into element2.

An IRenderable can transition between the following states in the following order, one step at a time:

  • DESTROYED: The instance is destroyed. Once this state is reached, it cannot transition to another state,
  • CREATED: The initial state of an IRenderable. Transition to this state by calling remove().
  • ATTACHED_TO_DOM: The Renderable is attached to the DOM, but not visible to the user. Animations and publication scripts should not run while in this mode. The user cannot interact with any content. Transition to this state by calling renderTo(), or setVisible(false).
  • VISIBLE: The Renderable is attached to the DOM and visible to the user. Animations and publication scripts should now be running. Transition to this state by calling setVisible(true).

For example: Calling renderable.destroy() when the current state is VISIBLE has the same effect as calling: renderable.setVisible(false); // Transition to "ATTACHED_TO_DOM" renderable.remove(); // Transition to "CREATED" renderable.destroy(); // Transition to "DESTROYED"

Hierarchy

Index

Methods

addStateChangeListener

  • addStateChangeListener(listener: (renderable: IRenderable) => void): void
  • Add a listener that will be called when the RenderableState changes or when "rendering completed" switches between false and true.

    Parameters

    Returns void

destroy

  • destroy(): void
  • Destroys this instance, removing itself from the element it is currently rendered into and releasing any used resources. After this method is called, calling other methods are no-ops. getTargetState() and getCurrentState() will always return DESTROYED. Rendering completed change listeners will be called called with false, and all added listeners will thereafter be removed.

    You should NOT call this method if this instance was retrieved from a IRenderablePageStream. Use IRenderablePageStream.unloadPage() instead.

    Returns void

getState

isRenderingCompleted

  • isRenderingCompleted(): boolean
  • If this renderable has finished its rendering operation so that it can be displayed without any artifacts. You can use addRenderingCompletedChangeListener() to react when this value changes.

    Returns boolean

isRenderingPaused

  • isRenderingPaused(): boolean
  • If rendering tasks in this renderable should be paused. Is initially false.

    Returns boolean

remove

  • remove(): void
  • Removes this instance from the element it was previously rendered into. This will cancel any ongoing rendering process. isRenderingCompleted() will return false after this method has been called.

    Returns void

removeStateChangeListener

  • removeStateChangeListener(listener: (renderable: IRenderable) => void): void
  • Removes a listener previously added with addStateChangeListener().

    Parameters

    Returns void

renderTo

  • renderTo(targetElement: HTMLElement): void
  • Render to the DOM by appending one or more nodes into the specified Element. If this instance is currently rendered into another Element, remove() will be called internally before rendering into the specified Element.

    After this method returns, the getState() method will return ATTACHED_TO_DOM, even if the implementation has delegated the rendering to an async process.

    When calling this method, the passed element should be position offscreen, have an overlay element that "hides" the Renderables content, or have its visibility set to "hidden". This is to avoid rendering glitches while the IRenderable is rendered to the DOM.

    You should NOT use "display: none" as this may cause the rendering to fail as many DOM APIs related with measuring returns 0.

    When rendering process is complete, isRenderingCompleted() will return true, and all listeners added with addRenderingCompletedChangeListener() will be called.

    Parameters

    • targetElement: HTMLElement

      The element to render into. Must be an element attached to the DOM.

    Returns void

setRenderingPaused

  • setRenderingPaused(paused: boolean): void
  • Called by the reading system if this renderable should try pause its rendering process. This method is typically called with true for offscreen pages, while visible pages are rendering.

    Initially the renderable should have its renderingPaused state set to false.

    Parameters

    • paused: boolean

    Returns void

setVisible

  • setVisible(visible: boolean): void
  • Performs a transition between ATTACHED_TO_DOM and VISIBLE state. Calling this method if this instance is in none of those states is an error.

    Parameters

    • visible: boolean

    Returns void

Generated using TypeDoc