Options
All
  • Public
  • Public/Protected
  • All
Menu

A Mouse Input element binds mouse, keyboard and touch as a single method of translating a cursor position.

see

InputModeSelectElement

Hierarchy

Index

Constructors

constructor

Events

Protected _dispatchInitializing

  • _dispatchInitializing(): void

Protected _dispatchReady

  • _dispatchReady(): void

Protected _dispatchTick

  • _dispatchTick(): void
  • when the input has performed any new effort, even if there is no new input found. i.e. webcam updated but no face was found, this still triggers

    Returns void

Properties

Protected _lastFoundPosition

_lastFoundPosition: [number, number] = [-1, -1]

the input's current target vector, this could be different if smoothing is more than 0

Protected _lastFoundTargetPosition

_lastFoundTargetPosition: [number, number] = [0, 0]

Protected _loop

_loop: Animitter = animitter()

Protected _wasAborted

_wasAborted: boolean = false

amplification

amplification: number = 1

contentSelector

contentSelector: string = ""

controls

controls: boolean = false

setting this property or attribute will display the input's calibration

disableClamp

disableClamp: boolean = false

disableTouchPreventsDefault

disableTouchPreventsDefault: boolean = false

enableKeyboard

enableKeyboard: boolean = false

inputType

inputType: InputType = "mouse"

label

label: string = "Keyboard / Mouse"

position

position: [number, number] = [-1, -1]

the input's vector that is updated whenever there is new input data

pressed

pressed: boolean = false

renderComplete

renderComplete: Promise<boolean>

Returns a promise which resolves after the element next renders. The promise resolves to true if the element rendered and false if the element did not render. This is useful when users (e.g. tests) need to react to the rendered state of the element after a change is made. This can also be useful in event handlers if it is desireable to wait to send an event until after rendering. If possible implement the _didRender method to directly respond to rendering within the rendering lifecycle.

selected

selected: boolean = false

this attribute is used on the HTML node to denote it is the selected input and to begin initializing

smoothing

smoothing: number = 0

a higher smoothing value (0-1) results in a slower and smoother interpolation towards the current position. This creates less jitter from an input but a high value can make the input feel slow.

targetPosition

targetPosition: [number, number] = [0, 0]

Accessors

canInitialize

  • get canInitialize(): boolean
  • is it ok to initialize this input? no if it is already initializing or it was aborted mid-initialization

    Returns boolean

contentElement

  • get contentElement(): HTMLElement | null
  • set contentElement(element: HTMLElement | null): void

contentX

  • get contentX(): number
  • the current X position as mapped to the contentElement

    Returns number

contentY

  • get contentY(): number
  • the current Y position as mapped to the contentElement

    Returns number

hasControls

  • get hasControls(): boolean

isInitializing

  • get isInitializing(): boolean
  • is the input currently in the phase of initializing itself?

    Returns boolean

isReady

  • get isReady(): boolean
  • has the input completed initialization and is currently in operation?

    Returns boolean

mode

  • get mode(): string
  • Returns string

Methods

Protected _applyRender

  • _applyRender(result: TemplateResult, node: Element | DocumentFragment): void
  • Renders the given lit-html template result into the given node. Implement to customize the way rendering is applied. This is should not typically be needed and is provided for advanced use cases.

    Parameters

    • result: TemplateResult

      lit-html template result to render

    • node: Element | DocumentFragment

      node into which to render

    Returns void

Protected _createEvent

  • _createEvent(type: string, bubbles?: boolean, composed?: boolean): ACCInputEvent
  • the Event that will be provided in every dispatched event from an input Most input's will override this to provide even more data unique to their input Input implementations can override this to provide extra details

    Parameters

    • type: string
    • Default value bubbles: boolean = true
    • Default value composed: boolean = true

    Returns ACCInputEvent

Protected _createRoot

  • _createRoot(): Element | DocumentFragment
  • Implement to customize where the element's template is rendered by returning an element into which to render. By default this creates a shadowRoot for the element. To render into the element's childNodes, return this.

    Returns Element | DocumentFragment

    Returns a node into which to render.

Protected _didRender

  • _didRender(_props: object, _changedProps: object, _prevProps: object): void
  • Called after element DOM has been rendered. Implement to directly control rendered DOM. Typically this is not needed as lit-html can be used in the _render method to set properties, attributes, and event listeners. However, it is sometimes useful for calling methods on rendered elements, like calling focus() on an element to focus it.

    Parameters

    • _props: object

      Current element properties

    • _changedProps: object

      Changing element properties

    • _prevProps: object

      Previous element properties

    Returns void

Protected _dispatchChange

  • _dispatchChange(): void

Protected _dispatchError

  • _dispatchError(error: Error): void

Protected _dispatchStop

  • _dispatchStop(): void

_firstRendered

  • _firstRendered(): void
  • Called after the element DOM is rendered for the first time. Implement to perform tasks after first rendering like capturing a reference to a static node which must be directly manipulated. This should not be commonly needed. For tasks which should be performed before first render, use the element constructor.

    Returns void

_flushProperties

  • _flushProperties(): void
  • Returns void

Protected _handleContentElementChanged

  • _handleContentElementChanged(contentElement: HTMLElement, previous: HTMLElement): void

_invalidateProperties

  • _invalidateProperties(): void
  • Override which provides tracking of invalidated state.

    Returns void

_propertiesChanged

_render

  • _render(__namedParameters: object): any
  • Parameters

    • __namedParameters: object
      • controls: any

    Returns any

Protected _shouldDispatchInput

  • _shouldDispatchInput(): boolean

_shouldPropertiesChange

  • _shouldPropertiesChange(_props: object, _changedProps: object, _prevProps: object): boolean
  • Override which returns the value of _shouldRender which users should implement to control rendering. If this method returns false, _propertiesChanged will not be called and no rendering will occur even if property values change or requestRender is called.

    Parameters

    • _props: object

      Current element properties

    • _changedProps: object

      Changing element properties

    • _prevProps: object

      Previous element properties

    Returns boolean

    Default implementation always returns true.

_shouldPropertyChange

  • _shouldPropertyChange(property: string, value: any, old: any): boolean
  • Parameters

    • property: string
    • value: any
    • old: any

    Returns boolean

Protected _shouldRender

  • _shouldRender(_props: object, _changedProps: object, _prevProps: object): boolean
  • Implement to control if rendering should occur when property values change or requestRender is called. By default, this method always returns true, but this can be customized as an optimization to avoid rendering work when changes occur which should not be rendered.

    Parameters

    • _props: object

      Current element properties

    • _changedProps: object

      Changing element properties

    • _prevProps: object

      Previous element properties

    Returns boolean

    Default implementation always returns true.

Protected _stepTowardsTarget

  • _stepTowardsTarget(): boolean
  • apply smoothing to the current position, moving towards the _targetPosition according to smoothing

    Returns boolean

    true if the position value changed

connectedCallback

  • connectedCallback(): void
  • Returns void

dispatchEvent

initialize

  • initialize(): Promise<this>

ready

  • ready(): void
  • Override which sets up element rendering by calling* _createRoot and _firstRendered.

    Returns void

requestRender

  • requestRender(): void
  • Call to request the element to asynchronously re-render regardless of whether or not any property changes are pending.

    Returns void

setPosition

  • setPosition(__namedParameters: [number, number]): void

setTargetPosition

  • setTargetPosition(__namedParameters: [number, number]): void

stop

  • stop(): void