Options
All
  • Public
  • Public/Protected
  • All
Menu

Main is the primary interface that controls loading of presets, starting stopping animations, etc. It maintains the root Component and the hierarchy of components under it. A typical usage involves creating an Analyser and a Main object. The Analyser interfaces with your audio source and generates the visualization data, while the Main object serves as the primary interface for controlling the visualization. E.g:

const analyser = new Webvs.WebAudioAnalyser();
const webvs = new Webvs.Main({
    canvas: document.getElementById("canvas"),
    analyser: analyser,
    showStat: true
});
webvs.loadPreset({
  "clearFrame": true,
  "components": [
      {
          "type": "SuperScope",
          "source": "WAVEFORM",
          "code": {
              "perPoint": "x=i*2-1;y=v;"
          },
          "colors": ["#ffffff"]
      }
  ]
});
webvs.start();
analyser.load("music.ogg");
analyser.play();

Hierarchy

Implements

Index

Constructors

constructor

  • Constructs a Webvs Main object that can load and render visualization presets

    Parameters

    Returns Main

Properties

Private analyser

analyser: AnalyserAdapter

Private animReqId

animReqId: number

Private bootTime

bootTime: number

Private buffers

buffers: object

Type declaration

Private cancelAnimationFrame

cancelAnimationFrame: function

Type declaration

    • (reqId: any): void
    • Parameters

      • reqId: any

      Returns void

Private canvas

canvas: HTMLCanvasElement

Private componentRegistry

componentRegistry: ComponentRegistry

Private contextLostHander

contextLostHander: function

Type declaration

    • (event: any): void
    • Parameters

      • event: any

      Returns void

Private contextRestoredHander

contextRestoredHander: function

Type declaration

    • (event: any): void
    • Parameters

      • event: any

      Returns void

Private copier

copier: CopyProgram

Private isStarted

isStarted: boolean

Private meta

meta: any

Private presetResourceKeys

presetResourceKeys: string[] = []

Private rctx

Private registerBank

registerBank: object

Type declaration

  • [key: string]: number

Private requestAnimationFrame

requestAnimationFrame: function

Type declaration

    • (callback: function): any
    • Parameters

      • callback: function
          • (): void
          • Returns void

      Returns any

Private rootComponent

rootComponent: Component

Private rsrcMan

Private stats

stats: Stats

Private tempTSM

Static prefixed

prefixed: string | boolean

Static version

version: string = WEBVS_VERSION

version of Webvs library

Methods

Private _initComponentRegistry

  • _initComponentRegistry(): void

Private _initGl

  • _initGl(): void

Private _initResourceManager

  • _initResourceManager(prefix: string): void
  • Parameters

    • prefix: string

    Returns void

Private _registerContextEvents

  • _registerContextEvents(): void

Private _setupRoot

  • _setupRoot(preset: any): void
  • Parameters

    • preset: any

    Returns void

Private _startAnimation

  • _startAnimation(): void

Private _stopAnimation

  • _stopAnimation(): void

addListener

  • addListener(event: string | symbol, fn: ListenerFn, context?: any): this
  • Parameters

    • event: string | symbol
    • fn: ListenerFn
    • Optional context: any

    Returns this

cacheBuffer

  • cacheBuffer(name: string, buffer: Buffer): void
  • Cache webgl Buffers. Useful to store buffers that can be shared. e.g. geometries.

    Parameters

    • name: string

      Name of the buffer

    • buffer: Buffer

      Buffer to be cached

    Returns void

destroy

  • destroy(): void
  • Destroys and cleans up all resources

    Returns void

emit

  • emit(event: string | symbol, ...args: Array<any>): boolean
  • Calls each of the listeners registered for a given event.

    Parameters

    • event: string | symbol
    • Rest ...args: Array<any>

    Returns boolean

eventNames

  • eventNames(): Array<string | symbol>
  • Return an array listing the events for which the emitter has registered listeners.

    Returns Array<string | symbol>

get

  • get(key: string): any
  • Gets the current value of a preset property. Eg. main.get("meta")

    Parameters

    • key: string

      preset property to be returned

    Returns any

getAnalyser

getBootTime

  • getBootTime(): number
  • Returns the timestamp at which this instance was constructed

    Returns number

getBuffer

  • getBuffer(name: string): Buffer
  • Returns buffer cached under given name

    Parameters

    • name: string

      Name of the buffer

    Returns Buffer

    The buffer cached under given name. undefined if not found.

getComponentRegistry

getCopier

getRctx

getRegisterBank

  • getRegisterBank(): object
  • Returns register bank, a map of shared register values available in EEL code in components.

    Returns object

    • [key: string]: number

getRsrcMan

getTempTSM

Private handleRsrcReady

  • handleRsrcReady(): void

Private handleRsrcWait

  • handleRsrcWait(): void

Protected listenTo

  • listenTo(emitter: EventEmitter, event: string, callback: function): void
  • Add a listener to another EventEmitter.

    This provides an event subscription list facility. Allowing subclasses to listen to other emitters and remove all or some listeners with a single call to Model.stopListening, later.

    Parameters

    • emitter: EventEmitter

      the event emitter to listen to

    • event: string

      the name of the event to listen to

    • callback: function

      the callback for the event handler

        • (...args: any[]): void
        • Parameters

          • Rest ...args: any[]

          Returns void

    Returns void

listenerCount

  • listenerCount(event: string | symbol): number
  • Return the number of listeners listening to a given event.

    Parameters

    • event: string | symbol

    Returns number

listeners

  • listeners(event: string | symbol): Array<ListenerFn>
  • Return the listeners registered for a given event.

    Parameters

    • event: string | symbol

    Returns Array<ListenerFn>

loadPreset

  • loadPreset(preset: any): void
  • Loads a preset into this webvs main instance.

    Parameters

    • preset: any

      an object that contains the preset. The root object should have a components property which will contain an Array for component configurations for all the components. All component configurations should have a type property containing the string name of the Component. Other properties are specific to each component. The resources.uris property in preset is used to register resources with ResourceManager and has the same format accepted by the ResourceManager.registerUri.

    Returns void

notifyResize

  • notifyResize(): void
  • This function should be called if the canvas element's width or height attribute has changed. This allows Webvs to update and resize all the buffers.

    Returns void

off

  • off(event: string | symbol, fn?: ListenerFn, context?: any, once?: boolean): this
  • Parameters

    • event: string | symbol
    • Optional fn: ListenerFn
    • Optional context: any
    • Optional once: boolean

    Returns this

on

  • on(event: string | symbol, fn: ListenerFn, context?: any): this
  • Add a listener for a given event.

    Parameters

    • event: string | symbol
    • fn: ListenerFn
    • Optional context: any

    Returns this

once

  • once(event: string | symbol, fn: ListenerFn, context?: any): this
  • Add a one-time listener for a given event.

    Parameters

    • event: string | symbol
    • fn: ListenerFn
    • Optional context: any

    Returns this

removeAllListeners

  • removeAllListeners(event?: string | symbol): this
  • Remove all listeners, or those of the specified event.

    Parameters

    • Optional event: string | symbol

    Returns this

removeListener

  • removeListener(event: string | symbol, fn?: ListenerFn, context?: any, once?: boolean): this
  • Remove the listeners of a given event.

    Parameters

    • event: string | symbol
    • Optional fn: ListenerFn
    • Optional context: any
    • Optional once: boolean

    Returns this

resetCanvas

  • resetCanvas(): void
  • Resets and reinitializes all the components and canvas.

    Returns void

set

  • set(key: string | any, value: any, options?: any): boolean
  • Safely set an attribute(s).

    If the attribute set succeeds, a change:[attribute name] event is fired. change:[attribute name] event handler receives this object, the new value and options as arguments.

    Additionally a change event is also fired when all changes succeed. The change event receives this object and the options as arguments.

    Parameters

    • key: string | any

      the name of the attribute or map of values

    • value: any

      the new value of the attribute

    • Optional options: any

      this object is sent down to the event handlers, useful to things down to your handler. if options.silent is true then events are not fired.

    Returns boolean

Protected setAttribute

  • setAttribute(key: string, value: any, options: any): boolean

start

  • start(): void
  • Starts running the animation when ready. The animation may not start playing immediately because preset may use external resources which needs to be loaded asynchronously by the resource manager.

    Returns void

stop

  • stop(): void
  • Stops the animation

    Returns void

Protected stopListening

  • stopListening(emitter?: EventEmitter, event?: string, callback?: function): void
  • Removes to one or more listeners that were set earlier with calls to Model.listenTo.

    Use the arguments to filter subscriptions. eg: model.stopListening(em) will remove all listeners on emitter em. model.stopListening(em, 'change') will remove all listeners for change event on emitter em.

    Parameters

    • Optional emitter: EventEmitter

      the event emitter on which the listener was set

    • Optional event: string

      the event to be removed

    • Optional callback: function

      the callback to be removed

        • (...args: any[]): void
        • Parameters

          • Rest ...args: any[]

          Returns void

    Returns void

toJSON

  • toJSON(): any
  • Generates and returns the instantaneous preset JSON representation

    Returns any

    JSON representaton of the preset