Vectorly AI Filters Library

Vectorly AI Filters Library

Class

vectorlyOffscreenProcessor

new vectorlyOffscreenProcessor(video, config)

constructor - Initialize Vectorly upscaler on a <video> tag

Parameters

  • video HTMLVideoElement

    HTML5 video DOM node input

  • config vectorlyUpscaler~config

    Configuration for upscaler. Only token is required. See upscaler config for more options

    Properties

    • token string

      required; Token used to fetch models from server; Signup on Upscaler dashboard to get the token

Examples

Loading directly from cdn into html 

<script src="https://cdn.vectorly.io/v2/latest/vectorly-upscaler.js"> </script>
<video id="my-video" src="your-video-url"> </video>

<script>
   var video = document.getElementById("my-video")
   var upscaler = new vectorlyUpscaler(video, {token: 'your-model-token'})
</script>

Loading from npm package 

import vectorlyUpscaler from '@vectorly-io/ai-upscaler'

const video = document.getElementById("my-video")
const upscaler = new vectorlyUpscaler(video, {token: 'your-model-token'})

Methods

async

changeNetwork(networkParams)

async changeNetwork - Change the model network and parameters being used to render

This method is still WIP. Expect some lag when changing the networks

Parameters

disable()

disable - Disables video upscaler

enable()

enable - Enables video upscaler

on(event, callback)

on - Register event listener

Event listeners can also be chained as shown in example

Parameters

  • event string

    Event type string. Can be load, error, start, stop;

  • callback function

    Function to be called on event fired

Example

Add upscaler event listeners to vectorlyUpscaler 

upscaler
   .on('load', function () {
       console.log("Upscaler initialized"); })
   .on('error', function () {
       console.log("Failed to initialize"); })
   .on('start', function () {
       console.log("Starting upscaling"); })
   .on('stop', function () {
       console.log("Stopping upscaling"); })

Listens to events