Vatom View

Overview

VatomView is a convenience class for visually rendering a vAtom using a face view.

It's primary purpose is to act as the the main render of a vAtom. That is, it contains logic to both select the best face view (using a Face Selection Procedure) and to coordinate the displaying and updating of the face view.

Usage

The example below shows typical usage of the VatomView class.

1. An instance of VatomView is created.

let vv = new VatomView(bv, << vAtom >>, FaceSelection.Icon);
document.body.append(vv.element);

Updating the vAtom on the VatomView instance will execute the Vatom View Life Cycle (VVLC). This life cycle handles a number of items including:

1. the running of the provided FSP,
2. showing the loading view (or an error view if an error is encountered), and
3. showing the face view once the face view has completed loading (or an error view).

Custom Loader

The default loader applies to all VatomViews. These may be customized as follows:

// Custom loader
let myLoader = document.createElement('div');
myLoader.style.cssText = 'display: flex; align-items: center; justify-content: center; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;';
myLoader.innerText = 'Loading....';
let vv = new VatomView(bv, << vAtom >>, FaceSelection.Icon, { loader : myLoader});