Orillusion Web Engine

The UIImage class is a GUI component used to display visual media such as images, sprites, or videos within the Orillusion UI system. It inherits from UIRenderAble and can be used as a child of a UIPanel.

const image = new UIImage();
// Further configuration via properties and accessors

In Orillusion, materials are applied to objects via the MeshRenderer component to simulate color, lighting, and texture properties. The engine provides two primary material models:

1. UnLitMaterial: Does not calculate lighting or shadows; it only renders the raw color and texture information.
2. LitMaterial: A Physically-Based Rendering (PBR) material designed to simulate realistic lighting effects.

Note: Using glTF files is recommended, as they contain material information that the engine automatically parses and applies to objects.

An APatch is a component used to attach specific functionality to an Object3D. It acts as a modular piece of logic that belongs to an owner Object3D.

Key characteristics:

• Ownership: Every APatch has an associated object3D owner.
• Lifecycle: Components can receive update events at each frame (e.g., onUpdate, onLateUpdate).
• Control: You can enable or disable a patch using the enable accessor. Enabled components receive updates, while disabled ones do not.

In Orillusion, ComponentBase is the fundamental class used to attach functionality to an Object3D. Every component has an owner (an Object3D) to which it is attached. Components are lifecycle-aware and can receive update events at every frame, allowing you to implement custom logic like movement, animation, or physics that runs automatically within the engine's loop.

Common specialized components that inherit from ComponentBase include:

• Transform: Manages position, rotation, and scale.
• AnimatorComponent: Handles animations.
• ColliderComponent: Manages collision detection.
• Camera3D: Defines camera behavior.
• PostProcessingComponent: Manages visual effects.

Orillusion provides the @orillusion/graphic package for efficient real-time drawing of points, lines, planes, and volumes. It offers three main modules:

1. Graphic3D: Provides basic line-drawing capabilities, useful for auxiliary lines and simple shapes.
2. Graphic3DMesh Renderer: Creates a collection of cloned Mesh instances in a single renderer. It allows for high-performance batching where each clone can have its own Transform, Texture, and Material properties.
3. Shape3D Renderer: Used for creating complex custom shapes like EllipseShape3D, RoundRectShape3D, and CircleShape3D. For continuous drawing shapes like Path2DShape3D or Path3DShape3D, the API follows the CanvasPath design, making it familiar to web developers.

A Ghost Object is a special collision object used for overlap detection (trigger zones) without physical reaction. Unlike a Rigidbody, a Ghost Object:

• Does not react to forces (gravity, impacts).
• Does not apply forces to other objects.
• Is ideal for area detection or trigger zones.

In Orillusion, you can use the GhostTrigger component to implement this behavior.

import { GhostTrigger, CollisionShapeUtil } from "@orillusion/physics";

let ghostTrigger = object.addComponent(GhostTrigger);
ghostTrigger.shape = CollisionShapeUtil.createBoxShape(object);
ghostTrigger.collisionEvent = (contactPoint, selfBody, otherBody) => {
    // Handle trigger/overlap event
}

Textures are essential resources in 3D rendering used to provide color values for fragments during shading. Orillusion supports several texture types: