Static Optional InheritWhen set to true, the child class inherits from the parent
properties, as shown in the following example:
import {Component, Property} from '@wonderlandengine/api';
class Parent extends Component {
static TypeName = 'parent';
static Properties = {parentName: Property.string('parent')}
}
class Child extends Parent {
static TypeName = 'child';
static Properties = {name: Property.string('child')}
static InheritProperties = true;
start() {
// Works because `InheritProperties` is `true`.
console.log(`${this.name} inherits from ${this.parentName}`);
}
}
Properties defined in descendant classes will override properties with the same name defined in ancestor classes.
Defaults to true.
Static PropertiesProperties of this component class.
Properties are public attributes that can be configured via the Wonderland Editor.
Example:
import { Component, Type } from '@wonderlandengine/api';
class MyComponent extends Component {
static TypeName = 'my-component';
static Properties = {
myBoolean: { type: Type.Boolean, default: false },
myFloat: { type: Type.Float, default: false },
myTexture: { type: Type.Texture, default: null },
};
}
Properties are automatically added to each component instance, and are accessible like any JS attribute:
// Creates a new component and set each properties value:
const myComponent = object.addComponent(MyComponent, {
myBoolean: true,
myFloat: 42.0,
myTexture: null
});
// You can also override the properties on the instance:
myComponent.myBoolean = false;
myComponent.myFloat = -42.0;
Reference types (i.e., mesh, object, etc...) can also be listed as required:
import {Component, Property} from '@wonderlandengine/api';
class MyComponent extends Component {
static Properties = {
myObject: Property.object({required: true}),
myAnimation: Property.animation({required: true}),
myTexture: Property.texture({required: true}),
myMesh: Property.mesh({required: true}),
}
}
Please note that references are validated once before the call to Component.start only, via the Component.validateProperties method.
Static TypeStatic Optional onCalled when this component class is registered.
This callback can be used to register dependencies of a component, e.g., component classes that need to be registered in order to add them at runtime with Object3D.addComponent, independent of whether they are used in the editor.
class Spawner extends Component {
static TypeName = 'spawner';
static onRegister(engine) {
engine.registerComponent(SpawnedComponent);
}
// You can now use addComponent with SpawnedComponent
}
This callback can be used to register different implementations of a component depending on client features or API versions.
// Properties need to be the same for all implementations!
const SharedProperties = {};
class Anchor extends Component {
static TypeName = 'spawner';
static Properties = SharedProperties;
static onRegister(engine) {
if(navigator.xr === undefined) {
/* WebXR unsupported, keep this dummy component */
return;
}
/* WebXR supported! Override already registered dummy implementation
* with one depending on hit-test API support */
engine.registerComponent(window.HitTestSource === undefined ?
AnchorWithoutHitTest : AnchorWithHitTest);
}
// This one implements no functions
}
true if the component is marked as active and its scene is active.
Set whether this component is active.
Activating/deactivating a component comes at a small cost of reordering components in the respective component manager. This function therefore is not a trivial assignment.
Does nothing if the component is already activated/deactivated.
New active state.
Hosting engine instance.
true if the component is destroyed, false otherwise.
If WonderlandEngine.erasePrototypeOnDestroy is true,
reading a custom property will not work:
engine.erasePrototypeOnDestroy = true;
const comp = obj.addComponent('mesh');
comp.customParam = 'Hello World!';
console.log(comp.isDestroyed); // Prints `false`
comp.destroy();
console.log(comp.isDestroyed); // Prints `true`
console.log(comp.customParam); // Throws an error
1.1.1
true if the component is marked as active in the scene, false otherwise.
At the opposite of Component.active, this accessor doesn't take into account whether the scene is active or not.
The object this component is attached to.
Scene this component is part of.
The name of this component's type
Copy all the properties from src into this instance.
The source component to copy from.
Reference to self (for method chaining).
Only properties are copied. If a component needs to copy extra data, it needs to override this method.
class MyComponent extends Component {
nonPropertyData = 'Hello World';
copy(src) {
super.copy(src);
this.nonPropertyData = src.nonPropertyData;
return this;
}
}
This method is called by Object3D.clone. Do not attempt to: - Create new component - Read references to other objects
When cloning via Object3D.clone, this method will be called before Component.start.
JavaScript component properties aren't retargeted. Thus, references inside the source object will not be retargeted to the destination object, at the exception of the skin data on MeshComponent and AnimationComponent.
Checks equality by comparing ids and not the JavaScript reference.
Use JavaScript reference comparison instead:
const componentA = obj.addComponent('mesh');
const componentB = obj.addComponent('mesh');
const componentC = componentB;
console.log(componentA === componentB); // false
console.log(componentA === componentA); // true
console.log(componentB === componentC); // true
Optional initTriggered when the component is initialized by the runtime. This method will only be triggered once after instantiation.
During the initialization phase, this.scene will not match
engine.scene, since engine.scene references the active scene:
import {Component} from '@wonderlandengine/api';
class MyComponent extends Component{
init() {
const activeScene = this.engine.scene;
console.log(this.scene === activeScene); // Prints `false`
}
start() {
const activeScene = this.engine.scene;
console.log(this.scene === activeScene); // Prints `true`
}
}
Optional onTriggered when the component is removed from its object. For more information, please have a look at Component.onDestroy.
This method will not be triggered for inactive scene being destroyed.
0.9.0
Use Component.resetProperties instead.
Reset the component properties to default.
Reference to self (for method chaining).
This is automatically called during the component instantiation.
Optional updateTriggered every frame by the runtime.
You should perform your business logic in this method. Example:
import { Component, Type } from '@wonderlandengine/api';
class TranslateForwardComponent extends Component {
static TypeName = 'translate-forward-component';
static Properties = {
speed: { type: Type.Float, default: 1.0 }
};
constructor() {
this._forward = new Float32Array([0, 0, 0]);
}
update(dt) {
this.object.getForward(this._forward);
this._forward[0] *= this.speed;
this._forward[1] *= this.speed;
this._forward[2] *= this.speed;
this.object.translate(this._forward);
}
}
Elapsed time between this frame and the previous one, in seconds.
Generated using TypeDoc
Network component which is added by NetworkConfigurationComponent to synchronize object transforms.
This will update the transforms of myObject3DInstance by received server values, or send the updated transforms of the instance to the server.